Skip to content

Commit

Permalink
feat: improve modals UI
Browse files Browse the repository at this point in the history
  • Loading branch information
@jackMort
jackMort committed Nov 29, 2024
1 parent 7e06d30 commit c401800
Show file tree
Hide file tree
Showing 8 changed files with 93 additions and 79 deletions.
15 changes: 9 additions & 6 deletions app/app.go
View file
Original file line number Diff line number Diff line change
Expand Up @@ -95,6 +95,7 @@ func (i *Collection) ValidatePartial(fields ...string) []string {

type Call struct {
ID string `json:"id"`
Name string `json:"name"`
Url string `json:"url"`
Method string `json:"method"`
Headers []string `json:"headers"`
Expand All @@ -112,10 +113,12 @@ func NewCall() *Call {
}

func (i Call) Title() string {
switch i.Url {
case "h", "ht", "htt", "http", "https", "https:", "http:", "http:/", "https:/", "http://", "https://":
return i.Url
case "{",
url := i.Url
if i.Name != "" {
url = i.Name
}
switch url {
case "h", "ht", "htt", "http", "https", "https:", "http:", "http:/", "https:/", "http://", "https://", "{",
"{{",
"{{B",
"{{BA",
Expand All @@ -127,9 +130,9 @@ func (i Call) Title() string {
"{{BASE_URL",
"{{BASE_URL}",
"{{BASE_URL}}":
return i.Url
return url
default:
url_processed := strings.Replace(i.Url, "{{BASE_URL}}", "", 1)
url_processed := strings.Replace(url, "{{BASE_URL}}", "", 1)
url := strings.Split(url_processed, "://")
if len(url) > 1 && url[1] != "" {
return url[1]
Expand Down
16 changes: 5 additions & 11 deletions components/auth/auth.go
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,12 +27,6 @@ const (
)

var (
inputStyle = lipgloss.NewStyle().
Foreground(config.COLOR_FOREGROUND).
BorderStyle(lipgloss.NormalBorder()).
BorderBottom(true).
BorderForeground(config.COLOR_SUBTLE)

general = lipgloss.NewStyle().
UnsetAlign().
Padding(1, 2).
Expand Down Expand Up @@ -271,9 +265,9 @@ func (c Model) View() string {
inputs = lipgloss.JoinVertical(
lipgloss.Left,
" ",
inputStyle.Render(c.inputs[USERNAME_IDX].View()),
config.InputStyle.Render(c.inputs[USERNAME_IDX].View()),
" ",
inputStyle.Render(c.inputs[PASSWORD_IDX].View()),
config.InputStyle.Render(c.inputs[PASSWORD_IDX].View()),
" ",
)
case NONE:
Expand All @@ -282,16 +276,16 @@ func (c Model) View() string {
inputs = lipgloss.JoinVertical(
lipgloss.Left,
" ",
inputStyle.Render(c.inputs[TOKEN_IDX].View()),
config.InputStyle.Render(c.inputs[TOKEN_IDX].View()),
" ",
)
case API_KEY:
inputs = lipgloss.JoinVertical(
lipgloss.Left,
" ",
inputStyle.Render(c.inputs[API_KEY_IDX].View()),
config.InputStyle.Render(c.inputs[API_KEY_IDX].View()),
" ",
inputStyle.Render(c.inputs[API_VALUE_IDX].View()),
config.InputStyle.Render(c.inputs[API_VALUE_IDX].View()),
" ",
)

Expand Down
91 changes: 56 additions & 35 deletions components/collections/add_to_collection.go
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,8 @@ package collections
import (
"restman/app"
"restman/components/config"
"restman/components/popup"
"restman/components/overlay"
"restman/utils"

"github.com/charmbracelet/bubbles/key"
"github.com/charmbracelet/bubbles/textinput"
Expand All @@ -13,8 +14,10 @@ import (
)

const (
COLLECTION_IDX = iota
URL_IDX
NAME_IDX = iota
COLLECTION_IDX
CLOSE_IDX
SAVE_IDX
)

// AddToCollectionResultMsg is the message sent when a choice is made.
Expand All @@ -24,35 +27,36 @@ type AddToCollectionResultMsg struct {

// AddToCollection is a popup that presents a yes/no choice to the user.
type AddToCollection struct {
overlay popup.Overlay
inputs []textinput.Model
focused int
save bool
err error
inputs []textinput.Model
focused int
save bool
errors []string
bgRaw string
width int
startRow int
startCol int
}

func NewAddToCollection(bgRaw string, width int, vWidth int) AddToCollection {
var inputs []textinput.Model = make([]textinput.Model, 2)

inputs[COLLECTION_IDX] = textinput.New()
inputs[COLLECTION_IDX].Placeholder = "Collection"
inputs[COLLECTION_IDX].Prompt = ""
inputs[COLLECTION_IDX].Prompt = "󱞩 "
inputs[COLLECTION_IDX].ShowSuggestions = true
inputs[COLLECTION_IDX].KeyMap.AcceptSuggestion = key.NewBinding(
key.WithKeys("enter"),
)

inputs[URL_IDX] = textinput.New()
inputs[URL_IDX].Placeholder = "https://sampleapi.com/api/v1"
inputs[URL_IDX].Prompt = ""
inputs[URL_IDX].Width = 35
inputs[NAME_IDX] = textinput.New()
inputs[NAME_IDX].Placeholder = "/hello"
inputs[NAME_IDX].Prompt = "󱞩 "
inputs[NAME_IDX].Width = 35

if app.GetInstance().SelectedCollection != nil {
inputs[COLLECTION_IDX].SetValue(app.GetInstance().SelectedCollection.Name)
inputs[URL_IDX].Focus()
} else {
inputs[COLLECTION_IDX].Focus()
}

collections := app.GetInstance().Collections
suggestions := make([]string, len(collections))
for i, c := range collections {
Expand All @@ -61,18 +65,24 @@ func NewAddToCollection(bgRaw string, width int, vWidth int) AddToCollection {
inputs[COLLECTION_IDX].SetSuggestions(suggestions)

return AddToCollection{
overlay: popup.NewOverlayOnPosition(bgRaw, width, 13, 3, vWidth-width-4),
inputs: inputs,
focused: 0,
bgRaw: bgRaw,
startRow: 3,
width: width,
startCol: vWidth - width - 4,
inputs: inputs,
focused: NAME_IDX,
}
}
func (c AddToCollection) Name() string {
return c.inputs[NAME_IDX].Value()
}

func (c AddToCollection) CollectionName() string {
return c.inputs[COLLECTION_IDX].Value()
}

func (c AddToCollection) SetUrl(url string) {
c.inputs[URL_IDX].SetValue(url)
c.inputs[NAME_IDX].SetValue(url)
}

// Init initializes the popup.
Expand Down Expand Up @@ -102,9 +112,9 @@ func (c AddToCollection) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
case tea.KeyMsg:
switch msg.Type {
case tea.KeyEnter:
if c.focused == 3 {
if c.focused == CLOSE_IDX {
return c, c.makeChoice()
} else if c.focused == 2 {
} else if c.focused == SAVE_IDX {
c.save = true
return c, c.makeChoice()
}
Expand All @@ -127,47 +137,58 @@ func (c AddToCollection) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
c.inputs[i], cmds[i] = c.inputs[i].Update(msg)
}

c.Validate()

return c, tea.Batch(cmds...)
}

func (c *AddToCollection) Validate() {
c.errors = make([]string, 0)
if c.inputs[COLLECTION_IDX].Value() == "" {
c.errors = append(c.errors, "Collection is required")
}
if c.inputs[NAME_IDX].Value() == "" {
c.errors = append(c.errors, "Request name is required")
}
}

// View renders the popup.
func (c AddToCollection) View() string {
okButtonStyle := config.ButtonStyle
cancelButtonStyle := config.ButtonStyle
if c.focused == 2 {
if c.focused == SAVE_IDX {
okButtonStyle = config.ActiveButtonStyle
} else if c.focused == 3 {
} else if c.focused == CLOSE_IDX {
cancelButtonStyle = config.ActiveButtonStyle
}

okButton := zone.Mark("add_to_collection_save", okButtonStyle.Render("Save"))
cancelButton := zone.Mark("add_to_collection_cancel", cancelButtonStyle.Render("Cancel"))

buttons := lipgloss.PlaceHorizontal(
c.overlay.Width(),
lipgloss.Left,
lipgloss.JoinHorizontal(lipgloss.Right, okButton, " ", cancelButton),
c.width,
lipgloss.Right,
lipgloss.JoinHorizontal(lipgloss.Right, cancelButton, " ", okButton),
)

header := config.BoxHeader.Render("Add to collection")

inputs := lipgloss.JoinVertical(
lipgloss.Left,
inputStyle.Width(30).Render("Collection:"),
c.inputs[COLLECTION_IDX].View(),
" ",

inputStyle.Width(30).Render("URL:"),
c.inputs[URL_IDX].View(),
config.LabelStyle.Width(30).Render("Request Name:"),
config.InputStyle.Render(c.inputs[NAME_IDX].View()),
" ",
config.LabelStyle.Width(30).Render("Collection:"),
config.InputStyle.Render(c.inputs[COLLECTION_IDX].View()),
" ",
utils.RenderErrors(c.errors),
buttons,
)

ui := lipgloss.JoinVertical(lipgloss.Left, header, " ", inputs)
dialog := lipgloss.Place(c.overlay.Width()-2, c.overlay.Height()-2, lipgloss.Left, lipgloss.Top, ui)

return c.overlay.WrapView(general.Render(dialog))
content := general.Render(ui)
return overlay.PlaceOverlay(c.startCol, c.startRow, content, c.bgRaw)
}

func (c AddToCollection) makeChoice() tea.Cmd {
Expand Down
11 changes: 6 additions & 5 deletions components/collections/authentication.go
View file
Original file line number Diff line number Diff line change
Expand Up @@ -86,6 +86,7 @@ func (c *Authentication) setBasedOnMethod() {
c.inputs[0].Placeholder = "username"
c.inputs[0].Prompt = " "
c.inputs[0].SetValue(username)
c.inputs[0].PromptStyle = config.InputStyle

c.inputs[1] = textinput.New()
c.inputs[1].Placeholder = "password"
Expand Down Expand Up @@ -239,9 +240,9 @@ func (c Authentication) View() string {
inputs = lipgloss.JoinVertical(
lipgloss.Left,
" ",
inputStyle.Render(c.inputs[0].View()),
config.InputStyle.Render(c.inputs[0].View()),
" ",
inputStyle.Render(c.inputs[1].View()),
config.InputStyle.Render(c.inputs[1].View()),
" ",
)
case NONE:
Expand All @@ -250,7 +251,7 @@ func (c Authentication) View() string {
inputs = lipgloss.JoinVertical(
lipgloss.Left,
" ",
inputStyle.Render(c.inputs[0].View()),
config.InputStyle.Render(c.inputs[0].View()),
" ",
" ",
" ",
Expand All @@ -259,9 +260,9 @@ func (c Authentication) View() string {
inputs = lipgloss.JoinVertical(
lipgloss.Left,
" ",
inputStyle.Render(c.inputs[0].View()),
config.InputStyle.Render(c.inputs[0].View()),
" ",
inputStyle.Render(c.inputs[1].View()),
config.InputStyle.Render(c.inputs[1].View()),
" ",
)

Expand Down
17 changes: 7 additions & 10 deletions components/collections/basic_info.go
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,9 +18,6 @@ const (
)

var (
inputStyle = lipgloss.NewStyle().
Foreground(config.COLOR_FOREGROUND)

general = lipgloss.NewStyle().
UnsetAlign().
Padding(0, 1, 0, 1).
Expand All @@ -47,14 +44,14 @@ func NewBasicInfo(collection *app.Collection) BasicInfo {
var inputs []textinput.Model = make([]textinput.Model, 2)
inputs[TITLE_IDX] = textinput.New()
inputs[TITLE_IDX].Placeholder = "My Collection"
inputs[TITLE_IDX].Focus()
inputs[TITLE_IDX].Prompt = ""
inputs[TITLE_IDX].SetValue(collection.Name)
inputs[TITLE_IDX].Prompt = "󱞩 "
inputs[TITLE_IDX].Focus()

inputs[BASE_URL_IDX] = textinput.New()
inputs[BASE_URL_IDX].Placeholder = "https://sampleapi.com/api/v1"
inputs[BASE_URL_IDX].Prompt = ""
inputs[BASE_URL_IDX].SetValue(collection.BaseUrl)
inputs[BASE_URL_IDX].Prompt = "󱞩 "

mode := "Create"
if collection.ID != "" {
Expand Down Expand Up @@ -133,12 +130,12 @@ func (c BasicInfo) Update(msg tea.Msg) (BasicInfo, tea.Cmd) {
func (c BasicInfo) View() string {
inputs := lipgloss.JoinVertical(
lipgloss.Left,
inputStyle.Width(30).Render("Title:"),
c.inputs[TITLE_IDX].View(),
config.LabelStyle.Render("Title:"),
config.InputStyle.Render(c.inputs[TITLE_IDX].View()),
" ",

inputStyle.Width(30).Render("Base URL:"),
c.inputs[BASE_URL_IDX].View(),
config.LabelStyle.Render("Base URL:"),
config.InputStyle.Render(c.inputs[BASE_URL_IDX].View()),
" ",
)

Expand Down
6 changes: 1 addition & 5 deletions components/collections/header.go
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,13 +21,9 @@ func (h Header) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
}

func (h Header) View() string {
icon := ""
if h.mode == "Edit" {
icon = "󰷎"
}
return lipgloss.JoinVertical(
lipgloss.Left,
config.BoxHeader.Render(icon+" "+h.mode+" collection"),
config.BoxHeader.Render(h.mode+" collection"),
h.steps.View(),
)
}
Loading

0 comments on commit c401800

Please sign in to comment.