ByoungSooPark/modeling-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Show descriptions for generated commands, make them look better and sort better (#3023)

Browse Source
This commit is contained in:
Frank Noirot
2024-07-12 17:48:38 -04:00
committed by GitHub
parent e81b614523
commit 29bf77bb82
5 changed files with 16 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
e2e/playwright/snapshot-tests.spec.ts-snapshots/Zoom-to-fit-on-load---solid-2d-1-Google-Chrome-linux.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 44 KiB

After

Width:  |  Height:  |  Size: 44 KiB

10
src/components/CommandComboBox.tsx
View File

@ -72,17 +72,21 @@ function CommandComboBox({
<Combobox.Option
key={option.groupId + option.name + (option.displayName || '')}
value={option}
className="flex items-center gap-2 px-4 py-1 first:mt-2 last:mb-2 ui-active:bg-primary/10 dark:ui-active:bg-chalkboard-90"
className="flex items-center gap-4 px-4 py-1.5 first:mt-2 last:mb-2 ui-active:bg-primary/10 dark:ui-active:bg-chalkboard-90"
>
{'icon' in option && option.icon && (
<CustomIcon name={option.icon} className="w-5 h-5" />
)}
<p className="flex-grow">{option.displayName || option.name} </p>
<div className="flex-grow flex flex-col">
<p className="my-0 leading-tight">
{option.displayName || option.name}{' '}
</p>
{option.description && (
<p className="text-xs text-chalkboard-60 dark:text-chalkboard-40">
<p className="my-0 text-xs text-chalkboard-60 dark:text-chalkboard-50">
{option.description}
</p>
)}
</div>
</Combobox.Option>
))}
</Combobox.Options>

1
src/lib/commandBarConfigs/settingsCommandConfig.ts
View File

@ -124,6 +124,7 @@ export function createSettingsCommand({
displayName: `Settings · ${decamelize(type.replaceAll('.', ' · '), {
separator: ' ',
})}`,
description: settingConfig.description,
groupId: 'settings',
icon: 'settings',
needsReview: false,

1
src/lib/createMachineCommand.ts
View File

@ -81,6 +81,7 @@ export function createMachineCommand<
name: type,
groupId,
icon,
description: commandConfig.description,
needsReview: commandConfig.needsReview || false,
onSubmit: (data?: S[typeof type]) => {
if (data !== undefined && data !== null) {

6
src/machines/commandBarMachine.ts
View File

@ -514,7 +514,9 @@ export const commandBarMachine = createMachine(
)
function sortCommands(a: Command, b: Command) {
if (b.groupId === 'auth') return -1
if (a.groupId === 'auth') return 1
if (b.groupId === 'auth' && !(a.groupId === 'auth')) return -2
if (a.groupId === 'auth' && !(b.groupId === 'auth')) return 2
if (b.groupId === 'settings' && !(a.groupId === 'settings')) return -1
if (a.groupId === 'settings' && !(b.groupId === 'settings')) return 1
return a.name.localeCompare(b.name)
}