Add edit table of contents tool to React UI (#4917)

## Summary
- add a dedicated edit table of contents tool to the React UI, complete
with bookmark editor, import/export actions, and parameter handling
- register the tool in the translated registry and extend the English
translations with the new strings
- wire up the backend endpoints through a new operation hook and
form-data serialization helpers

## Testing
- ./gradlew build

------
[Codex
Task](https://chatgpt.com/codex/tasks/task_b_691a4a87a9c4832899ecd1c55989f27f)

---------

Co-authored-by: Reece Browne <[email protected]>
This commit is contained in:
Anthony Stirling
2025-11-18 15:07:12 +00:00
committed by GitHub
co-authored by Reece Browne
parent a8ea0b60cf
commit 87bf7a5b7f
12 changed files with 1413 additions and 20 deletions
@@ -0,0 +1,31 @@
import { useTranslation } from 'react-i18next';
import { ToolType, type ToolOperationConfig, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
import { EditTableOfContentsParameters } from '@app/hooks/tools/editTableOfContents/useEditTableOfContentsParameters';
import { serializeBookmarkNodes } from '@app/utils/editTableOfContents';
const buildFormData = (parameters: EditTableOfContentsParameters, file: File): FormData => {
const formData = new FormData();
formData.append('fileInput', file);
formData.append('replaceExisting', String(parameters.replaceExisting));
formData.append('bookmarkData', JSON.stringify(serializeBookmarkNodes(parameters.bookmarks)));
return formData;
};
export const editTableOfContentsOperationConfig: ToolOperationConfig<EditTableOfContentsParameters> = {
toolType: ToolType.singleFile,
operationType: 'editTableOfContents',
endpoint: '/api/v1/general/edit-table-of-contents',
buildFormData,
};
export const useEditTableOfContentsOperation = () => {
const { t } = useTranslation();
return useToolOperation<EditTableOfContentsParameters>({
...editTableOfContentsOperationConfig,
getErrorMessage: createStandardErrorHandler(
t('editTableOfContents.error.failed', 'Failed to update the table of contents')
),
});
};
@@ -0,0 +1,37 @@
import { useCallback } from 'react';
import { useBaseParameters, type BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
import { BookmarkNode } from '@app/utils/editTableOfContents';
export interface EditTableOfContentsParameters {
replaceExisting: boolean;
bookmarks: BookmarkNode[];
}
export interface EditTableOfContentsParametersHook extends BaseParametersHook<EditTableOfContentsParameters> {
setBookmarks: (bookmarks: BookmarkNode[]) => void;
}
const defaultParameters: EditTableOfContentsParameters = {
replaceExisting: true,
bookmarks: [],
};
export const useEditTableOfContentsParameters = (): EditTableOfContentsParametersHook => {
const base = useBaseParameters<EditTableOfContentsParameters>({
defaultParameters,
endpointName: 'edit-table-of-contents',
});
const setBookmarks = useCallback((bookmarks: BookmarkNode[]) => {
base.setParameters(prev => ({
...prev,
bookmarks,
}));
}, [base.setParameters]);
return {
...base,
setBookmarks,
};
};