Update dependencies and improve Python path handling
Updated several frontend dependencies including MUI packages and added new ones like `@mui/x-charts`. Adjusted the Python path setup in the CI configuration to correctly point to the `aaredb` backend, ensuring accurate module resolution.
This commit is contained in:
@@ -4,7 +4,10 @@ import {
|
||||
} from '@mui/material';
|
||||
import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
|
||||
import './SampleImage.css';
|
||||
import { DataGridPremium, GridColDef } from "@mui/x-data-grid-premium";
|
||||
import { DataGridPremium, GridColDef, GridValueGetterParams } from "@mui/x-data-grid-premium";
|
||||
import { LineChart } from '@mui/x-charts/LineChart';
|
||||
|
||||
|
||||
import { SamplesService } from "../../openapi";
|
||||
|
||||
interface RunDetailsProps {
|
||||
@@ -15,6 +18,10 @@ interface RunDetailsProps {
|
||||
onHeightChange?: (height: number) => void;
|
||||
}
|
||||
|
||||
interface CCPoint {
|
||||
resolution: number;
|
||||
value: number;
|
||||
}
|
||||
|
||||
interface ExperimentParameters {
|
||||
run_number: number;
|
||||
@@ -26,6 +33,7 @@ interface ExperimentParameters {
|
||||
|
||||
|
||||
interface ProcessingResults {
|
||||
id: number;
|
||||
pipeline: string;
|
||||
resolution: number;
|
||||
unit_cell: string;
|
||||
@@ -33,8 +41,8 @@ interface ProcessingResults {
|
||||
rmerge: number;
|
||||
rmeas: number;
|
||||
isig: number;
|
||||
cc: number;
|
||||
cchalf: number;
|
||||
cc: CCPoint[];
|
||||
cchalf: CCPoint[];
|
||||
completeness: number;
|
||||
multiplicity: number;
|
||||
nobs: number;
|
||||
@@ -43,6 +51,7 @@ interface ProcessingResults {
|
||||
comments?: string | null;
|
||||
}
|
||||
|
||||
|
||||
const RunDetails: React.FC<RunDetailsProps> = ({ run, onHeightChange, basePath, runId, sample_id }) => {
|
||||
const containerRef = useRef<HTMLDivElement | null>(null);
|
||||
const [currentHeight, setCurrentHeight] = useState<number>(0);
|
||||
@@ -71,8 +80,8 @@ const RunDetails: React.FC<RunDetailsProps> = ({ run, onHeightChange, basePath,
|
||||
rmerge: res.result?.rmerge ?? 0,
|
||||
rmeas: res.result?.rmeas ?? 0,
|
||||
isig: res.result?.isig ?? 0,
|
||||
cc: res.result?.cc ?? 0,
|
||||
cchalf: res.result?.cchalf ?? 0,
|
||||
cc: res.result?.cc || [],
|
||||
cchalf: res.result?.cchalf || [],
|
||||
completeness: res.result?.completeness ?? 0,
|
||||
multiplicity: res.result?.multiplicity ?? 0,
|
||||
nobs: res.result?.nobs ?? 0,
|
||||
@@ -88,22 +97,38 @@ const RunDetails: React.FC<RunDetailsProps> = ({ run, onHeightChange, basePath,
|
||||
};
|
||||
|
||||
|
||||
const resultColumns: GridColDef[] = [
|
||||
{field: 'pipeline', headerName: 'Pipeline', flex: 1},
|
||||
{field: 'resolution', headerName: 'Resolution (Å)', flex: 1},
|
||||
{field: 'unit_cell', headerName: 'Unit Cell (Å)', flex: 1.5},
|
||||
{field: 'spacegroup', headerName: 'Spacegroup', flex: 1},
|
||||
{field: 'rmerge', headerName: 'Rmerge', flex: 1},
|
||||
{field: 'rmeas', headerName: 'Rmeas', flex: 1},
|
||||
{field: 'isig', headerName: 'I/sig(I)', flex: 1},
|
||||
{field: 'cc', headerName: 'CC', flex: 1},
|
||||
{field: 'cchalf', headerName: 'CC(1/2)', flex: 1},
|
||||
{field: 'completeness', headerName: 'Completeness (%)', flex: 1},
|
||||
{field: 'multiplicity', headerName: 'Multiplicity', flex: 1},
|
||||
{field: 'nobs', headerName: 'N obs.', flex: 1},
|
||||
{field: 'total_refl', headerName: 'Total Reflections', flex: 1},
|
||||
{field: 'unique_refl', headerName: 'Unique Reflections', flex: 1},
|
||||
{field: 'comments', headerName: 'Comments', flex: 2},
|
||||
const resultColumns: GridColDef<ProcessingResults>[] = [
|
||||
{ field: 'pipeline', headerName: 'Pipeline', flex: 1 },
|
||||
{ field: 'resolution', headerName: 'Resolution (Å)', flex: 1 },
|
||||
{ field: 'unit_cell', headerName: 'Unit Cell (Å)', flex: 1.5 },
|
||||
{ field: 'spacegroup', headerName: 'Spacegroup', flex: 1 },
|
||||
{ field: 'rmerge', headerName: 'Rmerge', flex: 1 },
|
||||
{ field: 'rmeas', headerName: 'Rmeas', flex: 1 },
|
||||
{ field: 'isig', headerName: 'I/sig(I)', flex: 1 },
|
||||
{
|
||||
field: 'cc',
|
||||
headerName: 'CC',
|
||||
flex: 1,
|
||||
valueGetter: (params: GridValueGetterParams<ProcessingResults, string>) =>
|
||||
Array.isArray(params.row?.cc)
|
||||
? params.row.cc.map((point: CCPoint) => `${point.value.toFixed(2)}@${point.resolution.toFixed(2)}`).join(', ')
|
||||
: '',
|
||||
},
|
||||
{
|
||||
field: 'cchalf',
|
||||
headerName: 'CC(1/2)',
|
||||
flex: 1,
|
||||
valueGetter: (params: GridValueGetterParams<ProcessingResults, string>) =>
|
||||
Array.isArray(params.row?.cchalf)
|
||||
? params.row.cchalf.map((point: CCPoint) => `${point.value.toFixed(2)}@${point.resolution.toFixed(2)}`).join(', ')
|
||||
: '',
|
||||
},
|
||||
{ field: 'completeness', headerName: 'Completeness (%)', flex: 1 },
|
||||
{ field: 'multiplicity', headerName: 'Multiplicity', flex: 1 },
|
||||
{ field: 'nobs', headerName: 'N obs.', flex: 1 },
|
||||
{ field: 'total_refl', headerName: 'Total Reflections', flex: 1 },
|
||||
{ field: 'unique_refl', headerName: 'Unique Reflections', flex: 1 },
|
||||
{ field: 'comments', headerName: 'Comments', flex: 2 },
|
||||
];
|
||||
|
||||
const updateHeight = () => {
|
||||
@@ -260,12 +285,12 @@ const RunDetails: React.FC<RunDetailsProps> = ({ run, onHeightChange, basePath,
|
||||
<AccordionDetails style={{width: '100%', overflowX: 'auto'}}>
|
||||
{processingResult ? (
|
||||
<div style={{width: '100%'}}>
|
||||
<DataGridPremium
|
||||
rows={processingResult.map((res, idx) => ({id: idx, ...res}))}
|
||||
<DataGridPremium<ProcessingResults>
|
||||
rows={processingResult.map((res, idx) => ({ id: idx, ...res }))}
|
||||
columns={resultColumns}
|
||||
autoHeight
|
||||
hideFooter
|
||||
columnVisibilityModel={{id: false}}
|
||||
columnVisibilityModel={{ id: false }}
|
||||
disableColumnResize={false}
|
||||
/>
|
||||
</div>
|
||||
@@ -276,6 +301,38 @@ const RunDetails: React.FC<RunDetailsProps> = ({ run, onHeightChange, basePath,
|
||||
</Accordion>
|
||||
</div>
|
||||
|
||||
{processingResult && processingResult.length > 0 && (
|
||||
<div style={{width: 400, marginTop: '16px' }}>
|
||||
<Typography variant="h6" gutterBottom>CC and CC(1/2) vs Resolution</Typography>
|
||||
<LineChart
|
||||
xAxis={[
|
||||
{
|
||||
data: processingResult[0].cc
|
||||
.map((point) => point.resolution) // Grab the resolution values
|
||||
.reverse(), // Reverse the data for resolution
|
||||
label: 'Resolution (Å)',
|
||||
reverse: true, // This ensures the visual flip on the chart, low-res to right and high-res to left
|
||||
},
|
||||
]}
|
||||
series={[
|
||||
{
|
||||
data: processingResult[0].cc
|
||||
.map((point) => point.value)
|
||||
.reverse(), // Reverse the CC values to match the reversed resolution
|
||||
label: 'CC',
|
||||
},
|
||||
{
|
||||
data: processingResult[0].cchalf
|
||||
.map((point) => point.value)
|
||||
.reverse(), // Reverse the CC(1/2) values to match the reversed resolution
|
||||
label: 'CC(1/2)',
|
||||
},
|
||||
]}
|
||||
height={300}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Modal for Zoomed Image */}
|
||||
<Modal open={modalOpen} onClose={closeModal}>
|
||||
<Box
|
||||
|
||||
Reference in New Issue
Block a user