Spaces:
Sleeping
Sleeping
Download frontend/src/api/hooks.ts from Sid-WC121/visual-notebook: direct link, hf CLI and curl.
- Browser
- Download file 5.48 kB
-
https://huggingface.co/spaces/Sid-WC121/visual-notebook/resolve/main/frontend/src/api/hooks.ts
- Command line
-
hf download hf://spaces/Sid-WC121/visual-notebook/frontend/src/api/hooks.ts
-
curl -L -o hooks.ts https://huggingface.co/spaces/Sid-WC121/visual-notebook/resolve/main/frontend/src/api/hooks.ts
5.48 kB
| import { useState, useCallback } from 'react'; | |
| import { | |
| uploadCSV, | |
| getSchema, | |
| getRows, | |
| listOperations, | |
| applyOperation, | |
| undo as apiUndo, | |
| redo as apiRedo, | |
| getHistory, | |
| createChart, | |
| exportCSV, | |
| editCell, | |
| exportNotebook, | |
| createCheckpoint, | |
| } from './client'; | |
| import type { | |
| UploadResponse, | |
| SchemaResponse, | |
| RowsResponse, | |
| OperationInfo, | |
| ApplyOpResponse, | |
| HistoryResponse, | |
| UndoRedoResponse, | |
| ChartResponse, | |
| } from './types'; | |
| export function useUpload() { | |
| const [loading, setLoading] = useState(false); | |
| const [error, setError] = useState<string | null>(null); | |
| const upload = useCallback(async (file: File): Promise<UploadResponse | null> => { | |
| setLoading(true); | |
| setError(null); | |
| try { | |
| const data = await uploadCSV(file); | |
| return data; | |
| } catch (err: any) { | |
| setError(err.message); | |
| return null; | |
| } finally { | |
| setLoading(false); | |
| } | |
| }, []); | |
| return { upload, loading, error }; | |
| } | |
| export function useSchema() { | |
| const [loading, setLoading] = useState(false); | |
| const [error, setError] = useState<string | null>(null); | |
| const fetch = useCallback(async (): Promise<SchemaResponse | null> => { | |
| setLoading(true); | |
| setError(null); | |
| try { | |
| const data = await getSchema(); | |
| return data; | |
| } catch (err: any) { | |
| setError(err.message); | |
| return null; | |
| } finally { | |
| setLoading(false); | |
| } | |
| }, []); | |
| return { fetch, loading, error }; | |
| } | |
| export function useRows() { | |
| const [loading, setLoading] = useState(false); | |
| const [error, setError] = useState<string | null>(null); | |
| const fetch = useCallback(async (offset = 0, limit = 50): Promise<RowsResponse | null> => { | |
| setLoading(true); | |
| setError(null); | |
| try { | |
| const data = await getRows(offset, limit); | |
| return data; | |
| } catch (err: any) { | |
| setError(err.message); | |
| return null; | |
| } finally { | |
| setLoading(false); | |
| } | |
| }, []); | |
| return { fetch, loading, error }; | |
| } | |
| export function useApplyOp() { | |
| const [loading, setLoading] = useState(false); | |
| const [error, setError] = useState<string | null>(null); | |
| const apply = useCallback(async (opKey: string, params: Record<string, any>): Promise<ApplyOpResponse | null> => { | |
| setLoading(true); | |
| setError(null); | |
| try { | |
| const data = await applyOperation(opKey, params); | |
| return data; | |
| } catch (err: any) { | |
| setError(err.message); | |
| return null; | |
| } finally { | |
| setLoading(false); | |
| } | |
| }, []); | |
| return { apply, loading, error }; | |
| } | |
| export function useHistory() { | |
| const [loading, setLoading] = useState(false); | |
| const fetch = useCallback(async (): Promise<HistoryResponse | null> => { | |
| setLoading(true); | |
| try { | |
| return await getHistory(); | |
| } catch { | |
| return null; | |
| } finally { | |
| setLoading(false); | |
| } | |
| }, []); | |
| const undoAction = useCallback(async (): Promise<UndoRedoResponse | null> => { | |
| try { | |
| return await apiUndo(); | |
| } catch { | |
| return null; | |
| } | |
| }, []); | |
| const redoAction = useCallback(async (): Promise<UndoRedoResponse | null> => { | |
| try { | |
| return await apiRedo(); | |
| } catch { | |
| return null; | |
| } | |
| }, []); | |
| return { fetch, undoAction, redoAction, loading }; | |
| } | |
| export function useChart() { | |
| const [loading, setLoading] = useState(false); | |
| const [error, setError] = useState<string | null>(null); | |
| const create = useCallback(async (chartType: string, params: Record<string, any>): Promise<ChartResponse | null> => { | |
| setLoading(true); | |
| setError(null); | |
| try { | |
| const data = await createChart({ chart_type: chartType, params }); | |
| return data; | |
| } catch (err: any) { | |
| setError(err.message); | |
| return null; | |
| } finally { | |
| setLoading(false); | |
| } | |
| }, []); | |
| return { create, loading, error }; | |
| } | |
| export function useExport() { | |
| const [loading, setLoading] = useState(false); | |
| const download = useCallback(async () => { | |
| setLoading(true); | |
| try { | |
| const blob = await exportCSV(); | |
| const url = window.URL.createObjectURL(blob); | |
| const a = document.createElement('a'); | |
| a.href = url; | |
| a.download = 'export.csv'; | |
| a.click(); | |
| window.URL.revokeObjectURL(url); | |
| } catch { | |
| // ignore | |
| } finally { | |
| setLoading(false); | |
| } | |
| }, []); | |
| return { download, loading }; | |
| } | |
| export function useEditCell() { | |
| const [loading, setLoading] = useState(false); | |
| const [error, setError] = useState<string | null>(null); | |
| const edit = useCallback(async (rowIndex: number, column: string, newValue: string) => { | |
| setLoading(true); | |
| setError(null); | |
| try { | |
| return await editCell(rowIndex, column, newValue); | |
| } catch (err: any) { | |
| setError(err.message); | |
| return null; | |
| } finally { | |
| setLoading(false); | |
| } | |
| }, []); | |
| return { edit, loading, error }; | |
| } | |
| export function useExportNotebook() { | |
| const [loading, setLoading] = useState(false); | |
| const download = useCallback(async () => { | |
| setLoading(true); | |
| try { | |
| const data = await exportNotebook(); | |
| const blob = new Blob([JSON.stringify(data, null, 2)], { type: 'application/json' }); | |
| const url = window.URL.createObjectURL(blob); | |
| const a = document.createElement('a'); | |
| a.href = url; | |
| a.download = 'notebook.ipynb'; | |
| a.click(); | |
| window.URL.revokeObjectURL(url); | |
| } catch { | |
| // ignore | |
| } finally { | |
| setLoading(false); | |
| } | |
| }, []); | |
| return { download, loading }; | |
| } | |