diff --git a/frontend/src/examples/ExampleToolUsage.tsx b/frontend/src/examples/ExampleToolUsage.tsx deleted file mode 100644 index 7bc6f59ec..000000000 --- a/frontend/src/examples/ExampleToolUsage.tsx +++ /dev/null @@ -1,90 +0,0 @@ -/** - * Example of how tools use the new URL parameter system - * This shows how compress, split, merge tools would integrate - */ - -import React from 'react'; -import { useToolParameters, useToolParameter } from '../hooks/useToolParameters'; - -// Example: Compress Tool -export function CompressTool() { - const [params, updateParams] = useToolParameters('compress', { - quality: { type: 'string', default: 'medium' }, - method: { type: 'string', default: 'lossless' }, - optimization: { type: 'boolean', default: true } - }); - - return ( -
-

Compress Tool

-

Quality: {params.quality}

-

Method: {params.method}

-

Optimization: {params.optimization ? 'On' : 'Off'}

- - - -
- ); -} - -// Example: Split Tool with single parameter hook -export function SplitTool() { - const [pages, setPages] = useToolParameter('split', 'pages', { - type: 'string', - default: '1-5' - }); - - const [strategy, setStrategy] = useToolParameter('split', 'strategy', { - type: 'string', - default: 'range' - }); - - return ( -
-

Split Tool

-

Pages: {pages}

-

Strategy: {strategy}

- - setPages(e.target.value)} - placeholder="Enter page range" - /> - - -
- ); -} - -// Example: How URLs would look -/* -User interactions -> URL changes: - -1. Navigate to compress tool: - ?mode=compress - -2. Change compress quality to high: - ?mode=compress&quality=high - -3. Change method to lossy and enable optimization: - ?mode=compress&quality=high&method=lossy&optimization=true - -4. Switch to split tool: - ?mode=split - -5. Set split pages and strategy: - ?mode=split&pages=1-10&strategy=bookmarks - -6. Switch to pageEditor: - ?mode=pageEditor (or no params for default) - -All URLs are shareable and will restore exact tool state! -*/ \ No newline at end of file