Add folder update to store and use it for rename
This commit is contained in:
parent
5e6764b026
commit
502d78f244
2 changed files with 63 additions and 35 deletions
|
|
@ -16,7 +16,7 @@ export const FolderContextMenu: React.FC<FolderContextMenuProps> = ({
|
||||||
folder,
|
folder,
|
||||||
onClose,
|
onClose,
|
||||||
}) => {
|
}) => {
|
||||||
const { loadFolderTree } = useNoteStore();
|
const { loadFolderTree, updateFolder } = useNoteStore();
|
||||||
const [isRenaming, setIsRenaming] = useState(false);
|
const [isRenaming, setIsRenaming] = useState(false);
|
||||||
const [newName, setNewName] = useState(folder.name);
|
const [newName, setNewName] = useState(folder.name);
|
||||||
|
|
||||||
|
|
@ -35,12 +35,7 @@ export const FolderContextMenu: React.FC<FolderContextMenuProps> = ({
|
||||||
|
|
||||||
const handleRename = async () => {
|
const handleRename = async () => {
|
||||||
if (newName.trim() && newName !== folder.name) {
|
if (newName.trim() && newName !== folder.name) {
|
||||||
try {
|
await updateFolder(folder.id, { name: newName });
|
||||||
await folderApi.update(folder.id, { name: newName.trim() });
|
|
||||||
await loadFolderTree();
|
|
||||||
} catch (error) {
|
|
||||||
console.error("Failed to rename folder:", error);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
setIsRenaming(false);
|
setIsRenaming(false);
|
||||||
onClose();
|
onClose();
|
||||||
|
|
|
||||||
|
|
@ -5,11 +5,11 @@ import {
|
||||||
FolderCreate,
|
FolderCreate,
|
||||||
FolderTreeNode,
|
FolderTreeNode,
|
||||||
FolderTreeResponse,
|
FolderTreeResponse,
|
||||||
|
FolderUpdate,
|
||||||
NoteRead,
|
NoteRead,
|
||||||
} from "../api/folders";
|
} from "../api/folders";
|
||||||
import { Note, NoteCreate, notesApi } from "../api/notes";
|
import { Note, NoteCreate, notesApi } from "../api/notes";
|
||||||
|
|
||||||
// Helper function to update a note within the folder tree
|
|
||||||
const updateNoteInTree = (
|
const updateNoteInTree = (
|
||||||
tree: FolderTreeResponse | null,
|
tree: FolderTreeResponse | null,
|
||||||
updatedNote: NoteRead,
|
updatedNote: NoteRead,
|
||||||
|
|
@ -32,19 +32,41 @@ const updateNoteInTree = (
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
interface NoteState {
|
const updateFolder = (
|
||||||
folderTree: FolderTreeResponse | null;
|
id: number,
|
||||||
selectedFolder: number | null;
|
folder: FolderTreeNode,
|
||||||
selectedNote: NoteRead | null;
|
newFolder: FolderUpdate,
|
||||||
|
) => {
|
||||||
|
if (folder.id === id) {
|
||||||
|
return { ...folder, ...newFolder };
|
||||||
|
}
|
||||||
|
if (folder.children) {
|
||||||
|
return {
|
||||||
|
...folder,
|
||||||
|
children: folder.children.map((f) => updateFolder(id, f, newFolder)),
|
||||||
|
};
|
||||||
|
}
|
||||||
|
return folder;
|
||||||
|
};
|
||||||
|
|
||||||
|
interface NoteState {
|
||||||
|
loadFolderTree: () => Promise<void>;
|
||||||
|
folderTree: FolderTreeResponse | null;
|
||||||
|
|
||||||
|
selectedFolder: number | null;
|
||||||
|
setSelectedFolder: (id: number | null) => void;
|
||||||
|
|
||||||
|
selectedNote: NoteRead | null;
|
||||||
|
setSelectedNote: (id: NoteRead | null) => void;
|
||||||
setContent: (content: string) => void;
|
setContent: (content: string) => void;
|
||||||
setTitle: (title: string) => void;
|
setTitle: (title: string) => void;
|
||||||
loadFolderTree: () => Promise<void>;
|
|
||||||
createNote: (note: NoteCreate) => Promise<void>;
|
createNote: (note: NoteCreate) => Promise<void>;
|
||||||
updateNote: (id: number) => Promise<void>;
|
updateNote: (id: number) => Promise<void>;
|
||||||
|
|
||||||
createFolder: (folder: FolderCreate) => Promise<void>;
|
createFolder: (folder: FolderCreate) => Promise<void>;
|
||||||
setSelectedFolder: (id: number | null) => void;
|
updateFolder: (id: number, newFolder: FolderUpdate) => Promise<void>;
|
||||||
setSelectedNote: (id: NoteRead | null) => void;
|
|
||||||
moveNoteToFolder: (noteId: number, folderId: number) => Promise<void>;
|
moveNoteToFolder: (noteId: number, folderId: number) => Promise<void>;
|
||||||
moveFolderToFolder: (folderId: number, newParentId: number) => Promise<void>;
|
moveFolderToFolder: (folderId: number, newParentId: number) => Promise<void>;
|
||||||
}
|
}
|
||||||
|
|
@ -52,10 +74,24 @@ interface NoteState {
|
||||||
export const useNoteStore = create<NoteState>()(
|
export const useNoteStore = create<NoteState>()(
|
||||||
persist(
|
persist(
|
||||||
(set, get) => ({
|
(set, get) => ({
|
||||||
|
loadFolderTree: async () => {
|
||||||
|
const data = await folderApi.tree();
|
||||||
|
console.log("getting tree");
|
||||||
|
set({ folderTree: data });
|
||||||
|
},
|
||||||
folderTree: null,
|
folderTree: null,
|
||||||
|
|
||||||
selectedFolder: null,
|
selectedFolder: null,
|
||||||
|
|
||||||
|
setSelectedFolder: (id: number | null) => {
|
||||||
|
set({ selectedFolder: id });
|
||||||
|
},
|
||||||
|
|
||||||
selectedNote: null,
|
selectedNote: null,
|
||||||
|
|
||||||
|
setSelectedNote: (id: NoteRead | null) => {
|
||||||
|
set({ selectedNote: id });
|
||||||
|
},
|
||||||
setContent: (content) => {
|
setContent: (content) => {
|
||||||
const currentNote = get().selectedNote;
|
const currentNote = get().selectedNote;
|
||||||
if (currentNote) {
|
if (currentNote) {
|
||||||
|
|
@ -66,7 +102,6 @@ export const useNoteStore = create<NoteState>()(
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
setTitle: (title) => {
|
setTitle: (title) => {
|
||||||
const currentNote = get().selectedNote;
|
const currentNote = get().selectedNote;
|
||||||
if (currentNote) {
|
if (currentNote) {
|
||||||
|
|
@ -78,12 +113,6 @@ export const useNoteStore = create<NoteState>()(
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
loadFolderTree: async () => {
|
|
||||||
const data = await folderApi.tree();
|
|
||||||
console.log("getting tree");
|
|
||||||
set({ folderTree: data });
|
|
||||||
},
|
|
||||||
|
|
||||||
createNote: async (note: Partial<NoteRead>) => {
|
createNote: async (note: Partial<NoteRead>) => {
|
||||||
const response = await notesApi.create(note as NoteCreate);
|
const response = await notesApi.create(note as NoteCreate);
|
||||||
const newNote = response.data as NoteRead;
|
const newNote = response.data as NoteRead;
|
||||||
|
|
@ -129,6 +158,11 @@ export const useNoteStore = create<NoteState>()(
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
updateNote: async (id: number) => {
|
||||||
|
const note = get().selectedNote as Partial<Note>;
|
||||||
|
await notesApi.update(id, note);
|
||||||
|
},
|
||||||
|
|
||||||
createFolder: async (folder: FolderCreate) => {
|
createFolder: async (folder: FolderCreate) => {
|
||||||
const response = await folderApi.create(folder);
|
const response = await folderApi.create(folder);
|
||||||
const newFolder = response.data;
|
const newFolder = response.data;
|
||||||
|
|
@ -173,19 +207,21 @@ export const useNoteStore = create<NoteState>()(
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
updateFolder: async (id: number, newFolder: FolderUpdate) => {
|
||||||
|
const tree = get().folderTree as FolderTreeResponse;
|
||||||
|
|
||||||
updateNote: async (id: number) => {
|
const newFolders = tree.folders.map((folder) =>
|
||||||
const note = get().selectedNote as Partial<Note>;
|
updateFolder(id, folder, newFolder),
|
||||||
await notesApi.update(id, note);
|
);
|
||||||
// await get().loadFolderTree();
|
|
||||||
|
set({
|
||||||
|
folderTree: {
|
||||||
|
folders: newFolders,
|
||||||
|
orphaned_notes: tree.orphaned_notes,
|
||||||
},
|
},
|
||||||
|
});
|
||||||
|
|
||||||
setSelectedFolder: (id: number | null) => {
|
await folderApi.update(id, newFolder);
|
||||||
set({ selectedFolder: id });
|
|
||||||
},
|
|
||||||
|
|
||||||
setSelectedNote: (id: NoteRead | null) => {
|
|
||||||
set({ selectedNote: id });
|
|
||||||
},
|
},
|
||||||
|
|
||||||
moveNoteToFolder: async (noteId: number, folderId: number) => {
|
moveNoteToFolder: async (noteId: number, folderId: number) => {
|
||||||
|
|
@ -257,7 +293,6 @@ export const useNoteStore = create<NoteState>()(
|
||||||
|
|
||||||
let folderToMove: FolderTreeNode | null = null;
|
let folderToMove: FolderTreeNode | null = null;
|
||||||
|
|
||||||
// Find and remove folder from current location
|
|
||||||
const findAndRemoveFolder = (
|
const findAndRemoveFolder = (
|
||||||
folders: FolderTreeNode[],
|
folders: FolderTreeNode[],
|
||||||
): FolderTreeNode[] => {
|
): FolderTreeNode[] => {
|
||||||
|
|
@ -275,7 +310,6 @@ export const useNoteStore = create<NoteState>()(
|
||||||
}));
|
}));
|
||||||
};
|
};
|
||||||
|
|
||||||
// Add folder to new parent
|
|
||||||
const addFolderToParent = (
|
const addFolderToParent = (
|
||||||
folders: FolderTreeNode[],
|
folders: FolderTreeNode[],
|
||||||
): FolderTreeNode[] => {
|
): FolderTreeNode[] => {
|
||||||
|
|
@ -303,7 +337,6 @@ export const useNoteStore = create<NoteState>()(
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
// Update backend
|
|
||||||
await folderApi.update(folderId, { parent_id: newParentId });
|
await folderApi.update(folderId, { parent_id: newParentId });
|
||||||
},
|
},
|
||||||
}),
|
}),
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue