Show raw xdi file in review component (#11)

* Show raw xdi file in review component

* run linter

xas-standards-api/src/xas_standards_api/app.py

@@ -26,6 +26,7 @@
     add_new_standard,
     get_data,
     get_file,
+    get_file_as_text,
     get_metadata,
     get_standard,
     select_all,
@@ -285,6 +286,12 @@ async def read_data(
     return get_data(session, id)
 
 
+@app.get("/api/admin/data/{id}")
+async def read_admin_data(id: int, session: Session = Depends(get_session)):
+
+    return get_file_as_text(session, id)
+
+
 @app.post("/uploadfiles/")
 async def create_upload_files(
     files: Annotated[

xas-standards-api/src/xas_standards_api/crud.py

@@ -1,7 +1,7 @@
 import uuid
 
 from fastapi import HTTPException
-from fastapi.responses import FileResponse
+from fastapi.responses import FileResponse, PlainTextResponse
 from larch.io import xdi
 from larch.xafs import pre_edge, set_xafsGroup
 from sqlmodel import select
@@ -133,6 +133,14 @@ def get_file(session, id):
     return FileResponse(xdi_location)
 
 
+def get_file_as_text(session, id):
+    xdi_location = get_filepath(session, id)
+    with open(xdi_location) as fh:
+        file = fh.read()
+
+        return PlainTextResponse(file)
+
+
 def get_norm(energy, group, type):
 
     if type in group:

xas-standards-client/src/components/ReviewCard.tsx

@@ -35,6 +35,7 @@ export default function ReviewCard(props: {standard : AdminXASStandard}) {
     return (
 <Card>
     <CardContent>
+      <Stack spacing={2}>
         <Typography>
             Submitted by: {props.standard.submitter.identifier}
         </Typography>
@@ -76,6 +77,7 @@ export default function ReviewCard(props: {standard : AdminXASStandard}) {
         <Button type="submit">Submit</Button>
         </Stack>
         </Box>
+        </Stack>
     </CardContent>
 </Card>
     )

xas-standards-client/src/components/ReviewTab.tsx

@@ -0,0 +1,66 @@
+
+import { Tab, Tabs, Box} from "@mui/material";
+
+import StandardMetadataCard from "./StandardMetadataCard";
+import ReviewTextView from "./ReviewTextView";
+
+import { useState } from "react";
+import ReviewCard from "./ReviewCard";
+
+interface TabPanelProps {
+    children?: React.ReactNode;
+    index: number;
+    value: number;
+  }
+
+  function CustomTabPanel(props: TabPanelProps) {
+    const { children, value, index, ...other } = props;
+
+    return (
+      <div
+        role="tabpanel"
+        hidden={value !== index}
+        id={`simple-tabpanel-${index}`}
+        aria-labelledby={`simple-tab-${index}`}
+        {...other}
+      >
+        {value === index && <Box sx={{ p: 3 }}>{children}</Box>}
+      </div>
+    );
+  }
+
+  function a11yProps(index: number) {
+    return {
+      id: `simple-tab-${index}`,
+      'aria-controls': `simple-tabpanel-${index}`,
+    };
+  }
+
+export default function ReviewTab(props: { standard: XASStandard }) {
+    const [value, setValue] = useState(0);
+
+  const handleChange = (event: React.SyntheticEvent, newValue: number) => {
+    setValue(newValue);
+  };
+
+  return (
+    <Box sx={{ width: '100%' }}>
+      <Box sx={{ borderBottom: 1, borderColor: 'divider' }}>
+        <Tabs value={value} onChange={handleChange} aria-label="basic tabs example">
+          <Tab label="Standard" {...a11yProps(0)} />
+          <Tab label="Submitted File" {...a11yProps(1)} />
+          <Tab label="Review" {...a11yProps(2)} />
+        </Tabs>
+      </Box>
+      <CustomTabPanel value={value} index={0}>
+      <StandardMetadataCard standard={props.standard}/>
+      </CustomTabPanel>
+      <CustomTabPanel value={value} index={1}>
+      <ReviewTextView standard={props.standard}/>
+      </CustomTabPanel>
+      <CustomTabPanel value={value} index={2}>
+      <ReviewCard standard={props.standard} />
+      </CustomTabPanel>
+    </Box>
+  );
+}

xas-standards-client/src/components/ReviewTable.tsx

@@ -9,6 +9,7 @@ import {AdminXASStandard, XASStandard } from "../models";
 import { useState, useEffect } from "react";
 
 import axios from "axios";
+import ReviewTab from "./ReviewTab";
 
 
 const standards_url = "/api/admin/standards";
@@ -63,10 +64,8 @@ export default function ReviewTable(props : {
         setSelectedStandard={setSelectedStandard} 
         setCurrent={setCurrent}
         prevNext={prevNext}/>
-        {selectedStandard && <>
-        <StandardMetadataCard standard={selectedStandard} />
-        <ReviewCard standard={selectedStandard}/>
-        </>
+        {selectedStandard && 
+        <ReviewTab standard={selectedStandard}/>
       }
         </Stack>
     )

xas-standards-client/src/components/ReviewTextView.tsx

@@ -0,0 +1,29 @@
+import { Typography, Box } from "@mui/material";
+import { useEffect, useState } from "react";
+import axios from "axios";
+import { AdminXASStandard } from "../models";
+
+const data_url = "/api/admin/data"
+
+export default function ReviewTextView(props: {standard : AdminXASStandard}) {
+
+    const [fileString, setFileString] = useState("")
+
+    useEffect(() => {
+        const get_req = (id : number) => {
+
+
+          axios.get(data_url + "/" + id).then((response) => {
+            setFileString(response.data)
+          });
+        };
+        get_req(props.standard.id);
+      }, [props.standard, setFileString]);
+
+    return (
+    <Box>
+        <Typography sx={{whiteSpace:'pre-line',overflow:"scroll", maxHeight:"20em"}}>
+        {fileString}
+        </Typography>
+    </Box>)
+}

xas-standards-client/src/mocks/handlers.ts

@@ -7,6 +7,7 @@ import {
   Edge,
   Element,
   XASStandard,
+  AdminXASStandard,
 } from "../models";
 
 import { response } from "./data_response";
@@ -141,12 +142,46 @@ export const handlers = [
     return HttpResponse.json(response);
   }),
 
+
+  http.get("/api/admin/data/*", () => {
+    const file_content = "# XDI/1.0\n# Column.1: energy eV\n# Column.2: i0\n# Column.3: itrans\n# Column.4: irefer\n# Beamline.name: SSRL 4-3\n# Detector.I0: N2 15cm\n# Detector.I1: N2 30cm\n# Detector.I2: N2 15cm\n# Element.edge: K\n# Element.symbol: Mn\n# Mono.d_spacing: 1.92009\n# Mono.name: Si(220)\n# Mono.notes: unfocused, detuned 10%\n# Sample.formula: MnO\n# Sample.name: MnO\n# Sample.prep: powder, mixed with B(OH)3\n# Sample.reference: Mn filter\n# Sample.temperature: room temperature\n# Scan.start_time: 1995-06-20 02:43:21\n# ///\n#    Note: mono d_spacing is nominal!\n#     217  E XMU I0\n#-------------\n#   energy   i0   itrans  irefer\n    6520.0030  31260.500000  39559.300308  21748.998701\n    6521.0010  31244.500000  39558.301090  21716.000970\n    6522.0000  31237.500000  39580.299067  21723.999044\n    6523.0000  31219.500000  39528.301127  21592.000515\n    6523.9990  31208.500000  39531.301203  21565.999852\n    6524.9990  31201.500000  39519.300411  21505.000093\n    6525.9990  31194.500000  39532.301500  21492.999925\n    6527.0000  31185.500000  39519.299329  21431.998092\n    6528.0000  31175.500000  39487.301134  21332.000793\n    6529.0020  31166.500000  39494.301671  21298.999505\n    6530.0030  31163.500000  39482.302684  21245.999911\n    6531.0060  31152.500000  39481.302240  21203.000376\n    6532.0080  31148.500000  39485.301549  21151.000091\n    6533.0110  31127.500000  39419.301134  21016.000430\n"
+    return HttpResponse.text(file_content)
+  }),
+
+
+
+
+
   http.get('/login', () => {
     return new HttpResponse('<div>Hello</div>', {
       headers: {
         'Content-Type': 'application/html'
       }
     })
+  }),
+
+  http.get("/api/admin/standards", ({ request }) => {
+  const admin_standard2: AdminXASStandard = {
+    beamline: { facility: { name: "dls" }, name: "b01", id: 2 },
+    citation:
+      "Pickering, I. J., George, G. N., & Hedman, B. (1994). SSRL workshops on x-ray absorption spectroscopy. Synchrotron Radiation News, 7(1), 17.",
+    doi: "10.1080/08940889408261246",
+    edge: { id: 1, name: "K" },
+    element: { symbol: "He", z: 2 },
+    id: 2,
+    collection_date: "2024-03-13T09:02:23.686549",
+    facility: "dls",
+    sample_comp: "He",
+    sample_name: "Helium",
+    sample_prep: "Gas",
+    submitter: {identifier: "abc12345"}
+  };
+
+  return HttpResponse.json({
+    items: [admin_standard2],
+    current_page: "H",
+    current_page_backwards: "H",
+  });
   })
 
   // http.get("/login", () => {