Skip to content

Commit

Permalink
feat: wip
Browse files Browse the repository at this point in the history
  • Loading branch information
andresgutgon committed Jul 27, 2024
1 parent b616704 commit 23c33ec
Show file tree
Hide file tree
Showing 4 changed files with 25 additions and 8 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -36,10 +36,6 @@ export default function ClientFilesTree({
{ currentDocument },
{ fallbackData: serverDocuments },
)

console.log('DO_UUID', currentDocument?.documentUuid)
console.log('DO_PATH', currentDocument?.path)

return (
<FilesTree
documents={documents}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,8 @@ import {
KeyboardEventHandler,
ReactNode,
RefObject,
useCallback,

Check failure on line 6 in packages/web-ui/src/sections/Document/Sidebar/Files/NodeHeaderWrapper/index.tsx

View workflow job for this annotation

GitHub Actions / lint (20.x)

'useCallback' is defined but never used. Allowed unused vars must match /^_/u
useEffect,
useState,
type ChangeEventHandler,
} from 'react'
Expand Down Expand Up @@ -81,8 +83,23 @@ const NodeHeaderWrapper = forwardRef<HTMLDivElement, Props>(function Foo(
ref,
) {
const [actionsOpen, setActionsOpen] = useState(false)

// Litle trick to focus the input after the component is mounted
// We wait some time to focus the input to avoid the focus being stolen
// by the click event in the menu item that created this node.
useEffect(() => {
const timeout = setTimeout(() => {
inputRef.current?.focus(), 100
})

return () => {
clearTimeout(timeout)
}
}, [inputRef])

return (
<div
tabIndex={0}
ref={ref}
className={cn(
'max-w-full group/row flex flex-row my-0.5 cursor-pointer',
Expand All @@ -104,6 +121,7 @@ const NodeHeaderWrapper = forwardRef<HTMLDivElement, Props>(function Foo(
{isEditing ? (
<div className='pr-1 flex items-center'>
<Input
tabIndex={0}
ref={inputRef}
autoFocus
artificialFocused={keepFocused}
Expand Down Expand Up @@ -137,6 +155,7 @@ const NodeHeaderWrapper = forwardRef<HTMLDivElement, Props>(function Foo(
)}
>
<DropdownMenu
tabIndex={0}
controlledOpen={actionsOpen}
onOpenChange={setActionsOpen}
options={actions}
Expand Down
7 changes: 4 additions & 3 deletions packages/web-ui/src/sections/Document/Sidebar/Files/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,14 +7,15 @@ import { Icons } from '$ui/ds/atoms/Icons'
import { cn } from '$ui/lib/utils'

import { FileTreeProvider, useFileTreeContext } from './FilesProvider'
import NodeHeaderWrapper, { type IndentType } from './NodeHeader'
import NodeHeaderWrapper, {
ICON_CLASS,
type IndentType,
} from './NodeHeaderWrapper'
import { useNodeValidator } from './useNodeValidator'
import { useOpenPaths } from './useOpenPaths'
import { useTempNodes } from './useTempNodes'
import { Node, SidebarDocument, useTree } from './useTree'

const ICON_CLASS = 'min-w-6 h-6 text-muted-foreground'

function FolderHeader({
node,
open,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -97,6 +97,7 @@ export function useNodeValidator({
enabled: isEditing,
})

const keepFocused = value === ''
const onInputKeyDown = useCallback(
async (event: KeyboardEvent<HTMLInputElement>) => {
const val = inputRef.current?.value ?? ''
Expand All @@ -118,6 +119,6 @@ export function useNodeValidator({
onInputChange,
onInputKeyDown,
error: validationError,
keepFocused: !value,
keepFocused,
}
}

0 comments on commit 23c33ec

Please sign in to comment.