-
- {formData.contextSource?.inclusions?.trim()
- ? "Patterns configured"
- : "No patterns configured"}
+
+ Patterns configure：
+
+ {showContext}
+
- new ProjectPatternMatchingModal(
- app,
- (value: string) => {
- handleInputChange("contextSource.inclusions", value);
- },
- formData.contextSource?.inclusions || "",
- "Manage Inclusions"
- ).open()
- }
+ onClick={() => {
+ handleEditProjectContext(formData);
+ }}
>
- Manage Patterns
-
-
-
-
-
-
-
- {formData.contextSource?.exclusions?.trim()
- ? "Patterns configured"
- : "No patterns configured"}
-
-
- new ProjectPatternMatchingModal(
- app,
- (value: string) => {
- handleInputChange("contextSource.exclusions", value);
- },
- formData.contextSource?.exclusions || "",
- "Manage Exclusions"
- ).open()
- }
- >
- Manage Patterns
+ Manage Context
diff --git a/src/components/modals/project/context-manage-modal.tsx b/src/components/modals/project/context-manage-modal.tsx
new file mode 100644
index 00000000..c51507ff
--- /dev/null
+++ b/src/components/modals/project/context-manage-modal.tsx
@@ -0,0 +1,1059 @@
+import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import {
+ FileAudio,
+ FileImage,
+ FileText,
+ FileVideo,
+ FolderIcon,
+ Plus,
+ PlusCircle,
+ TagIcon,
+ XIcon,
+} from "lucide-react";
+import { ScrollArea } from "@/components/ui/scroll-area";
+import { ResizableHandle, ResizablePanel, ResizablePanelGroup } from "@/components/ui/resizable";
+import { Separator } from "@/components/ui/separator";
+import { cn } from "@/lib/utils";
+import { App, Modal, Notice, TFile } from "obsidian";
+import { createRoot, Root } from "react-dom/client";
+import { ProjectConfig } from "@/aiParams";
+import { Button } from "@/components/ui/button";
+import { SearchBar } from "@/components/ui/SearchBar";
+import { TagSearchModal } from "@/components/modals/TagSearchModal";
+import { FolderSearchModal } from "@/components/modals/FolderSearchModal";
+import { ProjectFileSelectModal } from "@/components/modals/ProjectFileSelectModal";
+import {
+ createPatternSettingsValue,
+ getFilePattern,
+ getMatchingPatterns,
+ getTagPattern,
+ PatternCategory,
+ shouldIndexFile,
+} from "@/search/searchUtils";
+import { getTagsFromNote } from "@/utils";
+import { TruncatedText } from "@/components/TruncatedText";
+
+function FileIcon({ extension, size = "tw-size-4" }: { extension: string; size?: string }) {
+ const ext = extension.toLowerCase().replace("*.", "");
+ if (["jpg", "jpeg", "png", "gif", "svg"].includes(ext))
+ return
;
+ if (["mp3", "wav", "ogg"].includes(ext))
+ return
;
+ if (["mp4", "mov", "avi"].includes(ext))
+ return
;
+ if (["md", "txt", "mdx", "markdown"].includes(ext)) return
;
+
+ return
;
+}
+
+interface ParsedQuery {
+ tags: string[];
+ titles: string[];
+ extensions: string[];
+}
+
+type ActiveSection = "tags" | "folders" | "files" | "extensions" | "ignoreFiles" | "search" | null;
+type ActiveItem = string | null;
+
+interface SectionHeaderProps {
+ IconComponent: React.ComponentType
;
+ title: string;
+ iconColorClassName: string;
+ onAddClick: () => void;
+}
+
+const SectionHeader: React.FC = ({
+ IconComponent,
+ title,
+ iconColorClassName,
+ onAddClick,
+}) => {
+ return (
+
+ );
+};
+
+interface SectionItem {
+ id: string;
+ name: string;
+ count?: number;
+}
+
+interface SectionListProps {
+ title: string;
+ IconComponent: React.ComponentType;
+ iconColorClassName: string;
+ items: SectionItem[];
+ activeItem: string | null;
+ activeSection: string | null;
+ sectionType: string;
+ renderIcon?: (item: SectionItem) => React.ReactNode;
+ onItemClick: (itemId: string, itemName?: string) => void;
+ onAddClick: () => void;
+ onDeleteItem: (e: React.MouseEvent, item: SectionItem) => void;
+}
+
+const SectionList: React.FC = ({
+ title,
+ IconComponent,
+ iconColorClassName,
+ items,
+ activeItem,
+ activeSection,
+ sectionType,
+ renderIcon,
+ onItemClick,
+ onAddClick,
+ onDeleteItem,
+}) => {
+ return (
+
+
+
+ {items.map((item) => (
+
onItemClick(item.id, item.name)}
+ >
+
+ {renderIcon ? (
+ renderIcon(item)
+ ) : (
+ {item.name}
+
+
+
+ {item.count || 0}
+
+ onDeleteItem(e, item)}
+ />
+
+
+ ))}
+
+
+
+
+
+
+ {item.isIgnored && (Ignored files) }
+ {item.name}
+
+ {item.id && (
+ {item.id}
+ )}
+
+
+
+ onDelete(e, item)}
+ />
+
+
>;
+ folders: Record>;
+ extensions: Record>;
+ notes: Array;
+}
+
+interface IgnoreItems {
+ files: Set;
+}
+
+function ContextManage({ initialProject, onSave, onCancel, app }: ContextManageProps) {
+ const { inclusions: inclusionPatterns, exclusions: exclusionPatterns } = useMemo(() => {
+ return getMatchingPatterns({
+ inclusions: initialProject?.contextSource.inclusions,
+ exclusions: initialProject?.contextSource.exclusions,
+ isProject: true,
+ });
+ }, [initialProject.contextSource]);
+
+ const appAllFiles = useMemo(() => {
+ return app.vault.getFiles();
+ }, [app.vault]);
+
+ // init groupList
+ const createAndPopulateGroupList = useCallback(
+ (
+ appFiles: TFile[],
+ inclusionPatterns: PatternCategory | null,
+ exclusionPatterns: PatternCategory | null
+ ): GroupListItem => {
+ const projectAllFiles = appFiles.filter((file) =>
+ shouldIndexFile(file, inclusionPatterns, exclusionPatterns)
+ );
+
+ const processPatternGroup = (
+ file: TFile,
+ patterns: string[] | undefined,
+ patternType: "tagPatterns" | "folderPatterns" | "extensionPatterns",
+ targetGroup: Record>
+ ) => {
+ if (patterns) {
+ patterns.forEach((pattern) => {
+ const singlePatternConfig = { [patternType]: [pattern] };
+ if (
+ shouldIndexFile(file, singlePatternConfig, null) &&
+ !targetGroup[pattern].some((item) => item.id === file.path)
+ ) {
+ targetGroup[pattern].push({
+ id: file.path,
+ name: file.basename,
+ });
+ }
+ });
+ }
+ };
+
+ // initialize groups
+ const tags: Record> = {};
+ const folders: Record> = {};
+ const extensions: Record> = {};
+ const notes: Array = [];
+
+ (inclusionPatterns?.tagPatterns ?? []).forEach((tag) => {
+ tags[tag] = [];
+ });
+ (inclusionPatterns?.folderPatterns ?? []).forEach((folder) => {
+ folders[folder] = [];
+ });
+ (inclusionPatterns?.extensionPatterns ?? []).forEach((extension) => {
+ extensions[extension] = [];
+ });
+
+ // Traverse the files and populate them into corresponding groups
+ projectAllFiles.forEach((file) => {
+ // tag
+ processPatternGroup(file, inclusionPatterns?.tagPatterns, "tagPatterns", tags);
+
+ // folder
+ processPatternGroup(file, inclusionPatterns?.folderPatterns, "folderPatterns", folders);
+
+ // extension
+ processPatternGroup(
+ file,
+ inclusionPatterns?.extensionPatterns,
+ "extensionPatterns",
+ extensions
+ );
+
+ // note/file
+ if (
+ inclusionPatterns?.notePatterns &&
+ shouldIndexFile(file, { notePatterns: inclusionPatterns.notePatterns }, null) &&
+ !notes.some((item) => item.id === file.path)
+ ) {
+ notes.push({
+ id: file.path,
+ name: file.basename,
+ });
+ }
+ });
+
+ return {
+ tags,
+ folders,
+ extensions,
+ notes,
+ };
+ },
+ []
+ );
+
+ const [groupList, setGroupList] = useState(() => {
+ // init include files
+ return createAndPopulateGroupList(appAllFiles, inclusionPatterns, exclusionPatterns);
+ });
+ const [ignoreItems, setIgnoreItems] = useState(() => {
+ // init exclude files
+ const excludeFiles = appAllFiles.filter(
+ (file) => exclusionPatterns && shouldIndexFile(file, exclusionPatterns, null)
+ );
+ return {
+ files: new Set(excludeFiles),
+ };
+ });
+
+ const latestGroupList = useRef(groupList);
+ const latestIgnoreItems = useRef(ignoreItems);
+
+ const [searchTerm, setSearchTerm] = useState("");
+ const [activeSection, setActiveSection] = useState(null);
+ const [activeItem, setActiveItem] = useState(null);
+
+ // groupList convert to inclusions format
+ const convertGroupListToInclusions = useCallback(
+ (list: GroupListItem, appFiles: TFile[]): string => {
+ const tagPatterns = Object.keys(list.tags);
+ const folderPatterns = Object.keys(list.folders);
+ const extensionPatterns = Object.keys(list.extensions);
+ const notePatterns = list.notes
+ .map((note) => {
+ const file = appFiles.find((file) => file.path === note.id);
+ if (file) {
+ return getFilePattern(file);
+ }
+ })
+ .filter(Boolean) as string[];
+
+ return createPatternSettingsValue({
+ tagPatterns,
+ folderPatterns,
+ extensionPatterns,
+ notePatterns,
+ });
+ },
+ []
+ );
+
+ // ignore file items convert to exclusions format
+ const convertDeletedItemsToExclusions = useCallback((items: IgnoreItems): string => {
+ const notePatterns = new Array(...items.files).map((file) => getFilePattern(file));
+
+ return createPatternSettingsValue({ notePatterns: notePatterns }) || "";
+ }, []);
+
+ useEffect(() => {
+ latestGroupList.current = groupList;
+ latestIgnoreItems.current = ignoreItems;
+ }, [groupList, ignoreItems]);
+
+ const allItems: Array<{ id: string; name: string }> = useMemo(() => {
+ const items: Array<{ id: string; name: string }> = [];
+
+ const addFilesToItems = (
+ items: Array<{ id: string; name: string }>,
+ groupItems: GroupItem[]
+ ): void => {
+ groupItems.forEach((groupItem) => {
+ if (!items.some((item) => item.id === groupItem.id)) {
+ items.push({
+ id: groupItem.id,
+ name: groupItem.name,
+ });
+ }
+ });
+ };
+
+ const arr = [
+ groupList.tags,
+ groupList.folders,
+ groupList.extensions,
+ { notes: groupList.notes },
+ ];
+
+ arr.forEach((item) => {
+ Object.values(item).forEach((groupItems) => {
+ addFilesToItems(items, groupItems);
+ });
+ });
+
+ return items;
+ }, [groupList]);
+
+ const parseSearchQuery = useCallback((query: string): ParsedQuery => {
+ const tags: string[] = [];
+ const titles: string[] = [];
+ const extensions: string[] = [];
+
+ const parts = query
+ .split(",")
+ .map((p) => p.trim())
+ .filter((p) => p);
+
+ parts.forEach((part) => {
+ if (part.startsWith("#")) {
+ // tag
+ tags.push(part.substring(1));
+ } else if (part.startsWith(".") || part.startsWith("*.")) {
+ extensions.push(part.replace("*", ""));
+ } else {
+ // All other content is matched as title.
+ titles.push(part);
+ }
+ });
+ return { tags, titles, extensions };
+ }, []);
+
+ const getDisplayItems = useMemo(() => {
+ if (searchTerm) {
+ // Custom search
+ const parsedQuery = parseSearchQuery(searchTerm);
+ return allItems
+ .filter((item) => {
+ const fileObj = appAllFiles.find((f) => f.path === item.id);
+ if (!fileObj) return false;
+
+ const isNote = fileObj.extension === "md";
+
+ const matchesTag =
+ parsedQuery.tags.length > 0 &&
+ isNote &&
+ parsedQuery.tags.some((queryTag) => {
+ const fileTags = getTagsFromNote(fileObj);
+ return fileTags.some((tag) => {
+ const cleanTag = tag.startsWith("#") ? tag.substring(1) : tag;
+ return cleanTag.toLowerCase().includes(queryTag.toLowerCase());
+ });
+ });
+
+ const matchesTitle =
+ parsedQuery.titles.length > 0 &&
+ parsedQuery.titles.some((t) =>
+ fileObj.basename.toLowerCase().includes(t.toLowerCase())
+ );
+
+ const matchesExtension =
+ parsedQuery.extensions.length > 0 &&
+ parsedQuery.extensions.some(
+ (ext) => `.${fileObj.extension}`.toLowerCase() === ext.toLowerCase()
+ );
+
+ const hasSpecificFilters =
+ parsedQuery.tags.length > 0 ||
+ parsedQuery.titles.length > 0 ||
+ parsedQuery.extensions.length > 0;
+
+ if (hasSpecificFilters) {
+ return matchesTag || matchesTitle || matchesExtension;
+ }
+ return false;
+ })
+ .map((item) => {
+ return {
+ id: item.id,
+ name: item.name,
+ };
+ });
+ }
+
+ if (activeSection === "tags" && activeItem) {
+ const tagFiles = groupList.tags[activeItem];
+ if (tagFiles) {
+ return tagFiles;
+ }
+ return [];
+ }
+
+ if (activeSection === "folders" && activeItem) {
+ const folderFiles = groupList.folders[activeItem];
+ if (folderFiles) {
+ return folderFiles;
+ }
+ return [];
+ }
+
+ if (activeSection === "files") {
+ return groupList.notes;
+ }
+
+ if (activeSection === "extensions" && activeItem) {
+ const extensionFiles = groupList.extensions[activeItem];
+ if (extensionFiles) {
+ return extensionFiles;
+ }
+ return [];
+ }
+
+ if (activeSection === "ignoreFiles") {
+ return Array.from(ignoreItems.files).map((file) => ({
+ id: file.path,
+ name: file.basename,
+ }));
+ }
+
+ return [];
+ }, [
+ searchTerm,
+ activeSection,
+ activeItem,
+ parseSearchQuery,
+ allItems,
+ appAllFiles,
+ groupList.tags,
+ groupList.folders,
+ groupList.notes,
+ groupList.extensions,
+ ignoreItems.files,
+ ]);
+
+ const sortItems = useCallback((items: GroupItem[]) => {
+ return [...items].sort((a, b) => {
+ return a.name.toLowerCase().localeCompare(b.name.toLowerCase());
+ });
+ }, []);
+
+ const makeSectionItem = useCallback(
+ (
+ groupData: Record>,
+ nameTransform?: (name: string) => string
+ ): SectionItem[] => {
+ return Object.entries(groupData)
+ .sort(([a], [b]) => a.localeCompare(b))
+ .map(([itemName, itemFiles]) => ({
+ id: itemName,
+ name: nameTransform ? nameTransform(itemName) : itemName,
+ count: itemFiles.length,
+ }));
+ },
+ []
+ );
+
+ const addPatternToGroup = useCallback(
+ (
+ groupType: "tags" | "folders" | "extensions",
+ pattern: string,
+ patternConfig: PatternCategory
+ ) => {
+ const getMatchingFilesFromApp = (patterns: PatternCategory): GroupItem[] => {
+ return appAllFiles
+ .filter((file) => shouldIndexFile(file, patterns, null))
+ .map((file) => ({
+ id: file.path,
+ name: file.basename,
+ }));
+ };
+
+ const ignoreFiles = [...latestIgnoreItems.current.files];
+ const matchingFiles: GroupItem[] = getMatchingFilesFromApp(patternConfig).map((v) => ({
+ ...v,
+ // add flag if file is ignored
+ isIgnored: ignoreFiles.some((f) => f.path === v.id),
+ }));
+
+ setGroupList((prev) => ({
+ ...prev,
+ [groupType]: {
+ ...prev[groupType],
+ [pattern]: matchingFiles,
+ },
+ }));
+ },
+ [appAllFiles]
+ );
+
+ const removeFileFromGroupList = useCallback(
+ (groupList: GroupListItem, filePath: string): GroupListItem => {
+ const newGroupList: GroupListItem = {
+ tags: { ...groupList.tags },
+ folders: { ...groupList.folders },
+ extensions: { ...groupList.extensions },
+ notes: [...groupList.notes],
+ };
+
+ const removeFileFromGroupObject = (groupObject: Record>) => {
+ Object.keys(groupObject).forEach((key) => {
+ groupObject[key] = groupObject[key].filter((item) => item.id !== filePath);
+ });
+ };
+
+ removeFileFromGroupObject(newGroupList.tags);
+ removeFileFromGroupObject(newGroupList.folders);
+ removeFileFromGroupObject(newGroupList.extensions);
+
+ // Remove file from notes
+ newGroupList.notes = newGroupList.notes.filter((item) => item.id !== filePath);
+
+ return newGroupList;
+ },
+ []
+ );
+
+ const setActiveState = useCallback(
+ (section: ActiveSection, item: ActiveItem = null, clearSearch: boolean = true) => {
+ setActiveSection(section);
+ setActiveItem(item);
+ if (clearSearch) {
+ setSearchTerm("");
+ }
+ },
+ []
+ );
+
+ // Unified processor
+ const groupHandlers = useMemo(() => {
+ const createDeleteHandler = (groupType: keyof Omit) => {
+ return (e: React.MouseEvent, item: SectionItem) => {
+ e.stopPropagation();
+
+ setGroupList((prev) => {
+ const newGroup = { ...prev[groupType] };
+ delete newGroup[item.id];
+ return {
+ ...prev,
+ [groupType]: newGroup,
+ };
+ });
+ };
+ };
+
+ return {
+ delete: {
+ tag: createDeleteHandler("tags"),
+ folder: createDeleteHandler("folders"),
+ extension: createDeleteHandler("extensions"),
+ },
+
+ add: {
+ tag: () => {
+ new TagSearchModal(app, (tagName) => {
+ const tagPattern = getTagPattern(tagName);
+ addPatternToGroup("tags", tagPattern, { tagPatterns: [tagPattern] });
+ }).open();
+ },
+
+ folder: () => {
+ new FolderSearchModal(app, (folderPath) => {
+ addPatternToGroup("folders", folderPath, { folderPatterns: [folderPath] });
+ }).open();
+ },
+
+ file: () => {
+ new ProjectFileSelectModal({
+ app,
+ onFileSelect: (file: TFile) => {
+ const existingNote = groupList.notes.find((note) => note.id === file.path);
+ if (existingNote) return;
+
+ // remove file from ignore
+ setIgnoreItems((prev) => {
+ const newFiles = new Set(prev.files);
+ newFiles.delete(file);
+ return { ...prev, files: newFiles };
+ });
+
+ setGroupList((prev) => ({
+ ...prev,
+ notes: [...prev.notes, { id: file.path, name: file.basename }],
+ }));
+ },
+ excludeFilePaths: [],
+ titleOnly: false,
+ }).open();
+ },
+
+ extension: () => {
+ // todo(emt-lin)：maybe use this in the future
+ new Notice("Adding extension is temporarily not supported.");
+ return;
+ /*new ExtensionInputModal(app, (extension: string) => {
+ if (extension.trim() === "") return;
+ const extensionPattern = getExtensionPattern(extension);
+ addPatternToGroup("extensions", extensionPattern, {
+ extensionPatterns: [extensionPattern],
+ });
+ }).open();*/
+ },
+
+ ignoreFile: () => {
+ new ProjectFileSelectModal({
+ app,
+ onFileSelect: (file: TFile) => {
+ const isAlreadyIgnored = ignoreItems.files.has(file);
+ if (isAlreadyIgnored) return;
+
+ setIgnoreItems((prev) => {
+ const newFiles = new Set(prev.files);
+ newFiles.add(file);
+ return { ...prev, files: newFiles };
+ });
+
+ // Remove related files from the groupList
+ setGroupList((prev) => removeFileFromGroupList(prev, file.path));
+ },
+ excludeFilePaths: [],
+ titleOnly: false,
+ }).open();
+ },
+ },
+
+ click: {
+ tag: (tagId: string) => {
+ setActiveState("tags", tagId);
+ },
+
+ folder: (folderId: string) => {
+ setActiveState("folders", folderId);
+ },
+
+ extension: (extension: string) => {
+ setActiveState("extensions", extension);
+ },
+
+ files: () => {
+ setActiveState("files");
+ },
+
+ ignoreFiles: () => {
+ setActiveState("ignoreFiles");
+ },
+ },
+ };
+ }, [
+ app,
+ groupList.notes,
+ ignoreItems.files,
+ addPatternToGroup,
+ removeFileFromGroupList,
+ setActiveState,
+ ]);
+
+ const getDisplayTitle = () => {
+ if (searchTerm) return `Search Results for: "${searchTerm}"`;
+ if (activeSection === "tags" && activeItem) {
+ return `Tag: ${activeItem}`;
+ }
+ if (activeSection === "folders" && activeItem) {
+ return `Folder: ${activeItem}`;
+ }
+ if (activeSection === "files") return "Files";
+ if (activeSection === "extensions" && activeItem) {
+ return `Extension: ${activeItem}`;
+ }
+ if (activeSection === "ignoreFiles") return "Ignore Files";
+ return "Select a category to view items";
+ };
+
+ const handleDeleteItem = (e: React.MouseEvent, item: GroupItem) => {
+ e.stopPropagation();
+
+ const file = appAllFiles.find((file) => file.path === item.id);
+ if (file) {
+ // add file to ignore
+ setIgnoreItems((prev) => {
+ const newFiles = new Set(prev.files);
+ newFiles.add(file);
+ return { ...prev, files: newFiles };
+ });
+
+ setGroupList((prev) => removeFileFromGroupList(prev, item.id));
+ }
+ };
+
+ const refreshGroupListFromCurrentPatterns = useCallback(() => {
+ const currentInclude = convertGroupListToInclusions(latestGroupList.current, appAllFiles);
+ const currentExclude = convertDeletedItemsToExclusions(latestIgnoreItems.current);
+
+ const { inclusions, exclusions } = getMatchingPatterns({
+ inclusions: currentInclude,
+ exclusions: currentExclude,
+ isProject: true,
+ });
+
+ const newGroupList = createAndPopulateGroupList(appAllFiles, inclusions, exclusions);
+ setGroupList(newGroupList);
+ }, [
+ appAllFiles,
+ convertDeletedItemsToExclusions,
+ convertGroupListToInclusions,
+ createAndPopulateGroupList,
+ ]);
+
+ const handleDeleteIgnoreItem = (e: React.MouseEvent, item: GroupItem) => {
+ e.stopPropagation();
+
+ const file = appAllFiles.find((file) => file.path === item.id);
+
+ if (file) {
+ setIgnoreItems((prev) => {
+ const newFiles = new Set(prev.files);
+ newFiles.delete(file);
+ return { ...prev, files: newFiles };
+ });
+
+ // refresh groupList
+ refreshGroupListFromCurrentPatterns();
+ }
+ };
+
+ const handleSave = () => {
+ const include = convertGroupListToInclusions(groupList, appAllFiles);
+ const exclude = convertDeletedItemsToExclusions(ignoreItems);
+ onSave({
+ ...initialProject,
+ contextSource: {
+ ...initialProject.contextSource,
+ inclusions: include,
+ exclusions: exclude,
+ },
+ });
+ };
+
+ return (
+
+
+ {/* Left Sidebar - Navigation */}
+
+
+ {/* Header */}
+
+
Project Context
+
+
+
+
+ {/* Tags Section */}
+
name.slice(1))}
+ activeItem={activeItem}
+ activeSection={activeSection}
+ sectionType="tags"
+ renderIcon={(_item) => # }
+ onItemClick={groupHandlers.click.tag}
+ onAddClick={groupHandlers.add.tag}
+ onDeleteItem={(e, item) => groupHandlers.delete.tag(e, item)}
+ />
+
+ groupHandlers.delete.folder(e, item)}
+ />
+
+
+
+
+ Files ({groupList.notes.length})
+
+
+
+
+ Ignore Files ({ignoreItems.files.size})
+
+
+
+
+
+
+ {/* Header */}
+
+ {
+ setSearchTerm(v);
+ if (v) {
+ setActiveState("search", null, false);
+ }
+ }}
+ />
+
+
+ {/* Content Title */}
+
+
{getDisplayTitle()}
+
+
+ {/* Content Area */}
+
+ {getDisplayItems.length === 0 ? (
+
+ {activeSection
+ ? "No items found."
+ : "Select a category from the sidebar to view items."}
+
+ ) : (
+
+ {sortItems(getDisplayItems).map((item) => (
+
+ )}
+
+
+
+
+
+ Cancel
+
+ Save
+
+
= ({
+ value,
+ onChange,
+ placeholder = "Search...",
+}) => {
+ return (
+
+ onChange("")}
+ className="tw-absolute tw-right-8 tw-top-1/2 tw-size-4 -tw-translate-y-1/2 tw-transform tw-rounded-full tw-p-0 tw-transition-colors"
+ aria-label="Clear search"
+ >
+
+ )}
+
+ );
+};
diff --git a/src/components/ui/resizable.tsx b/src/components/ui/resizable.tsx
new file mode 100644
index 00000000..ba4e7543
--- /dev/null
+++ b/src/components/ui/resizable.tsx
@@ -0,0 +1,45 @@
+import * as React from "react";
+import { GripVertical } from "lucide-react";
+import * as ResizablePrimitive from "react-resizable-panels";
+
+import { cn } from "@/lib/utils";
+
+const ResizablePanelGroup = ({
+ className,
+ ...props
+}: React.ComponentProps) => (
+ & {
+ withHandle?: boolean;
+}) => (
+ // tw-bg-border -> --divider-color: var(--background-modifier-border);
+ div]:tw-rotate-90",
+ className
+ )}
+ {...props}
+ >
+ {withHandle && (
+
+
+ )}
+
+);
+
+export { ResizablePanelGroup, ResizablePanel, ResizableHandle };
diff --git a/src/components/ui/scroll-area.tsx b/src/components/ui/scroll-area.tsx
new file mode 100644
index 00000000..253a9f97
--- /dev/null
+++ b/src/components/ui/scroll-area.tsx
@@ -0,0 +1,48 @@
+import * as React from "react";
+import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
+
+import { cn } from "@/lib/utils";
+
+const ScrollArea = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, children, ...props }, ref) => (
+
+ {/*[&>div:first-child]:!tw-block：for override the first child div style's (display: table)*/}
+
+ {children}
+
+
+));
+ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
+
+const ScrollBar = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, orientation = "vertical", ...props }, ref) => (
+
+ {/* tw-bg-border -> --divider-color: var(--background-modifier-border); */}
+
+));
+ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
+
+export { ScrollArea, ScrollBar };
diff --git a/src/components/ui/separator.tsx b/src/components/ui/separator.tsx
new file mode 100644
index 00000000..14a4a35b
--- /dev/null
+++ b/src/components/ui/separator.tsx
@@ -0,0 +1,27 @@
+"use client";
+
+import * as React from "react";
+import * as SeparatorPrimitive from "@radix-ui/react-separator";
+
+import { cn } from "@/lib/utils";
+
+const Separator = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => (
+ // tw-bg-border -> --divider-color: var(--background-modifier-border);
+ >;
+ folders: Record>;
+ extensions: Record>;
+ notes: Array;
+}
+
+interface IgnoreItems {
+ files: Set;
+}
+
+// Test helper functions
+const createTestFile = (path: string): TFile => {
+ const file = new TFile();
+ file.path = path;
+ const parts = path.split("/");
+ const filename = parts[parts.length - 1];
+ file.basename = filename.replace(/\.[^/.]+$/, "");
+ file.extension = filename.split(".").pop() || "";
+ return file;
+};
+
+const createMockPatternCategory = (overrides: Partial = {}): PatternCategory => ({
+ tagPatterns: [],
+ folderPatterns: [],
+ extensionPatterns: [],
+ notePatterns: [],
+ ...overrides,
+});
+
+// Implementation of the functions to test
+const createAndPopulateGroupList = (
+ appFiles: TFile[],
+ inclusionPatterns: PatternCategory | null,
+ exclusionPatterns: PatternCategory | null
+): GroupListItem => {
+ const projectAllFiles = appFiles.filter((file) =>
+ shouldIndexFile(file, inclusionPatterns, exclusionPatterns)
+ );
+
+ // Initialize groups
+ const tags: Record> = {};
+ const folders: Record> = {};
+ const extensions: Record> = {};
+ const notes: Array = [];
+
+ (inclusionPatterns?.tagPatterns ?? []).forEach((tag) => {
+ tags[tag] = [];
+ });
+ (inclusionPatterns?.folderPatterns ?? []).forEach((folder) => {
+ folders[folder] = [];
+ });
+ (inclusionPatterns?.extensionPatterns ?? []).forEach((extension) => {
+ extensions[extension] = [];
+ });
+
+ // Populate with matching files
+ projectAllFiles.forEach((file) => {
+ const groupItem: GroupItem = {
+ id: file.path,
+ name: file.basename,
+ };
+
+ // Add to notes array
+ notes.push(groupItem);
+
+ // Add to appropriate groups based on patterns
+ (inclusionPatterns?.tagPatterns ?? []).forEach((tag) => {
+ if (tags[tag]) {
+ tags[tag].push(groupItem);
+ }
+ });
+
+ (inclusionPatterns?.folderPatterns ?? []).forEach((folder) => {
+ if (folders[folder] && file.path.includes(folder)) {
+ folders[folder].push(groupItem);
+ }
+ });
+
+ (inclusionPatterns?.extensionPatterns ?? []).forEach((extension) => {
+ if (extensions[extension] && file.extension === extension.replace("*.", "")) {
+ extensions[extension].push(groupItem);
+ }
+ });
+ });
+
+ return { tags, folders, extensions, notes };
+};
+
+const convertGroupListToInclusions = (list: GroupListItem, appFiles: TFile[]): string => {
+ const tagPatterns = Object.keys(list.tags);
+ const folderPatterns = Object.keys(list.folders);
+ const extensionPatterns = Object.keys(list.extensions);
+ const notePatterns = list.notes
+ .map((note) => {
+ const file = appFiles.find((file) => file.path === note.id);
+ if (file) {
+ return getFilePattern(file);
+ }
+ })
+ .filter(Boolean) as string[];
+
+ return createPatternSettingsValue({
+ tagPatterns,
+ folderPatterns,
+ extensionPatterns,
+ notePatterns,
+ });
+};
+
+const convertDeletedItemsToExclusions = (items: IgnoreItems): string => {
+ const notePatterns = Array.from(items.files).map((file) => getFilePattern(file));
+ return createPatternSettingsValue({ notePatterns }) || "";
+};
+
+describe("Context Manage Modal Functions", () => {
+ beforeEach(() => {
+ jest.clearAllMocks();
+
+ // Setup default mocks
+ (shouldIndexFile as jest.Mock).mockReturnValue(true);
+ (getFilePattern as jest.Mock).mockImplementation((file: TFile) => `[[${file.basename}]]`);
+ (createPatternSettingsValue as jest.Mock).mockImplementation(
+ ({ tagPatterns = [], folderPatterns = [], extensionPatterns = [], notePatterns = [] }) => {
+ const patterns = [...tagPatterns, ...folderPatterns, ...extensionPatterns, ...notePatterns];
+ return patterns.join(",");
+ }
+ );
+ });
+
+ describe("createAndPopulateGroupList", () => {
+ it("Should create empty GroupList when there are no files", () => {
+ const result = createAndPopulateGroupList([], null, null);
+
+ expect(result).toEqual({
+ tags: {},
+ folders: {},
+ extensions: {},
+ notes: [],
+ });
+ });
+
+ it("Should correctly filter files based on inclusion and exclusion patterns", () => {
+ const files = [
+ createTestFile("test1.md"),
+ createTestFile("test2.pdf"),
+ createTestFile("test3.txt"),
+ ];
+
+ (shouldIndexFile as jest.Mock)
+ .mockReturnValueOnce(true)
+ .mockReturnValueOnce(false)
+ .mockReturnValueOnce(true);
+
+ const inclusionPatterns = createMockPatternCategory();
+ const exclusionPatterns = createMockPatternCategory();
+
+ const result = createAndPopulateGroupList(files, inclusionPatterns, exclusionPatterns);
+
+ expect(shouldIndexFile).toHaveBeenCalledTimes(3);
+ expect(result.notes).toHaveLength(2);
+ expect(result.notes[0].id).toBe("test1.md");
+ expect(result.notes[1].id).toBe("test3.txt");
+ });
+
+ it("Should initialize groups based on inclusion patterns", () => {
+ const files = [createTestFile("test.md")];
+ const inclusionPatterns = createMockPatternCategory({
+ tagPatterns: ["#important", "#work"],
+ folderPatterns: ["docs", "projects"],
+ extensionPatterns: ["*.md", "*.pdf"],
+ });
+
+ const result = createAndPopulateGroupList(files, inclusionPatterns, null);
+
+ expect(Object.keys(result.tags)).toEqual(["#important", "#work"]);
+ expect(Object.keys(result.folders)).toEqual(["docs", "projects"]);
+ expect(Object.keys(result.extensions)).toEqual(["*.md", "*.pdf"]);
+ });
+
+ it("Should add files to appropriate groups", () => {
+ const files = [createTestFile("docs/test.md"), createTestFile("projects/work.pdf")];
+
+ const inclusionPatterns = createMockPatternCategory({
+ folderPatterns: ["docs", "projects"],
+ extensionPatterns: ["*.md", "*.pdf"],
+ });
+
+ const result = createAndPopulateGroupList(files, inclusionPatterns, null);
+
+ expect(result.folders["docs"]).toHaveLength(1);
+ expect(result.folders["docs"][0].name).toBe("test");
+ expect(result.folders["projects"]).toHaveLength(1);
+ expect(result.folders["projects"][0].name).toBe("work");
+ });
+
+ it("Should handle duplicate patterns", () => {
+ const files = [createTestFile("test.md")];
+ const inclusionPatterns = createMockPatternCategory({
+ tagPatterns: ["#tag", "#tag", "#tag"],
+ folderPatterns: ["folder", "folder"],
+ });
+
+ const result = createAndPopulateGroupList(files, inclusionPatterns, null);
+
+ expect(Object.keys(result.tags)).toEqual(["#tag"]);
+ expect(Object.keys(result.folders)).toEqual(["folder"]);
+ });
+ });
+
+ describe("convertGroupListToInclusions", () => {
+ it("Should convert empty GroupList to empty string", () => {
+ const emptyGroupList: GroupListItem = {
+ tags: {},
+ folders: {},
+ extensions: {},
+ notes: [],
+ };
+
+ const result = convertGroupListToInclusions(emptyGroupList, []);
+
+ expect(createPatternSettingsValue).toHaveBeenCalledWith({
+ tagPatterns: [],
+ folderPatterns: [],
+ extensionPatterns: [],
+ notePatterns: [],
+ });
+ expect(result).toBe("");
+ });
+
+ it("Should correctly extract all pattern types", () => {
+ const groupList: GroupListItem = {
+ tags: { "#important": [], "#work": [] },
+ folders: { docs: [], projects: [] },
+ extensions: { "*.md": [], "*.pdf": [] },
+ notes: [
+ { id: "note1.md", name: "note1" },
+ { id: "note2.md", name: "note2" },
+ ],
+ };
+
+ const appFiles = [createTestFile("note1.md"), createTestFile("note2.md")];
+
+ convertGroupListToInclusions(groupList, appFiles);
+
+ expect(createPatternSettingsValue).toHaveBeenCalledWith({
+ tagPatterns: ["#important", "#work"],
+ folderPatterns: ["docs", "projects"],
+ extensionPatterns: ["*.md", "*.pdf"],
+ notePatterns: ["[[note1]]", "[[note2]]"],
+ });
+ });
+
+ it("Should handle notes without corresponding files", () => {
+ const groupList: GroupListItem = {
+ tags: {},
+ folders: {},
+ extensions: {},
+ notes: [
+ { id: "missing.md", name: "missing" },
+ { id: "existing.md", name: "existing" },
+ ],
+ };
+
+ const appFiles = [createTestFile("existing.md")];
+
+ convertGroupListToInclusions(groupList, appFiles);
+
+ expect(createPatternSettingsValue).toHaveBeenCalledWith({
+ tagPatterns: [],
+ folderPatterns: [],
+ extensionPatterns: [],
+ notePatterns: ["[[existing]]"],
+ });
+ });
+ });
+
+ describe("convertDeletedItemsToExclusions", () => {
+ it("Should convert empty IgnoreItems to empty string", () => {
+ const emptyIgnoreItems: IgnoreItems = {
+ files: new Set(),
+ };
+
+ const result = convertDeletedItemsToExclusions(emptyIgnoreItems);
+
+ expect(createPatternSettingsValue).toHaveBeenCalledWith({
+ notePatterns: [],
+ });
+ expect(result).toBe("");
+ });
+
+ it("Should correctly convert ignored files to exclusion patterns", () => {
+ const file1 = createTestFile("ignore1.md");
+ const file2 = createTestFile("ignore2.pdf");
+
+ const ignoreItems: IgnoreItems = {
+ files: new Set([file1, file2]),
+ };
+
+ convertDeletedItemsToExclusions(ignoreItems);
+
+ expect(getFilePattern).toHaveBeenCalledWith(file1);
+ expect(getFilePattern).toHaveBeenCalledWith(file2);
+ expect(createPatternSettingsValue).toHaveBeenCalledWith({
+ notePatterns: ["[[ignore1]]", "[[ignore2]]"],
+ });
+ });
+
+ it("Should handle a single ignored file", () => {
+ const file = createTestFile("single.md");
+ const ignoreItems: IgnoreItems = {
+ files: new Set([file]),
+ };
+
+ convertDeletedItemsToExclusions(ignoreItems);
+
+ expect(getFilePattern).toHaveBeenCalledWith(file);
+ expect(createPatternSettingsValue).toHaveBeenCalledWith({
+ notePatterns: ["[[single]]"],
+ });
+ });
+
+ it("Should handle case when createPatternSettingsValue returns undefined", () => {
+ (createPatternSettingsValue as jest.Mock).mockReturnValueOnce(undefined);
+
+ const file = createTestFile("test.md");
+ const ignoreItems: IgnoreItems = {
+ files: new Set([file]),
+ };
+
+ const result = convertDeletedItemsToExclusions(ignoreItems);
+
+ expect(result).toBe("");
+ });
+ });
+
+ // Boundary conditions and error handling tests
+ describe("Boundary Condition Tests", () => {
+ describe("createAndPopulateGroupList", () => {
+ it("Should handle null inclusion patterns", () => {
+ const files = [createTestFile("test.md")];
+ const result = createAndPopulateGroupList(files, null, null);
+
+ expect(result.tags).toEqual({});
+ expect(result.folders).toEqual({});
+ expect(result.extensions).toEqual({});
+ expect(result.notes).toHaveLength(1);
+ });
+
+ it("Should handle file paths with special characters", () => {
+ const files = [
+ createTestFile("folder with spaces/file-with-dashes.md"),
+ createTestFile("中文文件夹/中文文件.md"),
+ createTestFile("folder/file@#$%.md"),
+ ];
+
+ const result = createAndPopulateGroupList(files, null, null);
+
+ expect(result.notes).toHaveLength(3);
+ expect(result.notes[0].name).toBe("file-with-dashes");
+ expect(result.notes[1].name).toBe("中文文件");
+ expect(result.notes[2].name).toBe("file@#$%");
+ });
+ });
+
+ describe("convertGroupListToInclusions", () => {
+ it("Should handle large number of patterns", () => {
+ const tags: Record> = {};
+ const folders: Record> = {};
+ const extensions: Record> = {};
+
+ // Create many patterns
+ for (let i = 0; i < 100; i++) {
+ tags[`#tag${i}`] = [];
+ folders[`folder${i}`] = [];
+ extensions[`*.ext${i}`] = [];
+ }
+
+ const groupList: GroupListItem = { tags, folders, extensions, notes: [] };
+ convertGroupListToInclusions(groupList, []);
+
+ expect(createPatternSettingsValue).toHaveBeenCalledWith({
+ tagPatterns: expect.arrayContaining([`#tag0`, `#tag99`]),
+ folderPatterns: expect.arrayContaining([`folder0`, `folder99`]),
+ extensionPatterns: expect.arrayContaining([`*.ext0`, `*.ext99`]),
+ notePatterns: [],
+ });
+ });
+
+ it("Should handle invalid file paths in notes", () => {
+ const groupList: GroupListItem = {
+ tags: {},
+ folders: {},
+ extensions: {},
+ notes: [
+ { id: "", name: "" },
+ { id: " ", name: " " },
+ { id: "valid.md", name: "valid" },
+ ],
+ };
+
+ const appFiles = [createTestFile("valid.md")];
+ convertGroupListToInclusions(groupList, appFiles);
+
+ expect(createPatternSettingsValue).toHaveBeenCalledWith({
+ tagPatterns: [],
+ folderPatterns: [],
+ extensionPatterns: [],
+ notePatterns: ["[[valid]]"],
+ });
+ });
+ });
+
+ describe("convertDeletedItemsToExclusions", () => {
+ it("Should handle large number of ignored files", () => {
+ const files = new Set();
+ for (let i = 0; i < 1000; i++) {
+ files.add(createTestFile(`file${i}.md`));
+ }
+
+ const ignoreItems: IgnoreItems = { files };
+ convertDeletedItemsToExclusions(ignoreItems);
+
+ expect(getFilePattern).toHaveBeenCalledTimes(1000);
+ expect(createPatternSettingsValue).toHaveBeenCalledWith({
+ notePatterns: expect.arrayContaining(["[[file0]]", "[[file999]]"]),
+ });
+ });
+
+ it("Should handle filenames with special characters", () => {
+ const files = [
+ createTestFile("file with spaces.md"),
+ createTestFile("file-with-dashes.md"),
+ createTestFile("file_with_underscores.md"),
+ createTestFile("file@#$%.md"),
+ ];
+
+ const ignoreItems: IgnoreItems = { files: new Set(files) };
+ convertDeletedItemsToExclusions(ignoreItems);
+
+ expect(getFilePattern).toHaveBeenCalledTimes(4);
+ files.forEach((file) => {
+ expect(getFilePattern).toHaveBeenCalledWith(file);
+ });
+ });
+ });
+ });
+
+ // Integration tests
+ describe("Integration Tests", () => {
+ it("Should correctly handle the complete workflow", () => {
+ // 1. Create initial file list
+ const appFiles = [
+ createTestFile("docs/readme.md"),
+ createTestFile("src/main.ts"),
+ createTestFile("tests/test.spec.ts"),
+ createTestFile("config.json"),
+ ];
+
+ // 2. Set inclusion patterns
+ const inclusionPatterns = createMockPatternCategory({
+ folderPatterns: ["docs", "src"],
+ extensionPatterns: ["*.md", "*.ts"],
+ });
+
+ // 3. Create GroupList
+ const groupList = createAndPopulateGroupList(appFiles, inclusionPatterns, null);
+
+ // 4. Convert to inclusions
+ const inclusions = convertGroupListToInclusions(groupList, appFiles);
+
+ // 5. Create ignore items and convert to exclusions
+ const ignoreItems: IgnoreItems = {
+ files: new Set([createTestFile("config.json")]),
+ };
+ const exclusions = convertDeletedItemsToExclusions(ignoreItems);
+
+ // Verify results
+ expect(groupList.folders).toHaveProperty("docs");
+ expect(groupList.folders).toHaveProperty("src");
+ expect(Object.prototype.hasOwnProperty.call(groupList.extensions, "*.md")).toBe(true);
+ expect(Object.prototype.hasOwnProperty.call(groupList.extensions, "*.ts")).toBe(true);
+
+ expect(createPatternSettingsValue).toHaveBeenCalledWith({
+ tagPatterns: [],
+ folderPatterns: ["docs", "src"],
+ extensionPatterns: ["*.md", "*.ts"],
+ notePatterns: expect.any(Array),
+ });
+
+ expect(createPatternSettingsValue).toHaveBeenCalledWith({
+ notePatterns: ["[[config]]"],
+ });
+
+ // Verify inclusions and exclusions variables
+ // Since createPatternSettingsValue is mocked to return all patterns as comma-separated list
+ expect(inclusions).toContain("docs");
+ expect(inclusions).toContain("src");
+ expect(inclusions).toContain("*.md");
+ expect(inclusions).toContain("*.ts");
+
+ expect(exclusions).toBe("[[config]]");
+ });
+ });
+});
diff --git a/tailwind.config.js b/tailwind.config.js
index 8d8b7edd..e58ec7e7 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -40,6 +40,14 @@ module.exports = {
green: "var(--color-green)",
blue: "var(--color-blue)",
},
+ "context-manager": {
+ blue: "var(--color-blue)",
+ green: "var(--color-green)",
+ red: "var(--color-red)",
+ yellow: "var(--color-yellow)",
+ orange: "var(--color-orange)",
+ purple: "var(--color-purple)",
+ },
},
backgroundColor: {
inherit: colors.inherit,