Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

cli: improve app create form responsiveness #1525

Merged
merged 1 commit into from
Oct 25, 2024
Merged

cli: improve app create form responsiveness #1525

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
70 changes: 46 additions & 24 deletions cli/cmd/encore/app/create_form.go
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ const (
var (
inputStyle = lipgloss.NewStyle().Foreground(lipgloss.AdaptiveColor{Dark: codeBlue, Light: codeBlue})
descStyle = lipgloss.NewStyle().Foreground(lipgloss.AdaptiveColor{Dark: codeGreen, Light: codePurple})
docStyle = lipgloss.NewStyle().Margin(1, 2, 0, 2)
docStyle = lipgloss.NewStyle().Padding(0, 2, 0, 2)
errorStyle = lipgloss.NewStyle().Foreground(lipgloss.Color(validationFail))
successStyle = lipgloss.NewStyle().Foreground(lipgloss.Color("#00C200"))
)
Expand Down Expand Up @@ -98,18 +98,15 @@ func (m languageSelectModel) Update(msg tea.Msg) (languageSelectModel, tea.Cmd)
}
}
}
case tea.WindowSizeMsg:
m.list.SetWidth(msg.Width)
m.RecalculateHeight()
return m, nil
}

m.list, c = m.list.Update(msg)
return m, c
}

func (m *languageSelectModel) RecalculateHeight() {
m.list.SetHeight(len(m.list.Items()) * 4)
func (m *languageSelectModel) SetSize(width, height int) {
m.list.SetWidth(width)
m.list.SetHeight(max(height-1, 0))
}

const checkmark = "✔"
Expand All @@ -118,7 +115,7 @@ func (m languageSelectModel) View() string {
var b strings.Builder
b.WriteString(inputStyle.Render("Select language for your application"))
b.WriteString(descStyle.Render(" [Use arrows to move]"))
b.WriteString("\n\n")
b.WriteString("\n")
b.WriteString(m.list.View())

return b.String()
Expand Down Expand Up @@ -204,6 +201,11 @@ func (m templateListModel) Init() tea.Cmd {
)
}

func (m *templateListModel) SetSize(width, height int) {
m.list.SetWidth(width)
m.list.SetHeight(max(height-1, 0))
}

type templateSelectDone struct{}

func (m templateListModel) Update(msg tea.Msg) (templateListModel, tea.Cmd) {
Expand All @@ -218,11 +220,6 @@ func (m templateListModel) Update(msg tea.Msg) (templateListModel, tea.Cmd) {
}
}

case tea.WindowSizeMsg:
m.list.SetWidth(msg.Width)
m.list.SetHeight(min(msg.Height, 20))
return m, nil

case spinner.TickMsg:
m.loading, _ = m.loading.Update(msg)

Expand Down Expand Up @@ -323,6 +320,10 @@ func (m createFormModel) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
case appNameDone:
cmds = append(cmds, tea.Quit)
m.step = 3

case tea.WindowSizeMsg:
m.SetSize(msg.Width, msg.Height)
return m, nil
}

// Update all submodels for other messages.
Expand All @@ -336,12 +337,25 @@ func (m createFormModel) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
return m, tea.Batch(cmds...)
}

func (m createFormModel) View() string {
func (m *createFormModel) SetSize(width, height int) {
// Step 1
doneHeight := lipgloss.Height(m.doneView())
{
availHeight := height - doneHeight
m.lang.SetSize(width, availHeight)
}

// Step 2
{
availHeight := height - doneHeight
m.templates.SetSize(width, availHeight)
}
}

func (m createFormModel) doneView() string {
var b strings.Builder

var didRenderDone bool
renderDone := func(title, value string) {
didRenderDone = true
b.WriteString(successStyle.Render(fmt.Sprintf("%s %s: ", checkmark, title)))
b.WriteString(value)
b.WriteByte('\n')
Expand Down Expand Up @@ -373,24 +387,30 @@ func (m createFormModel) View() string {
if m.appName.predefined == "" && m.step > 2 {
renderNameDone()
}
if didRenderDone {
// Add a newline after we've rendered any 'done' steps

return b.String()
}

func (m createFormModel) View() string {
var b strings.Builder

doneView := m.doneView()

b.WriteString(doneView)
if doneView != "" {
b.WriteByte('\n')
}

if m.step == 0 {
b.WriteString(m.lang.View())
b.WriteByte('\n')
}

if m.step == 1 {
b.WriteString(m.templates.View())
b.WriteByte('\n')
}

if m.step == 2 {
b.WriteString(m.appName.View())
b.WriteByte('\n')
}

return docStyle.Render(b.String())
Expand Down Expand Up @@ -425,6 +445,8 @@ func selectTemplate(inputName, inputTemplate string, skipShowingTemplate bool) (
ls.SelectedDesc = ls.SelectedDesc.Foreground(lipgloss.Color(codeBlue)).BorderForeground(lipgloss.Color(codeBlue))
del := list.NewDefaultDelegate()
del.Styles = ls
del.ShowDescription = false
del.SetSpacing(0)

items := []list.Item{
langItem{
Expand All @@ -433,7 +455,7 @@ func selectTemplate(inputName, inputTemplate string, skipShowingTemplate bool) (
},
langItem{
lang: languageTS,
desc: "Build backend and full-stack applications with TypeScript and Node.JS",
desc: "Build backend and full-stack applications with TypeScript",
},
}

Expand All @@ -447,7 +469,7 @@ func selectTemplate(inputName, inputTemplate string, skipShowingTemplate bool) (
lang = languageSelectModel{
list: ll,
}
lang.RecalculateHeight()
lang.SetSize(0, 20)
}

var templates templateListModel
Expand Down Expand Up @@ -544,7 +566,7 @@ func (i langItem) FilterValue() string {
func (i langItem) Title() string {
return i.FilterValue()
}
func (i langItem) Description() string { return i.desc }
func (i langItem) Description() string { return "" }

type language string

Expand Down
Loading