diff --git a/webui/src/lib/components/repository/ObjectsDiff.jsx b/webui/src/lib/components/repository/ObjectsDiff.jsx index 2a29ac85016..b83f2536be5 100644 --- a/webui/src/lib/components/repository/ObjectsDiff.jsx +++ b/webui/src/lib/components/repository/ObjectsDiff.jsx @@ -10,31 +10,9 @@ import {useStorageConfigs} from "../../hooks/storageConfig"; import {AppContext} from "../../hooks/appContext"; import {useRefs} from "../../hooks/repo"; import {getRepoStorageConfig} from "../../../pages/repositories/repository/utils"; -import {GeoJSONPreview} from "./GeoJSONPreview"; const maxDiffSizeBytes = 120 << 10; -const DiffViewerType = { - GEOJSON: 'geojson', - REACT: 'react', -}; -const diffViewersByExtension = { - geojson: DiffViewerType.GEOJSON, - txt: DiffViewerType.REACT, - text: DiffViewerType.REACT, - md: DiffViewerType.REACT, - csv: DiffViewerType.REACT, - tsv: DiffViewerType.REACT, - yaml: DiffViewerType.REACT, - yml: DiffViewerType.REACT, - json: DiffViewerType.REACT, - jsonl: DiffViewerType.REACT, - ndjson: DiffViewerType.REACT, -}; - -const getViewer = (path) => { - const ext = path.split(".").pop().toLowerCase(); - return diffViewersByExtension[ext] || null; -}; +const supportedReadableFormats = ["txt", "text", "md", "csv", "tsv", "yaml", "yml", "json", "jsonl", "ndjson", "geojson"]; export const ObjectsDiff = ({diffType, repoId, leftRef, rightRef, path}) => { const {repo, error: refsError, loading: refsLoading} = useRefs(); @@ -45,7 +23,7 @@ export const ObjectsDiff = ({diffType, repoId, leftRef, rightRef, path}) => { if (hooksError) return ; - const viewer = getViewer(path); + const readable = readableObject(path); let left; let right; switch (diffType) { @@ -74,7 +52,7 @@ export const ObjectsDiff = ({diffType, repoId, leftRef, rightRef, path}) => { const leftStat = left && left.response; const rightStat = right && right.response; - if (!viewer) { + if (!readable) { return ; } const objectTooBig = (leftStat && leftStat.size_bytes > maxDiffSizeBytes) || (rightStat && rightStat.size_bytes > maxDiffSizeBytes); @@ -88,8 +66,17 @@ export const ObjectsDiff = ({diffType, repoId, leftRef, rightRef, path}) => { leftSize={leftSize} rightSize={rightSize} diffType={diffType}/>; } +function readableObject(path) { + for (const ext of supportedReadableFormats) { + if (path.endsWith("." + ext)) { + return true; + } + } + return false; +} + const NoContentDiff = ({left, right, diffType}) => { - const supportedFileExtensions = Object.keys(diffViewersByExtension).map((ext) => `.${ext}`); + const supportedFileExtensions = supportedReadableFormats.map((fileType) => `.${fileType}`); return
{`lakeFS supports content diff for ${supportedFileExtensions.join(',')} file formats only`} @@ -108,22 +95,16 @@ const ContentDiff = ({config, repoId, path, leftRef, rightRef, leftSize, rightSi const err = (left && left.error) || (right && right.err); if (err) return ; - const viewer = getViewer(path); - if (!viewer) return null; - return
- { - viewer === DiffViewerType.GEOJSON - ? - : - } + +
; } diff --git a/webui/src/pages/repositories/repository/fileRenderers/index.tsx b/webui/src/pages/repositories/repository/fileRenderers/index.tsx index e7f7b5deed1..d251f89a7ec 100644 --- a/webui/src/pages/repositories/repository/fileRenderers/index.tsx +++ b/webui/src/pages/repositories/repository/fileRenderers/index.tsx @@ -3,6 +3,7 @@ import SyntaxHighlighter from "react-syntax-highlighter"; import {FileType, RendererComponent} from "./types"; import {DuckDBRenderer} from "./data"; import { + GeoJSONRenderer, ImageRenderer, IpynbRenderer, MarkdownRenderer, @@ -48,6 +49,11 @@ export const Renderers: {[fileType in FileType] : FC } = { [FileType.TOO_LARGE]: props => ( ), + [FileType.GEOJSON]: props => ( + + + } /> + ), } export const guessLanguage = (extension: string | null, contentType: string | null) => { @@ -102,6 +108,8 @@ export function guessType(contentType: string | null, fileExtension: string | nu case 'application/x-toml': case 'application/toml': return FileType.TEXT + case 'application/geo+json': + return FileType.GEOJSON; case 'application/x-ipynb+json': case 'application/x-ipynb': case 'application/ipynb': @@ -144,6 +152,8 @@ export function guessType(contentType: string | null, fileExtension: string | nu case 'jsonl': case 'ndjson': return FileType.TEXT + case 'geojson': + return FileType.GEOJSON } if (guessLanguage(fileExtension, contentType)) return FileType.TEXT diff --git a/webui/src/pages/repositories/repository/fileRenderers/simple.tsx b/webui/src/pages/repositories/repository/fileRenderers/simple.tsx index 345c8a0a927..ee92b0fdd74 100644 --- a/webui/src/pages/repositories/repository/fileRenderers/simple.tsx +++ b/webui/src/pages/repositories/repository/fileRenderers/simple.tsx @@ -18,6 +18,7 @@ import "react-ipynb-renderer/dist/styles/default.css"; import { useMarkdownProcessor } from "./useMarkdownProcessor"; import { AppContext } from "../../../../lib/hooks/appContext"; import { dark } from "react-syntax-highlighter/dist/esm/styles/prism"; +import {GeoJSONPreview} from "../../../../lib/components/repository/GeoJSONPreview"; export const ObjectTooLarge: FC = ({ path, sizeBytes }) => { return ( @@ -146,3 +147,7 @@ export const PDFRenderer: FC = ({
); }; + +export const GeoJSONRenderer: FC = ({ text }) => { + return ; +}; diff --git a/webui/src/pages/repositories/repository/fileRenderers/types.tsx b/webui/src/pages/repositories/repository/fileRenderers/types.tsx index 357ee61827e..bd386c16e4d 100644 --- a/webui/src/pages/repositories/repository/fileRenderers/types.tsx +++ b/webui/src/pages/repositories/repository/fileRenderers/types.tsx @@ -25,4 +25,5 @@ export enum FileType { TEXT, UNSUPPORTED, TOO_LARGE, + GEOJSON } \ No newline at end of file