Skip to content

Commit

Permalink
RootDBApp/api#10 - wip - report data view dynamic modules imports.
Browse files Browse the repository at this point in the history
  • Loading branch information
PORQUET Sébastien committed Oct 11, 2024
1 parent 8d21820 commit 6f2d1ac
Show file tree
Hide file tree
Showing 8 changed files with 123 additions and 19 deletions.
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -120,5 +120,5 @@
"typescript": "^5.5.4",
"typescript-eslint": "^8.0.0"
},
"packageManager": "yarn@4.3.1"
"packageManager": "yarn@4.5.0"
}
2 changes: 1 addition & 1 deletion src/components/asset/AssetsList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -51,8 +51,8 @@ const AssetsList = (): React.ReactElement => {
value={storageTypeFilter}
onChange={(e: { value: React.SetStateAction<Array<EAssetStorageType>>; }) => setStorageTypeFilter(e.value)}
isInvalid={false}
multiSelect
fullWidth={false}
multiSelect
/>
<div className="p-input-icon-left" id="name-filter">
<i className="pi pi-search"/>
Expand Down
21 changes: 13 additions & 8 deletions src/components/report/data-view/ReportDataViewForm.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -52,6 +52,7 @@ import { defaultDataView } from "../../../contexts/report/
import env from "../../../envVariables";
import { TAPIResponse } from "../../../types/TAPIResponse";
import TReportDataViewState from "../../../types/TReportDataViewState";
import ReportDataViewFormModuleImports from "./ReportDataViewFormModuleImports";

const ReportDataViewForm: React.FC<{
dataViewId: number,
Expand All @@ -65,7 +66,7 @@ const ReportDataViewForm: React.FC<{

const {t} = useTranslation(['common', 'report']);
const {state: authState} = React.useContext(authContext);
const reportDataView: TReportDataViewState = useReportDataViewStateFromReportIdAndDataViewId(reportId, dataViewId);
const reportDataViewState: TReportDataViewState = useReportDataViewStateFromReportIdAndDataViewId(reportId, dataViewId);

const [submitButtonUpdate, setSubmitButtonUpdate] = React.useState<SubmitButtonStatus>(SubmitButtonStatus.ToValidate);
const reportState = useReportState(reportId);
Expand All @@ -78,7 +79,7 @@ const ReportDataViewForm: React.FC<{
setErrorMessage('');
setSubmitButtonUpdate(SubmitButtonStatus.Validating);

if (reportDataView.dataView && reportDataView.dataView.id > 0) {
if (reportDataViewState.dataView && reportDataViewState.dataView.id > 0) {

apiSendRequest({
method: 'PUT',
Expand Down Expand Up @@ -165,7 +166,7 @@ const ReportDataViewForm: React.FC<{
return (
<Formik
validateOnMount
initialValues={reportDataView.dataView ?? defaultDataView}
initialValues={reportDataViewState.dataView ?? defaultDataView}
validationSchema={Yup.object({
name: Yup.string().required(),
title: Yup.string().nullable(''),
Expand Down Expand Up @@ -298,7 +299,7 @@ const ReportDataViewForm: React.FC<{
</div>

<div className={`field col-12 ${formik.values.type === EDataViewType.GRAPH ? 'md:col-3' : ''}`}
style={{display: `${(!reportDataView.dataView?.id) ? 'block' : 'none'}`}}
style={{display: `${(!reportDataViewState.dataView?.id) ? 'block' : 'none'}`}}
>
<label htmlFor="type" className="block">{t('common:form.type')}</label>
<Dropdown
Expand Down Expand Up @@ -366,7 +367,7 @@ const ReportDataViewForm: React.FC<{
</div>

<div className="field col-12 md:col-4"
style={{display: `${(formik.values.type === EDataViewType.GRAPH && !reportDataView.dataView?.id) ? 'block' : 'none'}`}}
style={{display: `${(formik.values.type === EDataViewType.GRAPH && !reportDataViewState.dataView?.id) ? 'block' : 'none'}`}}
>
<label htmlFor="report_data_view_lib_version_id"
className="block">{t('report:form.library')}</label>
Expand All @@ -387,7 +388,7 @@ const ReportDataViewForm: React.FC<{
formik.setFieldValue('report_data_view_lib_type_id', 38)
}
// For ChartJS, default to Bar, because why not.
else {
else {
formik.setFieldValue('report_data_view_lib_type_id', 22)
}
}}
Expand All @@ -399,7 +400,7 @@ const ReportDataViewForm: React.FC<{
</div>

<div className="field col-12 md:col-5"
style={{display: `${(formik.values.type === EDataViewType.GRAPH && !reportDataView.dataView?.id) ? 'block' : 'none'}`}}
style={{display: `${(formik.values.type === EDataViewType.GRAPH && !reportDataViewState.dataView?.id) ? 'block' : 'none'}`}}
>
<label htmlFor="report_data_view_lib_type_id"
className="block">{t('report:form.chart_model')}</label>
Expand All @@ -415,6 +416,10 @@ const ReportDataViewForm: React.FC<{
/>
</div>

<div className="field col-12">
<ReportDataViewFormModuleImports reportDataViewState={reportDataViewState}/>
</div>

{/*{formik.values.type === EDataViewType.GRAPH && (*/}
{/* <div className="field col-12">*/}
{/* <label htmlFor="max_width" className="block">{t('common:form.maxWidth')}</label>*/}
Expand Down Expand Up @@ -464,7 +469,7 @@ const ReportDataViewForm: React.FC<{
buttonStatus={submitButtonUpdate}
disabled={!formik.isValid}
labels={
(reportDataView.dataView && reportDataView.dataView.id > 0)
(reportDataViewState.dataView && reportDataViewState.dataView.id > 0)
? {
default: t('common:form.update').toString(),
validating: t('common:form.updating').toString(),
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
/*
* This file is part of RootDB.
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as published
* by the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*
* AUTHORS
* PORQUET Sébastien <[email protected]>
* ROBIN Brice <[email protected]>
*/

import * as React from 'react';
import TJSModuleImport from "../../../types/TJSmoduleImport";
import TReportDataViewState from "../../../types/TReportDataViewState";

const ReportDataViewFormModuleImports: React.FC<{ reportDataViewState: TReportDataViewState }> = ({reportDataViewState}) => {

const [jsModuleImports, setJsModuleImports] = React.useState<Array<TJSModuleImport>>([]);

React.useEffect(() => {

if(reportDataViewState.dataView?.json_runtime_configuration_minified) {

}

}, []);

return (<></>);
}

export default ReportDataViewFormModuleImports;
Original file line number Diff line number Diff line change
Expand Up @@ -152,7 +152,7 @@ const DataViewGraphView: React.FC<{
}

const modulesToImport: Array<{ url: string, as: string }> = [
// {url: "https://cdn.skypack.dev/[email protected]", as: "topojson"},
{url: "https://cdn.skypack.dev/[email protected]", as: "topojson"},
];

const load = async () => {
Expand Down
27 changes: 27 additions & 0 deletions src/types/TJSmoduleImport.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
/*
* This file is part of RootDB.
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as published
* by the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*
* AUTHORS
* PORQUET Sébastien <[email protected]>
* ROBIN Brice <[email protected]>
*/

type TJSModuleImport = {
url: string,
as: string
}

export = TJSModuleImport;
19 changes: 11 additions & 8 deletions src/types/TReportDataView.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -19,30 +19,33 @@
* ROBIN Brice <[email protected]>
*/

import { EDataViewType } from "./EDataViewType";
import TReportDataViewJs from "./TReportDataViewJs";
import TReportDataViewLibVersion from "./TReportDataViewLibVersion";
import { EDataViewType } from "./EDataViewType";
import TReportDataViewJs from "./TReportDataViewJs";
import TReportDataViewLibVersion from "./TReportDataViewLibVersion";
import TReportDataViewRunTimeConfiguration from "./TReportDataViewRuntimeConfiguration";

type TReportDataView = {
id: number,
by_chunk: boolean,
chunk_size: number,
created_at?: Date,
description?: string,
description_display_type?: number,
is_visible: boolean,
json_runtime_configuration?: TReportDataViewRunTimeConfiguration,
json_runtime_configuration_minified?: boolean,
on_queue: boolean,
max_width: number | undefined,
name: string,
position: string,
query: string,
report_data_view_lib_type_id?: number,
report_data_view_lib_version?: TReportDataViewLibVersion,
report_data_view_lib_version_id: number,
report_data_view_js: TReportDataViewJs,
report_data_view_js_id: number,
title?: string,
type: EDataViewType,
created_at?: Date,
description?: string,
report_data_view_lib_type_id?: number,
report_data_view_lib_version?: TReportDataViewLibVersion,
title?: string,
updated_at?: Date | null,
}

Expand Down
28 changes: 28 additions & 0 deletions src/types/TReportDataViewRuntimeConfiguration.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
/*
* This file is part of RootDB.
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as published
* by the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*
* AUTHORS
* PORQUET Sébastien <[email protected]>
* ROBIN Brice <[email protected]>
*/

import TJSModuleImport from "./TJSmoduleImport";

type TReportDataViewRunTimeConfiguration = {
jsModules: array<TJSModuleImport>
}

export = TReportDataViewRunTimeConfiguration;

0 comments on commit 6f2d1ac

Please sign in to comment.