diff --git a/webapp/src/components/App/Singlestudy/explore/Debug/Data/Json.tsx b/webapp/src/components/App/Singlestudy/explore/Debug/Data/Json.tsx
index 9ec4c6aff6..a273f1db84 100644
--- a/webapp/src/components/App/Singlestudy/explore/Debug/Data/Json.tsx
+++ b/webapp/src/components/App/Singlestudy/explore/Debug/Data/Json.tsx
@@ -11,13 +11,9 @@ import usePromiseWithSnackbarError from "../../../../../../hooks/usePromiseWithS
import UsePromiseCond from "../../../../../common/utils/UsePromiseCond";
import useEnqueueErrorSnackbar from "../../../../../../hooks/useEnqueueErrorSnackbar";
import ViewWrapper from "../../../../../common/page/ViewWrapper";
+import type { DataCompProps } from "../utils";
-interface Props {
- path: string;
- studyId: string;
-}
-
-function Json({ path, studyId }: Props) {
+function Json({ filePath, studyId }: DataCompProps) {
const [t] = useTranslation();
const { enqueueSnackbar } = useSnackbar();
const enqueueErrorSnackbar = useEnqueueErrorSnackbar();
@@ -25,17 +21,17 @@ function Json({ path, studyId }: Props) {
const [isSaveAllowed, setIsSaveAllowed] = useState(false);
const res = usePromiseWithSnackbarError(
- () => getStudyData(studyId, path, -1),
+ () => getStudyData(studyId, filePath, -1),
{
errorMessage: t("studies.error.retrieveData"),
- deps: [studyId, path],
+ deps: [studyId, filePath],
},
);
// Reset save button when path changes
useUpdateEffect(() => {
setIsSaveAllowed(false);
- }, [studyId, path]);
+ }, [studyId, filePath]);
////////////////////////////////////////////////////////////////
// Event Handlers
@@ -44,7 +40,7 @@ function Json({ path, studyId }: Props) {
const handleSaveJson = async () => {
if (isSaveAllowed && jsonData) {
try {
- await editStudy(jsonData, studyId, path);
+ await editStudy(jsonData, studyId, filePath);
enqueueSnackbar(t("studies.success.saveData"), {
variant: "success",
});
diff --git a/webapp/src/components/App/Singlestudy/explore/Debug/Data/Matrix.tsx b/webapp/src/components/App/Singlestudy/explore/Debug/Data/Matrix.tsx
index 266e377853..7b48f04bc6 100644
--- a/webapp/src/components/App/Singlestudy/explore/Debug/Data/Matrix.tsx
+++ b/webapp/src/components/App/Singlestudy/explore/Debug/Data/Matrix.tsx
@@ -1,24 +1,19 @@
import { MatrixStats } from "../../../../../../common/types";
import MatrixInput from "../../../../../common/MatrixInput";
import ViewWrapper from "../../../../../common/page/ViewWrapper";
+import type { DataCompProps } from "../utils";
-interface Props {
- studyId: string;
- path: string;
-}
-
-function Matrix({ studyId, path }: Props) {
- const filename = path.split("/").pop();
- const isUserFolder = path.startsWith("/user/");
+function Matrix({ studyId, filePath, enableImport }: DataCompProps) {
+ const filename = filePath.split("/").pop();
return (
);
diff --git a/webapp/src/components/App/Singlestudy/explore/Debug/Data/Text.tsx b/webapp/src/components/App/Singlestudy/explore/Debug/Data/Text.tsx
index 99c6247237..a88d2e853a 100644
--- a/webapp/src/components/App/Singlestudy/explore/Debug/Data/Text.tsx
+++ b/webapp/src/components/App/Singlestudy/explore/Debug/Data/Text.tsx
@@ -13,6 +13,7 @@ import plaintext from "react-syntax-highlighter/dist/esm/languages/hljs/plaintex
import ini from "react-syntax-highlighter/dist/esm/languages/hljs/ini";
import properties from "react-syntax-highlighter/dist/esm/languages/hljs/properties";
import { atomOneDark } from "react-syntax-highlighter/dist/esm/styles/hljs";
+import type { DataCompProps } from "../utils";
SyntaxHighlighter.registerLanguage("xml", xml);
SyntaxHighlighter.registerLanguage("plaintext", plaintext);
@@ -24,11 +25,6 @@ const logsRegex = /^(\[[^\]]*\]){3}/;
// Ex: "EXP : 0"
const propertiesRegex = /^[^:]+ : [^:]+/;
-interface Props {
- studyId: string;
- path: string;
-}
-
function getSyntaxProps(data: string | string[]): SyntaxHighlighterProps {
const isArray = Array.isArray(data);
const text = isArray ? data.join("\n") : data;
@@ -50,15 +46,15 @@ function getSyntaxProps(data: string | string[]): SyntaxHighlighterProps {
};
}
-function Text({ studyId, path }: Props) {
+function Text({ studyId, filePath }: DataCompProps) {
const { t } = useTranslation();
const theme = useTheme();
const res = usePromiseWithSnackbarError(
- () => getStudyData(studyId, path),
+ () => getStudyData(studyId, filePath),
{
errorMessage: t("studies.error.retrieveData"),
- deps: [studyId, path],
+ deps: [studyId, filePath],
},
);
diff --git a/webapp/src/components/App/Singlestudy/explore/Debug/Data/index.tsx b/webapp/src/components/App/Singlestudy/explore/Debug/Data/index.tsx
index 3e7e2105b0..813624dfbb 100644
--- a/webapp/src/components/App/Singlestudy/explore/Debug/Data/index.tsx
+++ b/webapp/src/components/App/Singlestudy/explore/Debug/Data/index.tsx
@@ -3,29 +3,33 @@ import Image from "./Image";
import Json from "./Json";
import Matrix from "./Matrix";
import type { FileInfo, FileType } from "../utils";
+import type { DataCompProps } from "../utils";
interface Props extends FileInfo {
studyId: string;
}
-interface DataComponentProps {
- studyId: string;
- path: string;
-}
-type DataComponent = React.ComponentType;
+type DataComponent = React.ComponentType;
const componentByFileType: Record = {
matrix: Matrix,
json: Json,
text: Text,
image: Image,
- folder: ({ path }) => path,
+ folder: ({ filePath }) => filePath,
} as const;
function Data({ studyId, fileType, filePath }: Props) {
+ const isUserFolder = filePath.startsWith("/user/");
const DataViewer = componentByFileType[fileType];
- return ;
+ return (
+
+ );
}
export default Data;
diff --git a/webapp/src/components/App/Singlestudy/explore/Debug/utils.ts b/webapp/src/components/App/Singlestudy/explore/Debug/utils.ts
index 463a6bc31c..cda06034a3 100644
--- a/webapp/src/components/App/Singlestudy/explore/Debug/utils.ts
+++ b/webapp/src/components/App/Singlestudy/explore/Debug/utils.ts
@@ -25,6 +25,12 @@ export interface TreeFolder {
export type TreeData = TreeFolder | TreeFile;
+export interface DataCompProps {
+ studyId: string;
+ filePath: string;
+ enableImport: boolean;
+}
+
////////////////////////////////////////////////////////////////
// File Info
////////////////////////////////////////////////////////////////