feat: disable connect button when host, port and nickname are empty

ui/login/login.go

@@ -28,27 +28,32 @@ import (
 )
 
 type State struct {
-	FocusIndex      int
+	FocusIndex                int
-	Inputs          []textinput.Model
+	Inputs                    []textinput.Model
-	TLS             bool
+	TLS                       bool
-	DialogStyle     lipgloss.Style
+	CanConnect                bool
-	WelcomeMsgStyle lipgloss.Style
+	ConnectButtonBlurredStyle string
-	Style           lipgloss.Style
+	ConnectButtonFocusedStyle string
+	DialogStyle               lipgloss.Style
+	WelcomeMsgStyle           lipgloss.Style
+	Style                     lipgloss.Style
 }
 
 func NewLogin() State {
 	state := State{
-		Inputs:          make([]textinput.Model, 5),
+		Inputs:                    make([]textinput.Model, 5),
-		DialogStyle:     DialogStyle.Copy(),
+		ConnectButtonBlurredStyle: BlurredDisabledButton,
-		WelcomeMsgStyle: WelcomeMsgStyle.Copy(),
+		ConnectButtonFocusedStyle: FocusedDisabledButton,
-		Style:           ui.MainStyle.Copy(),
+		DialogStyle:               DialogStyle.Copy(),
+		WelcomeMsgStyle:           WelcomeMsgStyle.Copy(),
+		Style:                     ui.MainStyle.Copy(),
 	}
 
 	var t textinput.Model
 	for i := range state.Inputs {
 		t = textinput.New()
 		t.CursorStyle = CursorStyle
-		t.Prompt = "| "
+		t.Prompt = ""
 
 		switch i {
 		case 0:
@@ -85,7 +90,8 @@ func (s State) Update(msg tea.Msg) (State, tea.Cmd) {
 		switch key {
 		case " ", "enter":
 			// run the Connect cmd when pressing "enter" while focused on the connect button
-			if key == "enter" && s.FocusIndex == len(s.Inputs)+1 {
+			// if the CanConnect flag is set
+			if key == "enter" && s.FocusIndex == len(s.Inputs)+1 && s.CanConnect {
 				return s, cmds.Connect
 			}
 
@@ -137,6 +143,16 @@ func (s *State) updateInputs(msg tea.Msg) tea.Cmd {
 		s.Inputs[i], cmds[i] = s.Inputs[i].Update(msg)
 	}
 
+	if s.Inputs[0].Value() != "" && s.Inputs[1].Value() != "" && s.Inputs[3].Value() != "" {
+		s.ConnectButtonBlurredStyle = BlurredButton
+		s.ConnectButtonFocusedStyle = FocusedButton
+		s.CanConnect = true
+	} else {
+		s.ConnectButtonBlurredStyle = BlurredDisabledButton
+		s.ConnectButtonFocusedStyle = FocusedDisabledButton
+		s.CanConnect = false
+	}
+
 	return tea.Batch(cmds...)
 }
 
@@ -175,9 +191,9 @@ func (s State) View() string {
 
 	fmt.Fprintf(&sb, "\n%s\n", *checkbox)
 
-	button := &BlurredButton
+	button := &s.ConnectButtonBlurredStyle
 	if s.FocusIndex == len(s.Inputs)+1 {
-		button = &FocusedButton
+		button = &s.ConnectButtonFocusedStyle
 	}
 	fmt.Fprintf(&sb, "\n%s\n", *button)
 

ui/login/styles.go

@@ -36,6 +36,22 @@ const WelcomeMsg = `
 `
 
 var (
+	BlurredDisabledButton = lipgloss.NewStyle().
+				Border(lipgloss.NormalBorder()).
+				BorderForeground(ui.DisabledColor).
+				Foreground(ui.DisabledColor).
+				MarginTop(1).
+				Padding(0, 2).
+				Align(lipgloss.Center).
+				Render("Connect")
+	FocusedDisabledButton = lipgloss.NewStyle().
+				Border(lipgloss.NormalBorder()).
+				BorderForeground(ui.DisabledColorFocus).
+				Foreground(ui.DisabledColorFocus).
+				MarginTop(1).
+				Padding(0, 2).
+				Align(lipgloss.Center).
+				Render("Connect")
 	FocusedButton = lipgloss.NewStyle().
 			Border(lipgloss.NormalBorder()).
 			BorderForeground(ui.AccentColor).
@@ -57,22 +73,22 @@ var (
 	FocusedCheckbox = lipgloss.NewStyle().
 			Foreground(ui.AccentColor).
 			MarginTop(1).
-			Render("✕ Enable TLS")
+			Render("TLS Enabled [✕]")
 
 	BlurredCheckbox = lipgloss.NewStyle().
 			Foreground(ui.PrimaryColor).
 			MarginTop(1).
-			Render("✕ Enable TLS")
+			Render("TLS Enabled [✕]")
 
 	FocusedCheckboxChecked = lipgloss.NewStyle().
 				Foreground(ui.AccentColor).
 				MarginTop(1).
-				Render("🗸 Enable TLS")
+				Render("TLS Enabled [🗸]")
 
 	BlurredCheckboxChecked = lipgloss.NewStyle().
 				Foreground(ui.PrimaryColor).
 				MarginTop(1).
-				Render("🗸 Enable TLS")
+				Render("TLS Enabled [🗸]")
 
 	DialogStyle = lipgloss.NewStyle().
 			Align(lipgloss.Center)

ui/mainscreen/mainscreen.go

@@ -225,10 +225,10 @@ func (s *State) SetSize(width, height int) {
 	s.InputBox.SetSize(width)
 	s.SidePanel.SetSize(width, height, s.InputBox.Style.GetVerticalFrameSize())
 
-	// We floor here because width is an int and some fractions are lost
+	// We floor because width is an int and some fractions are lost when casting
 	// and also because we ceil the sidepanel's width
 	// -3 for the tab bar height
-	newWidth := int(math.Floor(float64(width)*8.0/10.0) - float64(s.Viewport.Style.GetHorizontalFrameSize()))
+	newWidth := int(math.Floor(float64(width)*8/10) - float64(s.Viewport.Style.GetHorizontalFrameSize()))
 	newHeight := height - s.InputBox.Style.GetVerticalFrameSize() - s.Viewport.Style.GetVerticalFrameSize() - 3
 
 	s.Viewport.Width = newWidth

ui/mainscreen/sidepanel.go

@@ -119,7 +119,7 @@ func (s *SidePanelState) UpdateNicks() {
 func (s *SidePanelState) SetSize(width, height, inputboxHeight int) {
 	// We ceil here because width is an int and some fractions are lost
 	// -1 is for some extra invisible margin or padding between the sidepanel and the inputbox
-	newWidth := int(math.Ceil(math.Ceil((float64(width) * 2.0 / 10.0)) - float64(s.Viewport.Style.GetHorizontalFrameSize())))
+	newWidth := int(math.Ceil(math.Ceil((float64(width) * 2 / 10)) - float64(s.Viewport.Style.GetHorizontalFrameSize())))
 	newHeight := height - inputboxHeight - s.Viewport.Style.GetVerticalFrameSize() - 1
 
 	s.Viewport.Style = s.Viewport.Style.Width(newWidth)

ui/mainscreen/styles.go

@@ -95,11 +95,11 @@ var (
 	leftArrowDim = tab.Copy().
 			Border(leftArrowBorder, true).
 			BorderForeground(ui.PrimaryColor).
-			Foreground(ui.ArrowsDimColor)
+			Foreground(ui.DisabledColor)
 	rightArrowDim = tab.Copy().
 			Border(rightArrowBorder, true).
 			BorderForeground(ui.PrimaryColor).
-			Foreground(ui.ArrowsDimColor)
+			Foreground(ui.DisabledColor)
 
 	leftArrowLit = tab.Copy().
 			Border(leftArrowBorder, true).

ui/styles.go

@@ -33,8 +33,13 @@ var (
 		Light: "#151515",
 	}
 
-	ArrowsDimColor = lipgloss.AdaptiveColor{
+	DisabledColor = lipgloss.AdaptiveColor{
 		Dark:  "#444",
 		Light: "#AAA",
 	}
+
+	DisabledColorFocus = lipgloss.AdaptiveColor{
+		Dark:  "#666",
+		Light: "#CCC",
+	}
 )