mirror of
https://github.com/xuquan-nikkkki/FolderFile-Splitter-Plugin.git
synced 2026-07-22 05:37:28 +00:00
fix: allow tag to deselect
This commit is contained in:
parent
476d6403f4
commit
2686818e95
4 changed files with 40 additions and 16 deletions
|
|
@ -119,8 +119,8 @@ const FolderContent = ({ folder }: Props) => {
|
|||
<TogglableContainer
|
||||
nameRef={nameRef}
|
||||
isFocused={isFocused}
|
||||
onFocus={async () => await changeFocusedFolder(folder)}
|
||||
onToggle={() => toggleFolder(folder)}
|
||||
onSelect={async () => await changeFocusedFolder(folder)}
|
||||
onToggleExpand={() => toggleFolder(folder)}
|
||||
className="ffs__folder"
|
||||
onContextMenu={onShowContextMenu}
|
||||
>
|
||||
|
|
|
|||
|
|
@ -31,6 +31,7 @@ const TagContent = ({ tag }: Props) => {
|
|||
unpinTag,
|
||||
changeFocusedTag,
|
||||
toggleTag,
|
||||
deselectFocusedTag,
|
||||
} = useExplorerStore(
|
||||
useShallow((store) => ({
|
||||
focusedTag: store.focusedTag,
|
||||
|
|
@ -39,13 +40,14 @@ const TagContent = ({ tag }: Props) => {
|
|||
unpinTag: store.unpinTag,
|
||||
changeFocusedTag: store.changeFocusedTag,
|
||||
toggleTag: store.toggleTag,
|
||||
deselectFocusedTag: store.deselectFocusedTag,
|
||||
}))
|
||||
);
|
||||
|
||||
const nameRef = useRef<NameRef>(null);
|
||||
const contentRef = useRef<HTMLDivElement | null>(null);
|
||||
|
||||
const isFocused = tag.fullPath == focusedTag?.fullPath;
|
||||
const isFocused = tag.fullPath === focusedTag?.fullPath;
|
||||
|
||||
const addPinInMenu = (menu: Menu) => {
|
||||
const isPinned = isTagPinned(tag);
|
||||
|
|
@ -81,8 +83,9 @@ const TagContent = ({ tag }: Props) => {
|
|||
<TogglableContainer
|
||||
nameRef={nameRef}
|
||||
isFocused={isFocused}
|
||||
onFocus={async () => await changeFocusedTag(tag)}
|
||||
onToggle={() => toggleTag(tag)}
|
||||
onSelect={() => changeFocusedTag(tag)}
|
||||
onDeselect={deselectFocusedTag}
|
||||
onToggleExpand={() => toggleTag(tag)}
|
||||
className="ffs__tag"
|
||||
onContextMenu={onShowContextMenu}
|
||||
>
|
||||
|
|
|
|||
|
|
@ -10,17 +10,19 @@ import ScrollInToViewContainer from "./ScrollInToViewContainer";
|
|||
|
||||
type Props = {
|
||||
isFocused: boolean;
|
||||
onFocus: AsyncNoop;
|
||||
onToggle: Noop;
|
||||
onSelect: AsyncNoop | Noop;
|
||||
onToggleExpand: Noop;
|
||||
nameRef: RefObject<NameRef | null>;
|
||||
children: ReactNode;
|
||||
onDeselect?: AsyncNoop | Noop;
|
||||
} & HTMLAttributes<HTMLDivElement>;
|
||||
const TogglableContainer = ({
|
||||
nameRef,
|
||||
isFocused,
|
||||
onFocus,
|
||||
onToggle,
|
||||
onSelect,
|
||||
onToggleExpand,
|
||||
children,
|
||||
onDeselect,
|
||||
...props
|
||||
}: Props) => {
|
||||
const { plugin } = useExplorer();
|
||||
|
|
@ -34,16 +36,22 @@ const TogglableContainer = ({
|
|||
e.preventDefault();
|
||||
|
||||
if (!isFocused) {
|
||||
await onFocus();
|
||||
await onSelect();
|
||||
} else if (onDeselect) {
|
||||
onDeselect();
|
||||
}
|
||||
if (nameRef.current && !nameRef.current.isFocusing) {
|
||||
nameRef.current.setIsFocusing(true);
|
||||
if (nameRef.current) {
|
||||
if (!nameRef.current.isFocusing) {
|
||||
nameRef.current.setIsFocusing(true);
|
||||
} else if (onDeselect) {
|
||||
nameRef.current.setIsFocusing(false);
|
||||
}
|
||||
}
|
||||
if (expandNodeByClick === EXPAND_NODE_ON_CLICK.LABEL) {
|
||||
onToggle();
|
||||
onToggleExpand();
|
||||
} else if (expandNodeByClick === EXPAND_NODE_ON_CLICK.SELECTED_LABEL) {
|
||||
if (nameRef.current?.isFocusing) {
|
||||
onToggle();
|
||||
onToggleExpand();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -14,8 +14,11 @@ export interface FocusedTagSlice {
|
|||
isFocusedTag: (tag: TagNode) => boolean;
|
||||
setFocusedTagAndSave: (tag: TagNode | null) => void;
|
||||
|
||||
changeFocusedTag: (folder: TagNode | null) => Promise<void>;
|
||||
changeFocusedTag: (folder: TagNode | null) => void;
|
||||
restoreLastFocusedTag: () => void;
|
||||
|
||||
clearFocusedTag: () => void;
|
||||
deselectFocusedTag: () => void;
|
||||
}
|
||||
|
||||
export const createFocusedTagSlice =
|
||||
|
|
@ -39,7 +42,7 @@ export const createFocusedTagSlice =
|
|||
});
|
||||
},
|
||||
|
||||
changeFocusedTag: async (tag: TagNode) => {
|
||||
changeFocusedTag: (tag: TagNode) => {
|
||||
const {
|
||||
focusedFile,
|
||||
changeToTagMode,
|
||||
|
|
@ -69,4 +72,14 @@ export const createFocusedTagSlice =
|
|||
validate: (tag) => Boolean(tag),
|
||||
});
|
||||
},
|
||||
|
||||
clearFocusedTag: async () => {
|
||||
get().setFocusedTagAndSave(null);
|
||||
},
|
||||
|
||||
deselectFocusedTag: () => {
|
||||
const { clearFocusedTag, changeToAllMode } = get();
|
||||
clearFocusedTag();
|
||||
changeToAllMode();
|
||||
},
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in a new issue