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

Jump to bottom

feat: Filter SDKs with / #306

Merged
merged 2 commits into from
May 29, 2024
Merged

feat: Filter SDKs with / #306

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
dac2726
Filter SDKs with /
dbolson May 28, 2024
78ea7d0
Add filter to help when choosing an SDK
dbolson May 29, 2024
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
132 changes: 110 additions & 22 deletions internal/quickstart/choose_sdk.go
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ import (
var (
sdkStyle = lipgloss.NewStyle().PaddingLeft(4)
selectedSdkItemStyle = lipgloss.NewStyle().PaddingLeft(2).Foreground(lipgloss.Color("170"))
titleBarStyle = lipgloss.NewStyle().MarginBottom(1)
)

const (
Expand All @@ -32,20 +33,23 @@ type chooseSDKModel struct {
}

func NewChooseSDKModel(selectedIndex int) tea.Model {
initSDKs()
l := list.New(sdksToItems(), sdkDelegate{}, 30, 9)
l.Title = "Select your SDK:\n"
l.FilterInput.PromptStyle = lipgloss.NewStyle()

l.Title = "Select your SDK:"
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Removed the newline and added a margin bottom to work with the title text and the filter title text.

// reset title styles
l.Styles.Title = lipgloss.NewStyle()
l.Styles.TitleBar = lipgloss.NewStyle()
l.Styles.TitleBar = titleBarStyle
l.SetShowHelp(false)
l.SetShowPagination(true)
l.SetShowStatusBar(false)
l.SetFilteringEnabled(false) // TODO: try to get filtering working

return chooseSDKModel{
help: help.New(),
helpKeys: keyMap{
Back: BindingBack,
Filter: BindingFilter,
CursorUp: BindingCursorUp,
CursorDown: BindingCursorDown,
PrevPage: BindingPrevPage,
Expand All @@ -61,6 +65,13 @@ func NewChooseSDKModel(selectedIndex int) tea.Model {
}
}

// initSDKs sets the index of each SDK based on place in list.
func initSDKs() {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do this programmatically instead of explicitly setting an index on each SDK. We use the index to keep track of which SDK was selected so it is highlighted when the user goes back to the list.

for i := range SDKs {
SDKs[i].index = i
}
}

// Init sends commands when the model is created that will:
// * select an SDK if it's already been selected
func (m chooseSDKModel) Init() tea.Cmd {
Expand All @@ -72,11 +83,17 @@ func (m chooseSDKModel) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
switch msg := msg.(type) {
case tea.KeyMsg:
switch {
case msg.String() == "/":
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

we should also add this to the help keys so it's more discoverable

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done. I added a screenshot to see it show up only on the choose SDK page.

if m.list.FilterState() == list.Filtering {
m.list.SetFilteringEnabled(false)
} else {
m.list.SetFilteringEnabled(true)
}
m.list, cmd = m.list.Update(msg)
case key.Matches(msg, pressableKeys.Enter):
i, ok := m.list.SelectedItem().(sdkDetail)
if ok {
m.selectedSDK = i
m.selectedSDK.index = m.list.Index()
cmd = chooseSDK(m.selectedSDK)
}
case key.Matches(msg, m.helpKeys.CloseFullHelp):
Expand All @@ -86,6 +103,9 @@ func (m chooseSDKModel) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
}
case selectedSDKMsg:
m.list.Select(msg.index)
default:
// update list from list.FilterMatchesMsg
m.list, cmd = m.list.Update(msg)
}

return m, cmd
Expand All @@ -103,7 +123,7 @@ type sdkDetail struct {
url string // custom URL if it differs from the other SDKs
}

func (s sdkDetail) FilterValue() string { return "" }
func (s sdkDetail) FilterValue() string { return s.displayName }

var SDKs = []sdkDetail{
{
Expand All @@ -112,39 +132,99 @@ var SDKs = []sdkDetail{
kind: clientSideSDK,
url: "https://github.com/launchdarkly/react-client-sdk/tree/main/examples/typescript",
},
{canonicalName: "node-server", displayName: "Node.js (server-side)", kind: serverSideSDK},
{canonicalName: "python", displayName: "Python", kind: serverSideSDK},
{canonicalName: "java", displayName: "Java", kind: serverSideSDK},
{canonicalName: "dotnet-server", displayName: ".NET (server-side)", kind: serverSideSDK},
{canonicalName: "js", displayName: "JavaScript", kind: clientSideSDK},
{
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Split these out for consistency.

canonicalName: "node-server",
displayName: "Node.js (server-side)",
kind: serverSideSDK,
},
{
canonicalName: "python",
displayName: "Python",
kind: serverSideSDK,
},
{
canonicalName: "java",
displayName: "Java",
kind: serverSideSDK,
},
{
canonicalName: "dotnet-server",
displayName: ".NET (server-side)",
kind: serverSideSDK,
},
{
canonicalName: "js",
displayName: "JavaScript",
kind: clientSideSDK,
},
{
canonicalName: "vue",
displayName: "Vue",
kind: clientSideSDK,
url: "https://github.com/launchdarkly/vue-client-sdk/tree/main/example",
},
{canonicalName: "ios-swift", displayName: "iOS", kind: mobileSDK},
{canonicalName: "go", displayName: "Go", kind: serverSideSDK},
{canonicalName: "android", displayName: "Android", kind: mobileSDK},
{
canonicalName: "ios-swift",
displayName: "iOS",
kind: mobileSDK,
},
{
canonicalName: "go",
displayName: "Go",
kind: serverSideSDK,
},
{
canonicalName: "android",
displayName: "Android",
kind: mobileSDK,
},
{
canonicalName: "react-native",
displayName: "React Native",
kind: mobileSDK,
url: "https://github.com/launchdarkly/js-core/tree/main/packages/sdk/react-native/example",
},
{canonicalName: "ruby", displayName: "Ruby", kind: serverSideSDK},
{canonicalName: "flutter", displayName: "Flutter", kind: mobileSDK},
{canonicalName: "dotnet-client", displayName: ".NET (client-side)", kind: clientSideSDK},
{canonicalName: "erlang", displayName: "Erlang", kind: serverSideSDK},
{canonicalName: "rust", displayName: "Rust", kind: serverSideSDK},
{
canonicalName: "ruby",
displayName: "Ruby",
kind: serverSideSDK,
},
{
canonicalName: "flutter",
displayName: "Flutter",
kind: mobileSDK,
},
{
canonicalName: "dotnet-client",
displayName: ".NET (client-side)",
kind: clientSideSDK,
},
{
canonicalName: "erlang",
displayName: "Erlang",
kind: serverSideSDK,
},
{
canonicalName: "rust",
displayName: "Rust",
kind: serverSideSDK,
},
{
canonicalName: "c-client",
displayName: "C/C++ (client-side)",
kind: clientSideSDK,
url: "https://github.com/launchdarkly/cpp-sdks/tree/main/examples/hello-cpp-client",
},
{canonicalName: "roku", displayName: "Roku", kind: clientSideSDK},
{canonicalName: "node-client", displayName: "Node.js (client-side)", kind: clientSideSDK},
{
canonicalName: "roku",
displayName: "Roku",
kind: clientSideSDK,
},
{
canonicalName: "node-client",
displayName: "Node.js (client-side)",
kind: clientSideSDK,
},
{
canonicalName: "c-server",
displayName: "C/C++ (server-side)",
Expand All @@ -157,8 +237,16 @@ var SDKs = []sdkDetail{
kind: serverSideSDK,
url: "https://github.com/launchdarkly/lua-server-sdk/tree/main/examples/hello-lua-server",
},
{canonicalName: "haskell-server", displayName: "Haskell", kind: serverSideSDK},
{canonicalName: "php", displayName: "PHP", kind: serverSideSDK},
{
canonicalName: "haskell-server",
displayName: "Haskell",
kind: serverSideSDK,
},
{
canonicalName: "php",
displayName: "PHP",
kind: serverSideSDK,
},
}

func sdksToItems() []list.Item {
Expand Down
4 changes: 3 additions & 1 deletion internal/quickstart/container.go
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -202,7 +202,9 @@ func (m ContainerModel) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
m.currentStep += 1
shouldSendTrackingEvent = true
default:
// ignore other messages
// delegate other messages
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We need to pass the list messages from the container down into the show SDK model.

m.currentModel, cmd = m.currentModel.Update(msg)
m.err = nil
}

if shouldSendTrackingEvent {
Expand Down
7 changes: 6 additions & 1 deletion internal/quickstart/help.go
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,6 +45,10 @@ var (
key.WithKeys("ctrl+c"),
key.WithHelp("ctrl+c", "quit"),
)
BindingFilter = key.NewBinding(
key.WithKeys("/"),
key.WithHelp("/", "filter"),
)
)

// keyMap defines all the possible key presses we would respond to
Expand All @@ -54,6 +58,7 @@ type keyMap struct {
CursorDown key.Binding
CursorUp key.Binding
Enter key.Binding
Filter key.Binding
GoToEnd key.Binding
GoToStart key.Binding
NextPage key.Binding
Expand All @@ -71,7 +76,7 @@ func (k keyMap) FullHelp() [][]key.Binding {
}

func (k keyMap) ShortHelp() []key.Binding {
return []key.Binding{k.Back, k.Quit, k.ShowFullHelp}
return []key.Binding{k.Back, k.Filter, k.Quit, k.ShowFullHelp}
}

// pressableKeys are the possible key presses we support for all steps.
Expand Down
Loading