diff --git a/README-CN.md b/README-CN.md index 754e621..b94b532 100644 --- a/README-CN.md +++ b/README-CN.md @@ -1,10 +1,10 @@ 当然可以，下面是你的 `README` 文件的中文翻译： -# Apple Style Notes 插件 +# FolderFile Splitter 插件 [English](./README.md) | [中文](./README.zh.md) -**Apple Style Notes** 是一款 Obsidian 插件。它通过将文件夹和文件列表分开展示，从而提供了一种全新的文件管理方式。插件的界面交互受苹果设计理念的启发，旨在提供一种更简洁、更直观的方式来浏览和整理笔记。 +**FolderFile Splitter** 是一款 Obsidian 插件。它通过将文件夹和文件列表分开展示，从而提供了一种全新的文件管理方式。插件的界面交互受 Apple Notes 设计理念的启发，旨在提供一种更简洁、更直观的方式来浏览和整理笔记。 ## 功能 @@ -19,7 +19,7 @@ 1. **下载插件** -- 进入本仓库的 [Releases](https://github.com/XuQuan-nikkkki/apple-style-notes-plugin/releases) 页面。 +- 进入本仓库的 [Releases](https://github.com/XuQuan-nikkkki/FolderFile-Splitter-Plugin/releases) 页面。 - 下载最新的 `.zip` 压缩包。 2. **解压并放入插件文件夹** @@ -53,4 +53,4 @@ ## 反馈与问题 -如果你遇到任何 bug 或有功能建议，欢迎你在这个 [GitHub 仓库](https://github.com/XuQuan-nikkkki/apple-style-notes-plugin)中提交问题。你的反馈对于改进 Apple Style Notes 插件非常重要！ +如果你遇到任何 bug 或有功能建议，欢迎你在这个 [GitHub 仓库](https://github.com/XuQuan-nikkkki/FolderFile-Splitter-Plugin)中提交问题。你的反馈对于改进 FolderFile Splitter 插件非常重要！ diff --git a/README.md b/README.md index 5532db9..2148a79 100644 --- a/README.md +++ b/README.md @@ -1,8 +1,8 @@ -# Apple Style Notes Plugin +# FolderFile Splitter Plugin [English](./README.md) | [中文](./README-CN.md) -**Apple Style Notes** is an Obsidian plugin that brings a fresh approach to file management by splitting folders and files into distinct, visually separated lists. Inspired by Apple's elegant design principles, this plugin offers a cleaner, more intuitive way to browse and organize your notes. +**FolderFile Splitter** is an Obsidian plugin that brings a fresh approach to file management by splitting folders and files into distinct, visually separated lists. Inspired by Apple's elegant design principles, this plugin offers a cleaner, more intuitive way to browse and organize your notes. ## Features @@ -17,7 +17,7 @@ 1. **Download the Plugin** - - Go to the [Releases](https://github.com/XuQuan-nikkkki/apple-style-notes-plugin/releases) section of this repository. + - Go to the [Releases](https://github.com/XuQuan-nikkkki/FolderFile-Splitter-Plugin/releases) section of this repository. - Download the latest `.zip` file. 2. **Extract and Place in the Plugins Folder** @@ -49,4 +49,4 @@ To uninstall the plugin, simply disable or delete it from the Obsidian plugin se ## Feedback & Issues -If you encounter any bugs or have feature suggestions, please open an issue on this [GitHub repository](https://github.com/XuQuan-nikkkki/apple-style-notes-plugin). Your feedback is invaluable in helping us improve Apple Style Notes! +If you encounter any bugs or have feature suggestions, please open an issue on this [GitHub repository](https://github.com/XuQuan-nikkkki/FolderFile-Splitter-Plugin). Your feedback is invaluable in helping us improve FolderFile Splitter! diff --git a/manifest.json b/manifest.json index 9622430..24e291f 100644 --- a/manifest.json +++ b/manifest.json @@ -1,6 +1,6 @@ { - "id": "apple-style-notes", - "name": "Apple Style Notes", + "id": "folder-file-splitter", + "name": "FolderFile Splitter", "version": "0.1.0", "minAppVersion": "0.15.0", "description": "Splits folder and file lists into separate views, simplifying navigation, improving clarity, and making it more intuitive to organize your notes.", diff --git a/package-lock.json b/package-lock.json index fd3e1bd..99582c5 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,11 +1,11 @@ { - "name": "apple-style-notes-plugin", + "name": "folder-file-splitter", "version": "1.0.0", "lockfileVersion": 3, "requires": true, "packages": { "": { - "name": "apple-style-notes-plugin", + "name": "folder-file-splitter", "version": "1.0.0", "license": "MIT", "dependencies": { diff --git a/package.json b/package.json index 5cada08..4709987 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "name": "apple-style-notes-plugin", + "name": "folder-file-splitter", "version": "1.0.0", "description": "This is an Obsidian plugin", "main": "main.js", diff --git a/src/FileTreeView.tsx b/src/FileTreeView.tsx index c6266d0..69dc33a 100644 --- a/src/FileTreeView.tsx +++ b/src/FileTreeView.tsx @@ -1,14 +1,14 @@ import { Root, createRoot } from "react-dom/client"; import { ItemView, WorkspaceLeaf } from "obsidian"; -import AppleStyleNotesPlugin from "./main"; +import FolderFileSplitterPlugin from "./main"; import FileTree from "./components/FileTree"; export class FileTreeView extends ItemView { root: Root; - plugin: AppleStyleNotesPlugin; + plugin: FolderFileSplitterPlugin; - constructor(leaf: WorkspaceLeaf, plugin: AppleStyleNotesPlugin) { + constructor(leaf: WorkspaceLeaf, plugin: FolderFileSplitterPlugin) { super(leaf); this.plugin = plugin; } @@ -22,7 +22,7 @@ export class FileTreeView extends ItemView { } getIcon(): string { - return this.plugin?.ICON + return this.plugin?.ICON; } destroy() { @@ -38,7 +38,7 @@ export class FileTreeView extends ItemView { this.destroy(); this.root = createRoot(this.contentEl); this.root.render( -
+
); diff --git a/src/SettingTab.tsx b/src/SettingTab.tsx index 535069a..9898b3b 100644 --- a/src/SettingTab.tsx +++ b/src/SettingTab.tsx @@ -1,12 +1,12 @@ import { App, PluginSettingTab, Setting } from "obsidian"; -import AppleStyleNotesPlugin from "./main"; +import FolderFileSplitterPlugin from "./main"; import { expandFolderByClickingOnElement } from "./settings"; import { saveSettingsToLocalStorage } from "./utils"; export class SettingTab extends PluginSettingTab { - plugin: AppleStyleNotesPlugin; + plugin: FolderFileSplitterPlugin; - constructor(app: App, plugin: AppleStyleNotesPlugin) { + constructor(app: App, plugin: FolderFileSplitterPlugin) { super(app, plugin); this.plugin = plugin; } diff --git a/src/assets/constants.ts b/src/assets/constants.ts index beadb8d..a21ff8b 100644 --- a/src/assets/constants.ts +++ b/src/assets/constants.ts @@ -1,23 +1,24 @@ import { TAbstractFile } from "obsidian"; -export const ASN_FOCUSED_FOLDER_PATH_KEY = - "AppleStyleNotesPlugin-FocusedFolderPath"; -export const ASN_EXPANDED_FOLDER_PATHS_KEY = - "AppleStyleNotesPlugin-ExpandedFolderPaths"; -export const ASN_FOCUSED_FILE_PATH_KEY = - "AppleStyleNotesPlugin-FocusedFilePath"; -export const ASN_FOLDER_SORT_RULE_KEY = "AppleStyleNotesPlugin-FolderSortRule"; -export const ASN_FILE_SORT_RULE_KEY = "AppleStyleNotesPlugin-FileSortRule"; +export const FFS_FOCUSED_FOLDER_PATH_KEY = + "FolderFileSplitterPlugin-FocusedFolderPath"; +export const FFS_EXPANDED_FOLDER_PATHS_KEY = + "FolderFileSplitterPlugin-ExpandedFolderPaths"; +export const FFS_FOCUSED_FILE_PATH_KEY = + "FolderFileSplitterPlugin-FocusedFilePath"; +export const FFS_FOLDER_SORT_RULE_KEY = + "FolderFileSplitterPlugin-FolderSortRule"; +export const FFS_FILE_SORT_RULE_KEY = "FolderFileSplitterPlugin-FileSortRule"; -export const ASN_FOLDER_PANE_WIDTH_KEY = - "AppleStyleNotesPlugin-FolderPaneWidth"; +export const FFS_FOLDER_PANE_WIDTH_KEY = + "FolderFileSplitterPlugin-FolderPaneWidth"; -export const VaultChangeEventName = "ASN-VaultChangeEvent"; +export const VaultChangeEventName = "FFS-VaultChangeEvent"; export type VaultChangeType = "create" | "modify" | "delete" | "rename"; export type VaultChangeEvent = CustomEvent<{ file: TAbstractFile; changeType: VaultChangeType; }>; -export const ASN_PLUGIN_SETTINGS = "AppleStyleNotesPluging-Settings"; -export const SettingsChangeEventName = "ASN-SettingsChangeEvent"; \ No newline at end of file +export const FFS_PLUGIN_SETTINGS = "FolderFileSplitterPlugin-Settings"; +export const SettingsChangeEventName = "FFS-SettingsChangeEvent"; diff --git a/src/assets/icons/AddFileIcon.tsx b/src/assets/icons/AddFileIcon.tsx index db9ce9f..bd6a0df 100644 --- a/src/assets/icons/AddFileIcon.tsx +++ b/src/assets/icons/AddFileIcon.tsx @@ -8,7 +8,7 @@ const AddFileIcon = () => { strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" - className="asn-folder-actions-icon" + className="ffs-folder-actions-icon" > diff --git a/src/assets/icons/AddFolderIcon.tsx b/src/assets/icons/AddFolderIcon.tsx index 82a3011..0c1b90c 100644 --- a/src/assets/icons/AddFolderIcon.tsx +++ b/src/assets/icons/AddFolderIcon.tsx @@ -8,10 +8,10 @@ const AddFolderIcon = () => { strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" - className="asn-folder-actions-icon" + className="ffs-folder-actions-icon" > - - + + ); diff --git a/src/assets/icons/ArrowDownIcon.tsx b/src/assets/icons/ArrowDownIcon.tsx index 71b6af5..a3ed264 100644 --- a/src/assets/icons/ArrowDownIcon.tsx +++ b/src/assets/icons/ArrowDownIcon.tsx @@ -3,14 +3,12 @@ const ArrowDownIcon = () => ( viewBox="0 0 84.8212890625 52.0029296875" version="1.1" xmlns="http://www.w3.org/2000/svg" - className="asn-icon asn-arrow-down-icon" + className="ffs-icon ffs-arrow-down-icon" > - + ); -export default ArrowDownIcon \ No newline at end of file +export default ArrowDownIcon; diff --git a/src/assets/icons/ArrowRightIcon.tsx b/src/assets/icons/ArrowRightIcon.tsx index 6f8ec90..64ce039 100644 --- a/src/assets/icons/ArrowRightIcon.tsx +++ b/src/assets/icons/ArrowRightIcon.tsx @@ -3,14 +3,12 @@ const ArrowRightIcon = () => ( viewBox="0 0 60.2601318359375 84.8134765625" version="1.1" xmlns="http://www.w3.org/2000/svg" - className="asn-icon asn-arrow-right-icon" + className="ffs-icon ffs-arrow-right-icon" > - + ); -export default ArrowRightIcon \ No newline at end of file +export default ArrowRightIcon; diff --git a/src/assets/icons/AscendingSortIcon.tsx b/src/assets/icons/AscendingSortIcon.tsx index a2522a8..b5563a6 100644 --- a/src/assets/icons/AscendingSortIcon.tsx +++ b/src/assets/icons/AscendingSortIcon.tsx @@ -8,7 +8,7 @@ const AscendingSortIcon = () => { strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" - className="asn-folder-actions-icon asn-sort-icon" + className="ffs-folder-actions-icon ffs-sort-icon" > diff --git a/src/assets/icons/CollapseIcon.tsx b/src/assets/icons/CollapseIcon.tsx index 1b63615..e2d79e7 100644 --- a/src/assets/icons/CollapseIcon.tsx +++ b/src/assets/icons/CollapseIcon.tsx @@ -8,7 +8,7 @@ const CollapseIcon = () => { strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" - className="asn-folder-actions-icon asn-collapse-icon" + className="ffs-folder-actions-icon ffs-collapse-icon" > diff --git a/src/assets/icons/DescendingSortIcon.tsx b/src/assets/icons/DescendingSortIcon.tsx index 4604f02..c66106d 100644 --- a/src/assets/icons/DescendingSortIcon.tsx +++ b/src/assets/icons/DescendingSortIcon.tsx @@ -8,7 +8,7 @@ const DescendingSortIcon = () => { strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" - className="asn-folder-actions-icon asn-reverse-sort-icon" + className="ffs-folder-actions-icon ffs-reverse-sort-icon" > diff --git a/src/assets/icons/EmptyFolderIcon.tsx b/src/assets/icons/EmptyFolderIcon.tsx index d999901..214deda 100644 --- a/src/assets/icons/EmptyFolderIcon.tsx +++ b/src/assets/icons/EmptyFolderIcon.tsx @@ -3,7 +3,7 @@ const EmptyFolderIcon = () => ( version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 462.035 462.035" - className="asn-empty-folder-icon" + className="ffs-empty-folder-icon" > { strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" - className="asn-folder-actions-icon asn-expand-icon" + className="ffs-folder-actions-icon ffs-expand-icon" > diff --git a/src/assets/icons/FolderIcon.tsx b/src/assets/icons/FolderIcon.tsx index 0cbf1e0..16d976f 100644 --- a/src/assets/icons/FolderIcon.tsx +++ b/src/assets/icons/FolderIcon.tsx @@ -3,7 +3,7 @@ const FolderIcon = () => ( viewBox="0 0 110.889892578125 89.9892578125" version="1.1" xmlns="http://www.w3.org/2000/svg" - className="asn-icon asn-folder-icon" + className="ffs-icon ffs-folder-icon" > @@ -11,4 +11,4 @@ const FolderIcon = () => ( ); -export default FolderIcon \ No newline at end of file +export default FolderIcon; diff --git a/src/components/DraggableDivider.tsx b/src/components/DraggableDivider.tsx index 36c944a..7a49117 100644 --- a/src/components/DraggableDivider.tsx +++ b/src/components/DraggableDivider.tsx @@ -27,7 +27,7 @@ const DraggableDivider = ({ initialWidth, onChangeWidth }: Props) => { return (
diff --git a/src/components/File.tsx b/src/components/File.tsx index f37d725..6940998 100644 --- a/src/components/File.tsx +++ b/src/components/File.tsx @@ -4,14 +4,14 @@ import { StoreApi, UseBoundStore } from "zustand"; import { useShallow } from "zustand/react/shallow"; import { FileTreeStore } from "src/store"; -import AppleStyleNotesPlugin from "src/main"; +import FolderFileSplitterPlugin from "src/main"; import { moveCursorToEnd, selectText } from "src/utils"; import { FolderListModal } from "./FolderListModal"; type Props = { useFileTreeStore: UseBoundStore>; file: TFile; - plugin: AppleStyleNotesPlugin; + plugin: FolderFileSplitterPlugin; deleteFile: () => void; }; const File = ({ file, useFileTreeStore, plugin, deleteFile }: Props) => { @@ -169,9 +169,9 @@ const File = ({ file, useFileTreeStore, plugin, deleteFile }: Props) => { }; const isFocused = focusedFile?.path === file.path; - const className = "asn-file" + (isFocused ? " asn-focused-file" : ""); + const className = "ffs-file" + (isFocused ? " ffs-focused-file" : ""); const fileNameClassName = - "asn-file-name" + (isEditing ? " asn-file-name-edit-mode" : ""); + "ffs-file-name" + (isEditing ? " ffs-file-name-edit-mode" : ""); return (
{ > {name}
-
- +
+ {new Date(file.stat.ctime).toLocaleString().split(" ")[0]} - + {contentPreview}
diff --git a/src/components/FileActions/CreateFile.tsx b/src/components/FileActions/CreateFile.tsx index 96909bd..a470024 100644 --- a/src/components/FileActions/CreateFile.tsx +++ b/src/components/FileActions/CreateFile.tsx @@ -23,10 +23,7 @@ const CreateFile = ({ useFileTreeStore }: Props) => { }; return ( -
+
); diff --git a/src/components/FileActions/SortFiles.tsx b/src/components/FileActions/SortFiles.tsx index c03743f..8528fbc 100644 --- a/src/components/FileActions/SortFiles.tsx +++ b/src/components/FileActions/SortFiles.tsx @@ -5,7 +5,7 @@ import { useShallow } from "zustand/react/shallow"; import { AscendingSortIcon, DescendingSortIcon } from "src/assets/icons"; import { FileSortRule, FileTreeStore } from "src/store"; -import AppleStyleNotesPlugin from "src/main"; +import FolderFileSplitterPlugin from "src/main"; type FileSortRuleItem = { text: string; @@ -39,7 +39,7 @@ const FileSortByCreatedTimeRules: FileSortRuleGroup = [ type Props = { useFileTreeStore: UseBoundStore>; - plugin: AppleStyleNotesPlugin; + plugin: FolderFileSplitterPlugin; }; const SortFiles = ({ useFileTreeStore, plugin }: Props) => { const { @@ -93,7 +93,7 @@ const SortFiles = ({ useFileTreeStore, plugin }: Props) => { ); return ( -
+
{icon}
); diff --git a/src/components/FileTree.tsx b/src/components/FileTree.tsx index d00ef75..69ac30a 100644 --- a/src/components/FileTree.tsx +++ b/src/components/FileTree.tsx @@ -1,8 +1,8 @@ import { useMemo, useState } from "react"; -import AppleStyleNotesPlugin from "src/main"; +import FolderFileSplitterPlugin from "src/main"; import { createFileTreeStore } from "src/store"; -import { ASN_FOLDER_PANE_WIDTH_KEY } from "src/assets/constants"; +import { FFS_FOLDER_PANE_WIDTH_KEY } from "src/assets/constants"; import DraggableDivider from "./DraggableDivider"; import Files from "./Files"; import Folders from "./Folders"; @@ -13,7 +13,7 @@ import CreateFile from "./FileActions/CreateFile"; import SortFiles from "./FileActions/SortFiles"; type Props = { - plugin: AppleStyleNotesPlugin; + plugin: FolderFileSplitterPlugin; }; const FileTree = ({ plugin }: Props) => { const useFileTreeStore = useMemo( @@ -27,13 +27,13 @@ const FileTree = ({ plugin }: Props) => { const onChangeFolderPaneWidth = (width: number) => { setFolderPaneWidth(width); - localStorage.setItem(ASN_FOLDER_PANE_WIDTH_KEY, String(width)); + localStorage.setItem(FFS_FOLDER_PANE_WIDTH_KEY, String(width)); }; return ( -
-
-
+
+
+
{ initialWidth={folderPaneWidth} onChangeWidth={onChangeFolderPaneWidth} /> -
-
+
+
>; - plugin: AppleStyleNotesPlugin; + plugin: FolderFileSplitterPlugin; }; const Files = ({ useFileTreeStore, plugin }: Props) => { const { @@ -94,7 +94,7 @@ const Files = ({ useFileTreeStore, plugin }: Props) => { const renderNoneFilesTips = () => { return ( -
+
); diff --git a/src/components/Folder.tsx b/src/components/Folder.tsx index 6a21faf..afd89f2 100644 --- a/src/components/Folder.tsx +++ b/src/components/Folder.tsx @@ -4,7 +4,7 @@ import { StoreApi, UseBoundStore } from "zustand"; import { useShallow } from "zustand/react/shallow"; import { ArrowDownIcon, ArrowRightIcon, FolderIcon } from "src/assets/icons"; -import AppleStyleNotesPlugin from "src/main"; +import FolderFileSplitterPlugin from "src/main"; import { FileTreeStore } from "src/store"; import { moveCursorToEnd, selectText } from "src/utils"; import { FolderListModal } from "./FolderListModal"; @@ -12,7 +12,7 @@ import { SettingsChangeEventName } from "src/assets/constants"; type Props = { useFileTreeStore: UseBoundStore>; - plugin: AppleStyleNotesPlugin; + plugin: FolderFileSplitterPlugin; folder: TFolder; isRoot?: boolean; }; @@ -222,16 +222,16 @@ const Folder = ({ const isFocused = folder.path == focusedFolder?.path; const isExpanded = isRoot || expandedFolderPaths.includes(folder.path); - const folderClassNames = ["asn-folder"]; + const folderClassNames = ["ffs-folder"]; if (isFocused) { - folderClassNames.push("asn-focused-folder"); + folderClassNames.push("ffs-focused-folder"); } if (isRoot) { - folderClassNames.push("asn-root-folder"); + folderClassNames.push("ffs-root-folder"); } const folderNameClassName = - "asn-folder-name" + (isEditing ? " asn-folder-name-edit-mode" : ""); + "ffs-folder-name" + (isEditing ? " ffs-folder-name-edit-mode" : ""); return (
{ if (expandFolderByClickingOn == "folder") { e.stopPropagation(); @@ -252,7 +252,7 @@ const Folder = ({ }} > { if (expandFolderByClickingOn == "icon") { e.stopPropagation(); @@ -275,7 +275,7 @@ const Folder = ({ {name}
- {filesCount} + {filesCount}
); }; diff --git a/src/components/FolderActions/CreateFolder.tsx b/src/components/FolderActions/CreateFolder.tsx index 639d92b..5e6277f 100644 --- a/src/components/FolderActions/CreateFolder.tsx +++ b/src/components/FolderActions/CreateFolder.tsx @@ -23,7 +23,7 @@ const CreateFolder = ({ useFileTreeStore }: Props) => { }; return ( -
+
); diff --git a/src/components/FolderActions/SortFolders.tsx b/src/components/FolderActions/SortFolders.tsx index 92c77fe..d847e2f 100644 --- a/src/components/FolderActions/SortFolders.tsx +++ b/src/components/FolderActions/SortFolders.tsx @@ -5,7 +5,7 @@ import { useShallow } from "zustand/react/shallow"; import { AscendingSortIcon, DescendingSortIcon } from "src/assets/icons"; import { FileTreeStore, FolderSortRule } from "src/store"; -import AppleStyleNotesPlugin from "src/main"; +import FolderFileSplitterPlugin from "src/main"; type FolderSortRuleItem = { text: string; @@ -29,7 +29,7 @@ const FolderSortByFilesCountRules: FolderSortRuleGroup = [ type Props = { useFileTreeStore: UseBoundStore>; - plugin: AppleStyleNotesPlugin; + plugin: FolderFileSplitterPlugin; }; const SortFolders = ({ useFileTreeStore, plugin }: Props) => { const { @@ -80,7 +80,7 @@ const SortFolders = ({ useFileTreeStore, plugin }: Props) => { ); return ( -
+
{icon}
); diff --git a/src/components/FolderActions/ToggleFolders.tsx b/src/components/FolderActions/ToggleFolders.tsx index 30796c9..a65b99e 100644 --- a/src/components/FolderActions/ToggleFolders.tsx +++ b/src/components/FolderActions/ToggleFolders.tsx @@ -28,7 +28,7 @@ const ToggleFolders = ({ useFileTreeStore }: Props) => { }; return ( -
+
{isExpanded ? : }
); diff --git a/src/components/FolderListModal.tsx b/src/components/FolderListModal.tsx index 1395cc0..8c9c80b 100644 --- a/src/components/FolderListModal.tsx +++ b/src/components/FolderListModal.tsx @@ -1,12 +1,12 @@ import { SuggestModal, TAbstractFile, TFolder } from "obsidian"; -import AppleStyleNotesPlugin from "src/main"; +import FolderFileSplitterPlugin from "src/main"; export class FolderListModal extends SuggestModal { folders: TFolder[]; item: TAbstractFile; constructor( - plugin: AppleStyleNotesPlugin, + plugin: FolderFileSplitterPlugin, folders: TFolder[], item: TAbstractFile ) { diff --git a/src/components/Folders.tsx b/src/components/Folders.tsx index 8c9b997..cd21c4f 100644 --- a/src/components/Folders.tsx +++ b/src/components/Folders.tsx @@ -3,7 +3,7 @@ import { useShallow } from "zustand/react/shallow"; import { StoreApi, UseBoundStore } from "zustand"; import { TFolder } from "obsidian"; -import AppleStyleNotesPlugin from "src/main"; +import FolderFileSplitterPlugin from "src/main"; import { FileTreeStore } from "src/store"; import Folder from "./Folder"; import { @@ -15,7 +15,7 @@ import { isFolder } from "src/utils"; type Props = { useFileTreeStore: UseBoundStore>; - plugin: AppleStyleNotesPlugin; + plugin: FolderFileSplitterPlugin; }; const Folders = ({ useFileTreeStore, plugin }: Props) => { const { @@ -128,9 +128,9 @@ const Folders = ({ useFileTreeStore, plugin }: Props) => { /> {expandedFolderPaths.includes(folder.path) && hasFolderChildren(folder) && ( -
+
{showHierarchyLines && ( -
+
)} {renderFolders(getFoldersByParent(folder))}
@@ -143,9 +143,9 @@ const Folders = ({ useFileTreeStore, plugin }: Props) => { if (!rootFolder) return null; return ( -
+
{showHierarchyLines && ( -
+
)} ( changeKey: K, - changeValue: AppleStyleNotesPluginSettings[K] + changeValue: FolderFileSplitterPluginSettings[K] ) => { const event = new CustomEvent(SettingsChangeEventName, { detail: { diff --git a/src/settings.ts b/src/settings.ts index 52320d9..108bccb 100644 --- a/src/settings.ts +++ b/src/settings.ts @@ -1,13 +1,13 @@ export type expandFolderByClickingOnElement = "icon" | "folder"; -export interface AppleStyleNotesPluginSettings { +export interface FolderFileSplitterPluginSettings { expandFolderByClickingOn: expandFolderByClickingOnElement; includeSubfolderFilesCount: boolean; showFolderHierarchyLines: boolean; showFolderIcon: boolean; } -export const DEFAULT_SETTINGS: AppleStyleNotesPluginSettings = { +export const DEFAULT_SETTINGS: FolderFileSplitterPluginSettings = { expandFolderByClickingOn: "icon", includeSubfolderFilesCount: false, showFolderHierarchyLines: false, diff --git a/src/store.ts b/src/store.ts index cafd0e2..4012f0d 100644 --- a/src/store.ts +++ b/src/store.ts @@ -1,14 +1,14 @@ import { create } from "zustand"; import { TFile, TFolder } from "obsidian"; -import AppleStyleNotesPlugin from "./main"; +import FolderFileSplitterPlugin from "./main"; import { isFile, isFolder } from "./utils"; import { - ASN_EXPANDED_FOLDER_PATHS_KEY, - ASN_FILE_SORT_RULE_KEY, - ASN_FOCUSED_FILE_PATH_KEY, - ASN_FOCUSED_FOLDER_PATH_KEY, - ASN_FOLDER_SORT_RULE_KEY, + FFS_EXPANDED_FOLDER_PATHS_KEY, + FFS_FILE_SORT_RULE_KEY, + FFS_FOCUSED_FILE_PATH_KEY, + FFS_FOCUSED_FOLDER_PATH_KEY, + FFS_FOLDER_SORT_RULE_KEY, } from "./assets/constants"; export type FolderSortRule = @@ -76,7 +76,7 @@ export type FileTreeStore = { sortFiles: (files: TFile[], rule: FileSortRule) => TFile[]; }; -export const createFileTreeStore = (plugin: AppleStyleNotesPlugin) => +export const createFileTreeStore = (plugin: FolderFileSplitterPlugin) => create((set, get: () => FileTreeStore) => ({ folders: plugin.app.vault.getAllFolders() || [], rootFolder: plugin.app.vault.getRoot() || null, @@ -132,7 +132,7 @@ export const createFileTreeStore = (plugin: AppleStyleNotesPlugin) => }), setFocusedFolderAndSaveInLocalStorage: (folder: TFolder) => { get().setFocusedFolder(folder); - localStorage.setItem(ASN_FOCUSED_FOLDER_PATH_KEY, folder.path); + localStorage.setItem(FFS_FOCUSED_FOLDER_PATH_KEY, folder.path); }, _createFolder: async (path: string): Promise => { const newFolder = await plugin.app.vault.createFolder(path); @@ -213,11 +213,11 @@ export const createFileTreeStore = (plugin: AppleStyleNotesPlugin) => set({ folderSortRule: rule, }); - localStorage.setItem(ASN_FOLDER_SORT_RULE_KEY, rule); + localStorage.setItem(FFS_FOLDER_SORT_RULE_KEY, rule); }, restoreFolderSortRule: () => { const lastFolderSortRule = localStorage.getItem( - ASN_FOLDER_SORT_RULE_KEY + FFS_FOLDER_SORT_RULE_KEY ); if (lastFolderSortRule) { set({ @@ -230,13 +230,13 @@ export const createFileTreeStore = (plugin: AppleStyleNotesPlugin) => expandedFolderPaths: folderPaths, }); localStorage.setItem( - ASN_EXPANDED_FOLDER_PATHS_KEY, + FFS_EXPANDED_FOLDER_PATHS_KEY, JSON.stringify(folderPaths) ); }, restoreExpandedFolderPaths: () => { const lastExpandedFolderPaths = localStorage.getItem( - ASN_EXPANDED_FOLDER_PATHS_KEY + FFS_EXPANDED_FOLDER_PATHS_KEY ); if (lastExpandedFolderPaths) { try { @@ -251,7 +251,7 @@ export const createFileTreeStore = (plugin: AppleStyleNotesPlugin) => }, restoreLastFocusedFolder: () => { const lastFocusedFolderPath = localStorage.getItem( - ASN_FOCUSED_FOLDER_PATH_KEY + FFS_FOCUSED_FOLDER_PATH_KEY ); const { rootFolder, setFocusedFolder, findFolderByPath } = get(); if (lastFocusedFolderPath && lastFocusedFolderPath !== "/") { @@ -288,7 +288,7 @@ export const createFileTreeStore = (plugin: AppleStyleNotesPlugin) => const { setFocusedFile, openFile } = get(); setFocusedFile(file); openFile(file); - localStorage.setItem(ASN_FOCUSED_FILE_PATH_KEY, file.path); + localStorage.setItem(FFS_FOCUSED_FILE_PATH_KEY, file.path); }, readFile: async (file: TFile): Promise => { return await plugin.app.vault.read(file); @@ -343,7 +343,7 @@ export const createFileTreeStore = (plugin: AppleStyleNotesPlugin) => }, restoreLastFocusedFile: () => { const lastFocusedFilePath = localStorage.getItem( - ASN_FOCUSED_FILE_PATH_KEY + FFS_FOCUSED_FILE_PATH_KEY ); const { findFileByPath, selectFile } = get(); if (lastFocusedFilePath) { @@ -375,11 +375,11 @@ export const createFileTreeStore = (plugin: AppleStyleNotesPlugin) => set({ fileSortRule: rule, }); - localStorage.setItem(ASN_FILE_SORT_RULE_KEY, rule); + localStorage.setItem(FFS_FILE_SORT_RULE_KEY, rule); }, restoreFileSortRule: () => { const lastFileSortRule = localStorage.getItem( - ASN_FILE_SORT_RULE_KEY + FFS_FILE_SORT_RULE_KEY ); if (lastFileSortRule) { set({ diff --git a/src/utils.ts b/src/utils.ts index 718345a..d8140fd 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -1,6 +1,6 @@ import { TAbstractFile, TFile, TFolder } from "obsidian"; -import { AppleStyleNotesPluginSettings, DEFAULT_SETTINGS } from "./settings"; -import { ASN_PLUGIN_SETTINGS } from "./assets/constants"; +import { FolderFileSplitterPluginSettings, DEFAULT_SETTINGS } from "./settings"; +import { FFS_PLUGIN_SETTINGS } from "./assets/constants"; type FolderChild = TFile | TFolder | TAbstractFile; export const isFile = (item: FolderChild): item is TFile => { @@ -30,10 +30,10 @@ export const selectText = (element: HTMLElement) => { }; export const saveSettingsToLocalStorage = ( - settings: AppleStyleNotesPluginSettings + settings: FolderFileSplitterPluginSettings ) => { try { - localStorage.setItem(ASN_PLUGIN_SETTINGS, JSON.stringify(settings)); + localStorage.setItem(FFS_PLUGIN_SETTINGS, JSON.stringify(settings)); } catch (e) { console.error(e); } @@ -42,7 +42,7 @@ export const saveSettingsToLocalStorage = ( export const getSettingsFromLocalStorage = () => { let settings = DEFAULT_SETTINGS; try { - const settingsText = localStorage.getItem(ASN_PLUGIN_SETTINGS); + const settingsText = localStorage.getItem(FFS_PLUGIN_SETTINGS); if (settingsText) { settings = JSON.parse(settingsText); } diff --git a/styles.css b/styles.css index e510353..e10f4cf 100644 --- a/styles.css +++ b/styles.css @@ -9,74 +9,74 @@ If your plugin does not need CSS, delete this file. .theme-light, .theme-dark { - --asn-folder-pane-min-width: 140px; - --asn-files-pane-min-width: 200px; - --asn-folder-border-radius: 4px; + --ffs-folder-pane-min-width: 140px; + --ffs-files-pane-min-width: 200px; + --ffs-folder-border-radius: 4px; } .theme-light { - --asn-pane-divider-color: #d3d4d6; - --asn-folder-hover-background-color: #e5e5e5; - --asn-files-count-color: #a6a6a7; - --asn-folder-toggle-icon-color: #585a5d; - --asn-folder-focused-color: #fdf8eb; - --asn-focused-folder-background-color: #ecc44c; - --asn-actions-background-color: #e5e5e5; - --asn-actions-icon-color: #898989; - --asn-file-content-preview-color: #999999; - --asn-file-created-time-color: #515151; - --asn-editing-mode-color: #000000; - --asn-editing-background-color: #ffffff; - --asn-folder-hierarchy-line-color: #e1dede; + --ffs-pane-divider-color: #d3d4d6; + --ffs-folder-hover-background-color: #e5e5e5; + --ffs-files-count-color: #a6a6a7; + --ffs-folder-toggle-icon-color: #585a5d; + --ffs-folder-focused-color: #fdf8eb; + --ffs-focused-folder-background-color: #ecc44c; + --ffs-actions-background-color: #e5e5e5; + --ffs-actions-icon-color: #898989; + --ffs-file-content-preview-color: #999999; + --ffs-file-created-time-color: #515151; + --ffs-editing-mode-color: #000000; + --ffs-editing-background-color: #ffffff; + --ffs-folder-hierarchy-line-color: #e1dede; } .theme-dark { - --asn-pane-divider-color: #000000; - --asn-folder-hover-background-color: #2e2d2c; - --asn-files-count-color: #89898a; - --asn-folder-toggle-icon-color: #bfc2c2; - --asn-folder-focused-color: #ffffff; - --asn-focused-folder-background-color: #debe5b; - --asn-actions-background-color: #2e2d2c; - --asn-actions-icon-color: #a59982; - --asn-file-content-preview-color: #9b9d9f; - --asn-file-created-time-color: #dddede; - --asn-editing-mode-color: #ffffff; - --asn-editing-background-color: #000000; - --asn-folder-hierarchy-line-color: #474341; + --ffs-pane-divider-color: #000000; + --ffs-folder-hover-background-color: #2e2d2c; + --ffs-files-count-color: #89898a; + --ffs-folder-toggle-icon-color: #bfc2c2; + --ffs-folder-focused-color: #ffffff; + --ffs-focused-folder-background-color: #debe5b; + --ffs-actions-background-color: #2e2d2c; + --ffs-actions-icon-color: #a59982; + --ffs-file-content-preview-color: #9b9d9f; + --ffs-file-created-time-color: #dddede; + --ffs-editing-mode-color: #ffffff; + --ffs-editing-background-color: #000000; + --ffs-folder-hierarchy-line-color: #474341; } -.asn-plugin-view { +.ffs-plugin-view { height: 100%; min-width: calc( - var(--asn-folder-pane-min-width) + var(--asn-files-pane-min-width) + var(--ffs-folder-pane-min-width) + var(--ffs-files-pane-min-width) ); } -.asn-plugin-container { +.ffs-plugin-container { display: flex; height: 100%; overflow-y: hidden; } -.asn-folder-pane { - min-width: var(--asn-folder-pane-min-width); +.ffs-folder-pane { + min-width: var(--ffs-folder-pane-min-width); margin-right: 8px; overflow-y: auto; } -.asn-files-pane { - min-width: var(--asn-files-pane-min-width); +.ffs-files-pane { + min-width: var(--ffs-files-pane-min-width); flex: 1; overflow-y: auto; } -.asn-pane-divider { - border: 1px solid var(--asn-pane-divider-color); +.ffs-pane-divider { + border: 1px solid var(--ffs-pane-divider-color); cursor: ew-resize; } -.asn-folder { +.ffs-folder { height: 30px; font-size: 13px; @@ -87,24 +87,24 @@ If your plugin does not need CSS, delete this file. padding-right: 6px; } -.asn-folder:hover { - background-color: var(--asn-folder-hover-background-color); - border-radius: var(--asn-folder-border-radius); +.ffs-folder:hover { + background-color: var(--ffs-folder-hover-background-color); + border-radius: var(--ffs-folder-border-radius); } -.asn-root-folder { +.ffs-root-folder { font-size: 14px; font-weight: 450; } -.asn-folder-pane-left-sectionn { +.ffs-folder-pane-left-sectionn { display: flex; align-items: center; flex: 1; overflow: hidden; } -.asn-folder-arrow-icon-wrapper { +.ffs-folder-arrow-icon-wrapper { width: 14px; display: flex; align-items: center; @@ -112,82 +112,82 @@ If your plugin does not need CSS, delete this file. padding: 2px; } -.asn-folder-icon { +.ffs-folder-icon { width: 14px; height: 12px; fill: #d19600; margin-right: 8px; } -.asn-root-folder .asn-folder-icon { +.ffs-root-folder .ffs-folder-icon { width: 16px; height: 14px; } -.asn-root-folder .asn-folder-arrow-icon-wrapper { +.ffs-root-folder .ffs-folder-arrow-icon-wrapper { width: 4px; } -.asn-root-folder .asn-root-folder-icon { +.ffs-root-folder .ffs-root-folder-icon { width: 16px; height: 14px; } -.asn-arrow-down-icon, -.asn-arrow-right-icon { +.ffs-arrow-down-icon, +.ffs-arrow-right-icon { width: 8px; height: 8px; fill: #5a5d63; } -.asn-files-count { - color: var(--asn-files-count-color); +.ffs-files-count { + color: var(--ffs-files-count-color); font-size: 12px; margin-left: 4px; } -.asn-folder-pane .asn-focused-folder { - background-color: var(--asn-focused-folder-background-color); - border-radius: var(--asn-folder-border-radius); +.ffs-folder-pane .ffs-focused-folder { + background-color: var(--ffs-focused-folder-background-color); + border-radius: var(--ffs-folder-border-radius); } -.asn-folder-pane .asn-folder-name-edit-mode { - background-color: var(--asn-editing-background-color) !important; - color: var(--asn-editing-mode-color) !important; +.ffs-folder-pane .ffs-folder-name-edit-mode { + background-color: var(--ffs-editing-background-color) !important; + color: var(--ffs-editing-mode-color) !important; } -.asn-files-pane .asn-file-name-edit-mode { - background-color: var(--asn-editing-background-color) !important; - color: var(--asn-editing-mode-color) !important; +.ffs-files-pane .ffs-file-name-edit-mode { + background-color: var(--ffs-editing-background-color) !important; + color: var(--ffs-editing-mode-color) !important; } -.asn-focused-folder, -.asn-focused-folder .asn-files-count { - color: var(--asn-folder-focused-color); +.ffs-focused-folder, +.ffs-focused-folder .ffs-files-count { + color: var(--ffs-folder-focused-color); font-weight: 450; } -.asn-focused-folder .asn-arrow-down-icon, -.asn-focused-folder .asn-folder-icon { - fill: var(--asn-folder-focused-color); +.ffs-focused-folder .ffs-arrow-down-icon, +.ffs-focused-folder .ffs-folder-icon { + fill: var(--ffs-folder-focused-color); } -.asn-folder-name { +.ffs-folder-name { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } -.asn-folder-wrapper { +.ffs-folder-wrapper { position: relative; } -.asn-sub-folders-section { +.ffs-sub-folders-section { margin-left: 14px; } -.asn-none-files-tips { +.ffs-none-files-tips { width: 100%; height: 100%; display: flex; @@ -195,41 +195,41 @@ If your plugin does not need CSS, delete this file. align-items: center; } -.asn-hierarchy-line { +.ffs-hierarchy-line { width: 1px; - border-left: 1px solid var(--asn-folder-hierarchy-line-color); + border-left: 1px solid var(--ffs-folder-hierarchy-line-color); position: absolute; left: -2px; top: 0; bottom: 0px; } -.asn-none-files-tips .asn-empty-folder-icon { +.ffs-none-files-tips .ffs-empty-folder-icon { width: 60px; height: 60px; fill: #bdbdbd; } -.asn-file { +.ffs-file { height: 56px; font-size: 12px; margin-left: 12px; display: flex; flex-direction: column; justify-content: center; - border-radius: var(--asn-folder-border-radius); + border-radius: var(--ffs-folder-border-radius); padding: 0 12px; } -.asn-file:not(:last-child) { +.ffs-file:not(:last-child) { border-bottom: 1px solid #e6e6e6; } -.asn-file:hover { +.ffs-file:hover { background-color: #dcdcdc; } -.asn-file .asn-file-name { +.ffs-file .ffs-file-name { font-size: 13px; font-weight: 600; overflow: hidden; @@ -237,54 +237,54 @@ If your plugin does not need CSS, delete this file. white-space: nowrap; } -.asn-file .asn-file-created-time { +.ffs-file .ffs-file-created-time { letter-spacing: -0.5px; width: 60px; - color: var(--asn-file-created-time-color); + color: var(--ffs-file-created-time-color); font-weight: 480; } -.asn-file-details { +.ffs-file-details { display: flex; margin-top: 4px; } -.asn-files-pane .asn-focused-file { - background-color: var(--asn-focused-folder-background-color); +.ffs-files-pane .ffs-focused-file { + background-color: var(--ffs-focused-folder-background-color); } -.asn-file-content-preview { +.ffs-file-content-preview { flex: 1; margin-left: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12px; - color: var(--asn-file-content-preview-color); + color: var(--ffs-file-content-preview-color); } -.asn-actions { +.ffs-actions { margin: 0px auto 4px; padding: 8px 16px 4px; - border-radius: var(--asn-folder-border-radius); - background-color: var(--asn-actions-background-color); + border-radius: var(--ffs-folder-border-radius); + background-color: var(--ffs-actions-background-color); display: flex; } -.asn-file-actions { +.ffs-file-actions { margin-left: 12px; } -.asn-folder-actions-icon { +.ffs-folder-actions-icon { width: 18px; height: 18px; - stroke: var(--asn-actions-icon-color); + stroke: var(--ffs-actions-icon-color); } -.asn-folder-actions-icon:hover { +.ffs-folder-actions-icon:hover { transform: scale(1.1); } -.asn-actions-icon-wrapper:not(:last-child) { +.ffs-actions-icon-wrapper:not(:last-child) { margin-right: 12px; }