rmorawski/standardnotes-app-web
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

fix: Fixed workspace menu item rename issue

Browse Source
This commit is contained in:
Aman Harwara
2022-12-07 17:46:49 +05:30
parent 46245b5569
commit 45cdab6f6c
2 changed files with 48 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
packages/ui-services/src/Keyboard/KeyboardKey.ts
View File

@@ -9,4 +9,5 @@ export enum KeyboardKey {
Escape = 'Escape',
Home = 'Home',
End = 'End',
Space = ' ',
}

92
packages/web/src/javascripts/Components/AccountMenu/WorkspaceSwitcher/WorkspaceMenuItem.tsx
View File

@@ -51,54 +51,56 @@ const WorkspaceMenuItem: FunctionComponent<Props> = ({
const handleInputBlur: FocusEventHandler<HTMLInputElement> = useCallback(() => {
renameDescriptor(inputValue)
setIsRenaming(false)
setInputValue('')
}, [inputValue, renameDescriptor])
return (
<MenuRadioButtonItem
className="flex w-full cursor-pointer items-center border-0 bg-transparent px-3 py-2 text-left text-sm text-text hover:bg-contrast hover:text-foreground focus:bg-info-backdrop focus:shadow-none"
onClick={onClick}
checked={descriptor.primary}
>
<div className="ml-2 flex w-full items-center justify-between">
{isRenaming ? (
<input
ref={inputRef}
type="text"
value={inputValue}
onChange={handleChange}
onKeyDown={handleInputKeyDown}
onBlur={handleInputBlur}
/>
) : (
<div>{descriptor.label}</div>
)}
{descriptor.primary && !hideOptions && (
<div className="flex items-center">
<a
role="button"
className="mr-3 h-5 w-5 cursor-pointer border-0 bg-transparent p-0 hover:bg-contrast"
onClick={(e) => {
e.stopPropagation()
setIsRenaming((isRenaming) => !isRenaming)
}}
>
<Icon type="pencil" className="text-neutral" size="medium" />
</a>
<a
role="button"
className="h-5 w-5 cursor-pointer border-0 bg-transparent p-0 hover:bg-contrast"
onClick={(e) => {
e.stopPropagation()
onDelete()
}}
>
<Icon type="trash" className="text-danger" size="medium" />
</a>
</div>
)}
</div>
</MenuRadioButtonItem>
<div className="relative">
<MenuRadioButtonItem
className="flex w-full cursor-pointer items-center border-0 bg-transparent px-3 py-2 text-left text-sm text-text hover:bg-contrast hover:text-foreground focus:bg-info-backdrop focus:shadow-none"
onClick={onClick}
checked={descriptor.primary}
>
<div className="ml-2 flex w-full items-center justify-between">
{!isRenaming && <div>{descriptor.label}</div>}
{descriptor.primary && !hideOptions && (
<div className="flex items-center">
<a
role="button"
className="mr-3 flex h-5 w-5 cursor-pointer items-center justify-center border-0 bg-transparent p-0 hover:bg-contrast"
onClick={(e) => {
e.stopPropagation()
setIsRenaming((isRenaming) => !isRenaming)
}}
>
<Icon type="pencil" className="text-neutral" size="medium" />
</a>
<a
role="button"
className="flex h-5 w-5 cursor-pointer items-center justify-center border-0 bg-transparent p-0 hover:bg-contrast"
onClick={(e) => {
e.stopPropagation()
onDelete()
}}
>
<Icon type="trash" className="text-danger" size="medium" />
</a>
</div>
)}
</div>
</MenuRadioButtonItem>
{isRenaming && (
<input
ref={inputRef}
type="text"
value={inputValue}
onChange={handleChange}
onKeyDown={handleInputKeyDown}
onBlur={handleInputBlur}
onClick={(e) => e.stopPropagation()}
className="absolute top-1/2 left-11 -translate-y-1/2 bg-default"
/>
)}
</div>
)
}