feat: shift focus from one window to another. and make code consistent

ui/login/login.go

@@ -143,30 +143,30 @@ func (s State) View() string {
 		}
 	}
 
-	checkbox := &blurredCheckbox
+	checkbox := &BlurredCheckbox
 	// if the checkbox is focused
 	if s.FocusIndex == len(s.Inputs) {
-		checkbox = &focusedCheckbox
+		checkbox = &FocusedCheckbox
 		// if tls is enabled
 		if s.TLS {
-			checkbox = &focusedCheckedCheckbox
+			checkbox = &FocusedCheckboxChecked
 		}
 	}
 
 	// if the checkbox is not focused and tls is enabled
 	if s.FocusIndex != len(s.Inputs) && s.TLS {
-		checkbox = &blurredCheckedCheckbox
+		checkbox = &BlurredCheckboxChecked
 	}
 
 	fmt.Fprintf(&sb, "\n%s\n", *checkbox)
 
-	button := &blurredButton
+	button := &BlurredButton
 	if s.FocusIndex == len(s.Inputs)+1 {
-		button = &focusedButton
+		button = &FocusedButton
 	}
 	fmt.Fprintf(&sb, "\n%s\n", *button)
 
-	screen := lipgloss.JoinVertical(0, welcomeMsgStyle.Render(WelcomeMsg), ui.DialogStyle.Render(sb.String()))
+	screen := lipgloss.JoinVertical(0, WelcomeMsgStyle.Render(WelcomeMsg), ui.DialogStyle.Render(sb.String()))
 
 	final := lipgloss.Place(ui.MainStyle.GetWidth(), ui.MainStyle.GetHeight(), lipgloss.Center, lipgloss.Top, screen)
 

ui/login/styles.go

@@ -33,18 +33,18 @@ const WelcomeMsg = `
 `
 
 var (
-	welcomeMsgStyle = lipgloss.NewStyle().
+	WelcomeMsgStyle = lipgloss.NewStyle().
 			Padding(0, 5).
 			MarginBottom(5)
 
-	focusedButton = lipgloss.NewStyle().
+	FocusedButton = lipgloss.NewStyle().
 			Background(lipgloss.Color("105")).
 			Foreground(lipgloss.Color("255")).
 			MarginTop(1).
 			Padding(0, 2).
 			Align(lipgloss.Center).
 			Render("Connect")
-	blurredButton = lipgloss.NewStyle().
+	BlurredButton = lipgloss.NewStyle().
 			Background(lipgloss.Color("#809070")).
 			Foreground(lipgloss.Color("#EEEEEE")).
 			MarginTop(1).
@@ -52,22 +52,22 @@ var (
 			Align(lipgloss.Center).
 			Render("Connect")
 
-	focusedCheckbox = lipgloss.NewStyle().
+	FocusedCheckbox = lipgloss.NewStyle().
 			Foreground(lipgloss.Color("105")).
 			MarginTop(1).
 			Render("[ ] Enable TLS")
 
-	blurredCheckbox = lipgloss.NewStyle().
+	BlurredCheckbox = lipgloss.NewStyle().
 			Foreground(lipgloss.Color("#EEEEEE")).
 			MarginTop(1).
 			Render("[ ] Enable TLS")
 
-	focusedCheckedCheckbox = lipgloss.NewStyle().
+	FocusedCheckboxChecked = lipgloss.NewStyle().
 				Foreground(lipgloss.Color("105")).
 				MarginTop(1).
 				Render("[x] Enable TLS")
 
-	blurredCheckedCheckbox = lipgloss.NewStyle().
+	BlurredCheckboxChecked = lipgloss.NewStyle().
 				Foreground(lipgloss.Color("#EEEEEE")).
 				MarginTop(1).
 				Render("[x] Enable TLS")

ui/mainscreen/input.go

@@ -30,22 +30,16 @@ type InputState struct {
 func NewInputBox() InputState {
 	input := textinput.NewModel()
 	input.Placeholder = "Send a message..."
-	// input.Focus()
-	state := InputState{input, InputboxStyle}
+	input.Focus()
+	state := InputState{input, InputboxStyle.Copy()}
 
 	return state
 }
 
 func (s InputState) Update(msg tea.Msg) (InputState, tea.Cmd) {
-	cmd := s.updateInputs(msg)
-	return s, cmd
-}
-
-func (s *InputState) updateInputs(msg tea.Msg) tea.Cmd {
 	var cmd tea.Cmd
 	s.Input, cmd = s.Input.Update(msg)
-
-	return cmd
+	return s, cmd
 }
 
 func (s *InputState) SetSize(width int) {

ui/mainscreen/mainscreen.go

@@ -21,6 +21,7 @@ import (
 	"fmt"
 	"strings"
 
+	"github.com/charmbracelet/bubbles/textinput"
 	"github.com/charmbracelet/bubbles/viewport"
 	tea "github.com/charmbracelet/bubbletea"
 	"github.com/charmbracelet/lipgloss"
@@ -29,20 +30,29 @@ import (
 	"github.com/illusionman1212/gorc/ui"
 )
 
+type Window int
+
+const (
+	Viewport = iota
+	InputBox
+)
+
 type State struct {
 	Content    string
 	Reader     *bufio.Reader
 	Client     *client.Client
 	Viewport   viewport.Model
 	Style      lipgloss.Style
+	FocusIndex Window
 
 	InputBox InputState
 }
 
 func NewMainScreen() State {
-	newViewport := viewport.Model{}
-	newViewport.HighPerformanceRendering = false
-	newViewport.SetContent("")
+	newViewport := viewport.Model{
+		HighPerformanceRendering: false,
+		Wrap:                     true,
+	}
 
 	state := State{
 		Content:    "",
@@ -50,6 +60,7 @@ func NewMainScreen() State {
 		Client:     nil,
 		Viewport:   newViewport,
 		Style:      MessagesStyle.Copy(),
+		FocusIndex: InputBox,
 		InputBox:   NewInputBox(),
 	}
 	return state
@@ -77,13 +88,50 @@ func (s State) Update(msg tea.Msg) (State, tea.Cmd) {
 		}
 
 		return s, s.readFromServer
+	case tea.KeyMsg:
+		key := msg.String()
+		switch key {
+		case "tab", "shift+tab":
+			if key == "tab" {
+				s.FocusIndex++
+			} else {
+				s.FocusIndex--
 			}
 
-	s.Viewport, cmd = s.Viewport.Update(msg)
-	cmds = append(cmds, cmd)
+			if s.FocusIndex > 1 {
+				s.FocusIndex = 0
+			} else if s.FocusIndex < 0 {
+				s.FocusIndex = 1
+			}
+
+			switch s.FocusIndex {
+			case Viewport:
+				s.Style = s.Style.Copy().BorderForeground(lipgloss.Color("105"))
+				s.InputBox.Style = s.InputBox.Style.Copy().BorderForeground(lipgloss.Color("#EEE"))
+
+				s.InputBox.Input.Blur()
+			case InputBox:
+				s.Style = s.Style.Copy().BorderForeground(lipgloss.Color("#EEE"))
+				s.InputBox.Style = s.InputBox.Style.Copy().BorderForeground(lipgloss.Color("105"))
 
 				s.InputBox, cmd = s.InputBox.Update(msg)
 				cmds = append(cmds, cmd)
+				cmds = append(cmds, textinput.Blink)
+				s.InputBox.Input.Focus()
+			}
+
+			return s, tea.Batch(cmds...)
+		}
+	}
+
+	switch s.FocusIndex {
+	case Viewport:
+		s.Viewport, cmd = s.Viewport.Update(msg)
+		cmds = append(cmds, cmd)
+	case InputBox:
+		s.InputBox, cmd = s.InputBox.Update(msg)
+		cmds = append(cmds, cmd)
+	}
 
 	return s, tea.Batch(cmds...)
 }

ui/mainscreen/styles.go

@@ -30,7 +30,7 @@ var (
 	MessagesStyle = lipgloss.NewStyle().
 			Border(lipgloss.NormalBorder(), true).
 			Width(ui.MainStyle.GetWidth()).
-			BorderForeground(lipgloss.Color("105"))
+			BorderForeground(lipgloss.Color("#EEE"))
 
 	InputBoxHeight = 1
 )