Skip to content

Commit

Permalink
Improve the resultspanel for showing all data files and charts.
Browse files Browse the repository at this point in the history
  • Loading branch information
yjcyxky committed Sep 30, 2024
1 parent 84bf7c3 commit 0965b8f
Show file tree
Hide file tree
Showing 8 changed files with 646 additions and 261 deletions.
2 changes: 1 addition & 1 deletion cromwell-api-rs/examples/boxplot.rs
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ async fn main() -> Result<(), CromwellError> {

let workflow_uuid = uuid::Uuid::new_v4().to_string();
let workflow_source = Some(Path::new("examples/boxplot/workflow.wdl"));
let workflow_inputs = Some(Path::new("examples/boxplot/inputs_example.json"));
let workflow_inputs = Some(Path::new("examples/boxplot/inputs.json"));

let status = match client
.submit_workflow(
Expand Down
57 changes: 41 additions & 16 deletions cromwell-api-rs/examples/boxplot/schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,21 @@
"readme": "/workflows/boxplot-v0.1.0/README.md",
"schema": {
"fields": [
{
"key": "dataset",
"dataIndex": "dataset",
"valueType": "dataset_searcher",
"title": "Dataset",
"tooltip": "Dataset to use for boxplot.",
"formItemProps": {
"rules": [
{
"required": true,
"message": "Dataset is required."
}
]
}
},
{
"key": "exp_file",
"dataIndex": "exp_file",
Expand All @@ -14,7 +29,8 @@
"required": true,
"message": "Expression matrix file is required."
}
]
],
"hidden": true
}
},
{
Expand All @@ -29,13 +45,14 @@
"required": true,
"message": "Sample information file is required."
}
]
],
"hidden": true
}
},
{
"key": "which_gene_symbols",
"dataIndex": "which_gene_symbols",
"valueType": "select",
"valueType": "gene_searcher",
"fieldProps": {
"mode": "multiple"
},
Expand All @@ -48,11 +65,6 @@
"message": "Which gene symbols is required."
}
]
},
"valueEnum": {
"BDNF": "BDNF",
"TP53": "TP53",
"EGFR": "EGFR"
}
},
{
Expand All @@ -71,10 +83,6 @@
},
"fieldProps": {
"mode": "multiple"
},
"valueEnum": {
"Female_MECFS": "Female_MECFS",
"Female_Control": "Female_Control"
}
},
{
Expand All @@ -88,7 +96,10 @@
"kruskal.test": "kruskal.test"
},
"title": "Method",
"tooltip": "Method to use for boxplot. Supported methods: `t.test`, `wilcox.test`, `anova`, `kruskal.test`. Default: `t.test`."
"tooltip": "Method to use for boxplot. Supported methods: `t.test`, `wilcox.test`, `anova`, `kruskal.test`. Default: `t.test`.",
"formItemProps": {
"initialValue": "t.test"
}
},
{
"key": "log_scale",
Expand All @@ -99,7 +110,15 @@
"FALSE": "FALSE"
},
"title": "Log Scale",
"tooltip": "Whether to use log scale for boxplot. TRUE or FALSE. Default: FALSE."
"tooltip": "Whether to use log scale for boxplot. TRUE or FALSE. Default: FALSE.",
"formItemProps": {
"rules": [
{
"required": true,
"message": "Log scale is required."
}
]
}
},
{
"key": "enable_label",
Expand All @@ -110,7 +129,10 @@
"FALSE": "FALSE"
},
"title": "Enable Label",
"tooltip": "Whether to enable label for boxplot. TRUE or FALSE. Default: FALSE."
"tooltip": "Whether to enable label for boxplot. TRUE or FALSE. Default: FALSE.",
"formItemProps": {
"initialValue": "FALSE"
}
},
{
"key": "enable_log2fc",
Expand All @@ -121,7 +143,10 @@
"FALSE": "FALSE"
},
"title": "Enable Log2FC",
"tooltip": "Whether to enable log2 fold change for boxplot. TRUE or FALSE. Default: FALSE."
"tooltip": "Whether to enable log2 fold change for boxplot. TRUE or FALSE. Default: FALSE.",
"formItemProps": {
"initialValue": "TRUE"
}
}
],
"examples": [
Expand Down
5 changes: 5 additions & 0 deletions cromwell-api-rs/examples/boxplot/workflow.wdl
Original file line number Diff line number Diff line change
Expand Up @@ -70,10 +70,15 @@ task boxplot_task {
EOF
Rscript ~{script_dir}/boxplot.R args.json
cp ~{exp_file} ./
cp ~{sample_info_file} ./
>>>
output {
File metadata = "metadata.json"
File out_plot = "output.json"
File exp_file = "~{basename(exp_file)}"
File sample_info_file = "~{basename(sample_info_file)}"
}
}
108 changes: 84 additions & 24 deletions studio/src/StatEngine/components/ArgumentForm/index.tsx
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import { DownloadOutlined, EditOutlined, UploadOutlined } from '@ant-design/icons';
import type { ProFormColumnsType, ProFormLayoutType } from '@ant-design/pro-form';
import { BetaSchemaForm, ProProvider, ProFormSelect } from '@ant-design/pro-components';
import { Button, Col, Empty, Row, Space, Tooltip, Form } from 'antd';
// import GeneSearcher from '@/components/GeneSearcher';
// import { GenesQueryParams, GeneDataResponse } from '@/components/GeneSearcher';
import { Button, Col, Empty, Row, Space, Tooltip, Form, Select } from 'antd';
import GeneSearcher from '../GeneSearcher';
import { GenesQueryParams, GeneDataResponse } from '../GeneSearcher';
import FormItem from 'antd/lib/form/FormItem';
import React, { memo, useContext, useEffect, useState } from 'react';
import type { TaskHistory } from '../WorkflowList/data';
Expand All @@ -15,6 +15,19 @@ type DataItem = {
state: string;
};

const datasets = [
{
datasetName: "GSE251790_Female_CSF",
fieldValue: {
exp_file: "/data/biomedgps/cromwell/data/gene_expression.tsv",
sample_info_file: "/data/biomedgps/cromwell/data/sample_info.tsv",
},
fieldValueEnum: {
which_groups: ["Female_MECFS", "Female_Control"]
}
}
]

export type ArgumentProps = {
// queryGenes: (params: GenesQueryParams) => Promise<GeneDataResponse>;
columns: ProFormColumnsType<DataItem>[];
Expand All @@ -27,7 +40,9 @@ export type ArgumentProps = {
};

const ArgumentForm: React.FC<ArgumentProps> = (props) => {
const { columns, height, labelSpan, onSubmit, fieldsValue } = props;
const { height, labelSpan, onSubmit, fieldsValue } = props;

const [columns, setColumns] = useState<ProFormColumnsType<DataItem>[]>(props.columns);

const activateBtn = (
<FormItem
Expand All @@ -46,9 +61,12 @@ const ArgumentForm: React.FC<ArgumentProps> = (props) => {
const [layoutType, setLayoutType] = useState<ProFormLayoutType>('QueryFilter');
const [form] = Form.useForm();

// Ensure columns are initialized on first load
useEffect(() => {
form.resetFields()
}, [columns])
if (props.columns && props.columns.length > 0) {
setColumns(props.columns);
}
}, [props.columns]);

useEffect(() => {
if (fieldsValue) {
Expand All @@ -64,23 +82,65 @@ const ArgumentForm: React.FC<ArgumentProps> = (props) => {
<ProProvider.Provider
value={{
...values,
// valueTypeMap: {
// gene_searcher: {
// render: (text: any) => <a>{text}</a>,
// renderFormItem: (text: any, props: any) => {
// console.log("Gene Searcher Component: ", props, form.getFieldValue(props?.id))
// const initialValue = form.getFieldValue(props?.id)
// return (<GeneSearcher
// placeholder="Enter gene symbol, entrez id or ensembl id"
// dataset={defaultDataset}
// queryGenes={queryGenes}
// initialValue={initialValue ? initialValue : props?.formItemProps?.initialValue}
// {...props?.fieldProps}
// mode={props?.fieldProps?.mode}
// style={{ width: '100%' }} />)
// },
// }
// },
valueTypeMap: {
gene_searcher: {
render: (text: any) => <a>{text}</a>,
renderFormItem: (text: any, props: any) => {
console.log("Gene Searcher Component: ", props, form.getFieldValue(props?.id))
const initialValue = form.getFieldValue(props?.id)
return (<GeneSearcher
placeholder="Enter gene symbol, entrez id"
initialValue={initialValue ? initialValue : props?.formItemProps?.initialValue}
{...props?.fieldProps}
mode={props?.fieldProps?.mode ? props?.fieldProps?.mode : 'single'}
style={{ width: '100%' }} />)
},
},
dataset_searcher: {
render: (text: any) => <a>{text}</a>,
renderFormItem: (text: any, props: any) => {
console.log("Dataset Searcher Component: ", props, text)
return <Select placeholder="Select a dataset" onChange={(value) => {
const dataset = datasets.find((dataset) => dataset.datasetName === value)
console.log("Dataset Searcher Component: ", dataset)
const fieldValue = dataset?.fieldValue ?? {};

form.setFieldsValue({
...fieldValue
})

const fieldValueEnum = dataset?.fieldValueEnum ?? {};
// Update the valueEnum of which_groups
const updatedColumns = columns.map((column) => {
const keys = Object.keys(fieldValueEnum);
if (keys.includes(column.dataIndex as string)) {
const valueEnum = fieldValueEnum[column.dataIndex as keyof typeof fieldValueEnum] as string[];
return {
...column,
valueEnum: valueEnum.reduce((acc: any, cur: any) => {
acc[cur] = cur;
return acc;
}, {})
};
}

return column;
});
setColumns(updatedColumns);

form.setFieldsValue({
[props.id]: value
})
}}>
{datasets.map((dataset) => (
<Select.Option key={dataset.datasetName} value={dataset.datasetName}>
{dataset.datasetName}
</Select.Option>
))}
</Select>
},
}
}
}}
>
<Col className="argument-form__header" style={{ display: 'none' }}>
Expand Down Expand Up @@ -135,7 +195,7 @@ const ArgumentForm: React.FC<ArgumentProps> = (props) => {
</ProProvider.Provider>
</Row>
) : (
<Empty />
<Empty description="No arguments" />
);
};

Expand Down
Loading

0 comments on commit 0965b8f

Please sign in to comment.