From 667553b42846a9321937b3b35208aeb79d6fb8b6 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Sat, 10 Jun 2023 00:52:26 +1200 Subject: [PATCH 01/60] refactor: restruct the persistor store --- scripts/generateNewGeneratorSkelton.ts | 7 ++++++ src/components/Exporter/index.ts | 0 src/components/Exporter/src/ExportModal.tsx | 16 +++++++++++++ src/components/Exporter/src/index.tsx | 0 src/pages/_app.tsx | 4 ++-- src/reducers/index.ts | 26 +++++++++++++++++---- src/utils/generatorUtils.ts | 15 ++++++++---- 7 files changed, 57 insertions(+), 11 deletions(-) create mode 100644 scripts/generateNewGeneratorSkelton.ts create mode 100644 src/components/Exporter/index.ts create mode 100644 src/components/Exporter/src/ExportModal.tsx create mode 100644 src/components/Exporter/src/index.tsx diff --git a/scripts/generateNewGeneratorSkelton.ts b/scripts/generateNewGeneratorSkelton.ts new file mode 100644 index 0000000..d639236 --- /dev/null +++ b/scripts/generateNewGeneratorSkelton.ts @@ -0,0 +1,7 @@ +import {resolve} from 'node:path'; + +// constants +const pathRoot = resolve(__dirname, '..'); +const pathGenerators = resolve(pathRoot, 'src', 'core', 'generators'); + +// TODO: implement \ No newline at end of file diff --git a/src/components/Exporter/index.ts b/src/components/Exporter/index.ts new file mode 100644 index 0000000..e69de29 diff --git a/src/components/Exporter/src/ExportModal.tsx b/src/components/Exporter/src/ExportModal.tsx new file mode 100644 index 0000000..ee5c87e --- /dev/null +++ b/src/components/Exporter/src/ExportModal.tsx @@ -0,0 +1,16 @@ +import React from 'react'; +import {Modal} from "@douyinfe/semi-ui"; +import {ExportFormatConfigurator} from "@/components/ExportFormatConfigurator"; +import {NumbOfRowInput} from "@/components/Toolbar/src/components/NumOfRowInput"; + +export interface ExportModalProps { + +} + +export const ExportModal:React.FunctionComponent = () => { + return( + {}} onOk={()=>{}}> + + + ) +} \ No newline at end of file diff --git a/src/components/Exporter/src/index.tsx b/src/components/Exporter/src/index.tsx new file mode 100644 index 0000000..e69de29 diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx index 7ffc30d..9df67e2 100644 --- a/src/pages/_app.tsx +++ b/src/pages/_app.tsx @@ -12,7 +12,7 @@ import SEO from '../../next-seo.config.json'; // state management import {Provider} from "react-redux"; -import {store, persistor} from "@/store"; +import {store, persist} from "@/store"; import {useRouter} from "next/router"; import {PersistGate} from 'redux-persist/integration/react' @@ -28,7 +28,7 @@ export default function MyApp({Component, pageProps}: AppProps) { return ( - + diff --git a/src/reducers/index.ts b/src/reducers/index.ts index 38f5596..ffc9401 100644 --- a/src/reducers/index.ts +++ b/src/reducers/index.ts @@ -1,16 +1,34 @@ import {combineReducers} from "redux"; import {Store, Action} from "@/types/system"; +import storage from "@/store/storage"; // reducers import app from "@/reducers/app/appReducer"; import workspace from "@/reducers/workspace/workspaceReducer"; import preview from "@/reducers/preview/previewReducer"; +import {persistReducer} from "redux-persist"; + +// persist +const appPersistConfig = { + key: 'app', + storage: storage +} + +const workspacePersistConfig = { + key: 'workspace', + storage: storage +} + +const previewPersistConfig = { + key: 'preview', + storage: storage +} const rootReducer = combineReducers({ - app, - workspace, - preview + app: persistReducer(appPersistConfig, app), + workspace: persistReducer(workspacePersistConfig, workspace), + preview: persistReducer(previewPersistConfig, preview) }); -export default (state: Store, action: Action) => rootReducer(state, action); \ No newline at end of file +export default rootReducer; \ No newline at end of file diff --git a/src/utils/generatorUtils.ts b/src/utils/generatorUtils.ts index efcf3d3..eceaad8 100644 --- a/src/utils/generatorUtils.ts +++ b/src/utils/generatorUtils.ts @@ -87,20 +87,25 @@ export const isEmptyField = (emptyProb: number): boolean => { // get generator grouped by category list with search and locale export const getGeneratorList = (search: string, intl: any): { [category: string]: Generator[] } => { - const categorizedGenerator: { [category: string]: Generator[] } = {}; - categorizedGenerator[DataTypeCategory.ALL] = []; - Object.values(DataType).forEach((dataType) => { + const categorizedGenerator: { [category: string]: Generator[] } = { + [DataTypeCategory.ALL]: [] + }; + + for (const dataType of Object.values(DataType)) { const generator = generators[dataType]; - generator.displayName = intl.formatMessage({id: `dataType.${dataType}`}); + generator.displayName = intl.formatMessage({ id: `dataType.${dataType}` }); const category = generator.category; + if (!categorizedGenerator[category]) { categorizedGenerator[category] = []; } + if (!search || generator.displayName.toLowerCase().includes(search.toLowerCase())) { categorizedGenerator[DataTypeCategory.ALL].push(generator); categorizedGenerator[category].push(generator); } - }); + } + return categorizedGenerator; } From 59e7d9099e337c6c67bca86523f53804903d3992 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Sat, 10 Jun 2023 00:57:03 +1200 Subject: [PATCH 02/60] refactor: change type name Store to RootState --- .../src/components/ColorModeSwitchButton.tsx | 4 +-- .../Layout/src/components/Footer.tsx | 4 +-- src/components/Layout/src/components/Logo.tsx | 4 +-- .../Layout/src/components/NavBar.tsx | 4 +-- .../PreviewPanel/src/PreviewPanel.tsx | 4 +-- .../components/RawPreviewer/RawPreviewer.tsx | 4 +-- .../components/PanelsOrientationButton.tsx | 4 +-- src/pages/_app.tsx | 4 +-- src/reducers/app/appSelectors.ts | 4 +-- src/reducers/export/exportReducer.ts | 0 src/reducers/index.ts | 2 +- src/reducers/preview/previewSelectors.ts | 10 +++---- src/reducers/workspace/workspaceSelectors.ts | 26 +++++++++---------- src/types/system.d.ts | 2 +- 14 files changed, 38 insertions(+), 38 deletions(-) create mode 100644 src/reducers/export/exportReducer.ts diff --git a/src/components/Layout/src/components/ColorModeSwitchButton.tsx b/src/components/Layout/src/components/ColorModeSwitchButton.tsx index 55bb2c6..474263e 100644 --- a/src/components/Layout/src/components/ColorModeSwitchButton.tsx +++ b/src/components/Layout/src/components/ColorModeSwitchButton.tsx @@ -3,7 +3,7 @@ import {Button, Tooltip} from '@douyinfe/semi-ui'; import {FunctionComponent, useEffect} from 'react'; import {ColorMode} from "@/constants/enums"; import {useDispatch, useSelector} from "react-redux"; -import {Store} from "@/types/system"; +import {RootState} from "@/types/system"; import {doSetColorMode} from "@/reducers/app/appActions"; import {useIntl} from "@/locale"; @@ -17,7 +17,7 @@ export const ColorModeSwitchButton: FunctionComponent state.app.colorMode); + const colorMode: ColorMode = useSelector((state: RootState) => state.app.colorMode); const updateThemeToBody = (mode: ColorMode) => { const {body} = document; diff --git a/src/components/Layout/src/components/Footer.tsx b/src/components/Layout/src/components/Footer.tsx index eb97e8f..eb78cd1 100644 --- a/src/components/Layout/src/components/Footer.tsx +++ b/src/components/Layout/src/components/Footer.tsx @@ -4,7 +4,7 @@ import Image from 'next/image'; import packageJson from '../../../../../package.json'; import {useSelector} from "react-redux"; import {ColorMode} from "@/constants/enums"; -import {Store} from "@/types/system"; +import {RootState} from "@/types/system"; import Link from "next/link"; import {GITHUB_URL} from "@/constants/links"; @@ -18,7 +18,7 @@ export const Footer: FunctionComponent = ({className}) => { const {Text} = Typography; // store - const colorMode = useSelector((state: Store) => state.app.colorMode); + const colorMode = useSelector((state: RootState) => state.app.colorMode); const projectVersion = packageJson.version; diff --git a/src/components/Layout/src/components/Logo.tsx b/src/components/Layout/src/components/Logo.tsx index 068152d..667b53c 100644 --- a/src/components/Layout/src/components/Logo.tsx +++ b/src/components/Layout/src/components/Logo.tsx @@ -1,6 +1,6 @@ import {FunctionComponent} from 'react'; import Link from 'next/link'; -import {Store} from "@/types/system"; +import {RootState} from "@/types/system"; import {useSelector} from "react-redux"; import {ColorMode} from "@/constants/enums"; import Image from "next/image"; @@ -10,7 +10,7 @@ export type LogoProps = {}; export const Logo: FunctionComponent = ({...props}) => { // store - const colorMode = useSelector((state: Store) => state.app.colorMode); + const colorMode = useSelector((state: RootState) => state.app.colorMode); return ( diff --git a/src/components/Layout/src/components/NavBar.tsx b/src/components/Layout/src/components/NavBar.tsx index 03785b6..ccde009 100644 --- a/src/components/Layout/src/components/NavBar.tsx +++ b/src/components/Layout/src/components/NavBar.tsx @@ -4,7 +4,7 @@ import styles from './NavBar.module.css'; import {ColorModeSwitchButton} from "@/components/Layout/src/components/ColorModeSwitchButton"; import {ColorMode} from "@/constants/enums"; import {useSelector} from "react-redux"; -import {Store} from "@/types/system"; +import {RootState} from "@/types/system"; import {LocaleSwitchButton} from "@/components/Layout/src/components/LocaleSwitchButton"; import {navBarRoutes} from "@/routes"; import {useIntl} from "@/locale"; @@ -19,7 +19,7 @@ export type NavBarProps = {} export const NavBar: FunctionComponent = () => { - const colorMode: ColorMode = useSelector((state: Store) => state.app.colorMode); + const colorMode: ColorMode = useSelector((state: RootState) => state.app.colorMode); const [isMenuOpen, setIsMenuOpen] = useState(false); const [defaultSelectedKeys, setSelectedKeys] = useState([]); const intl = useIntl(); diff --git a/src/components/PreviewPanel/src/PreviewPanel.tsx b/src/components/PreviewPanel/src/PreviewPanel.tsx index c474edd..3f92186 100644 --- a/src/components/PreviewPanel/src/PreviewPanel.tsx +++ b/src/components/PreviewPanel/src/PreviewPanel.tsx @@ -2,7 +2,7 @@ import React, {useEffect, useRef} from 'react'; import {RawPreviewer, SettingBar, TablePreviewer} from "@/components/PreviewPanel/src/components"; import styles from './PreviewPanel.module.css'; import {ComponentSize, PreviewType} from "@/constants/enums"; -import {Store} from "@/types/system"; +import {RootState} from "@/types/system"; import {useSelector} from "react-redux"; @@ -15,7 +15,7 @@ export const PreviewPanel: React.FunctionComponent = () => { const [componentsSize, setComponentsSize] = React.useState(ComponentSize.LARGE); // store - const previewType = useSelector((state: Store) => state.preview.previewType); + const previewType = useSelector((state: RootState) => state.preview.previewType); useEffect(() => { const resizeObserver = new ResizeObserver((entries) => { diff --git a/src/components/PreviewPanel/src/components/RawPreviewer/RawPreviewer.tsx b/src/components/PreviewPanel/src/components/RawPreviewer/RawPreviewer.tsx index a11f82a..7268dbe 100644 --- a/src/components/PreviewPanel/src/components/RawPreviewer/RawPreviewer.tsx +++ b/src/components/PreviewPanel/src/components/RawPreviewer/RawPreviewer.tsx @@ -3,7 +3,7 @@ import CodeMirror from "@uiw/react-codemirror"; import {langs} from '@uiw/codemirror-extensions-langs'; import {EditorView} from '@codemirror/view'; import {useSelector} from "react-redux"; -import {Store} from "@/types/system"; +import {RootState} from "@/types/system"; import {ColorMode} from "@/constants/enums"; import {darkTheme, lightTheme} from "@/components/PreviewPanel/src/components/RawPreviewer/RawPreviewer.themes"; import {Extension} from "@codemirror/state"; @@ -30,7 +30,7 @@ export const RawPreviewer: React.FunctionComponent = ({...pro rawViewShowLineNumber, rawViewLineWrap, rawViewFontSize - } = useSelector((state: Store) => state.preview); + } = useSelector((state: RootState) => state.preview); const previewFormattedData = useSelector(selectPreviewFormattedData); const sortableIdsList = useSelector(selectDataFieldsSortableIdsList); diff --git a/src/components/Toolbar/src/components/PanelsOrientationButton.tsx b/src/components/Toolbar/src/components/PanelsOrientationButton.tsx index 04f66eb..4d40887 100644 --- a/src/components/Toolbar/src/components/PanelsOrientationButton.tsx +++ b/src/components/Toolbar/src/components/PanelsOrientationButton.tsx @@ -3,7 +3,7 @@ import {Button, Tooltip} from "@douyinfe/semi-ui"; import {IconSidebar} from "@douyinfe/semi-icons"; import {useIntl} from "@/locale"; import {useDispatch, useSelector} from "react-redux"; -import {Store} from "@/types/system"; +import {RootState} from "@/types/system"; import {PanelsOrientation} from "@/constants/enums"; import {doSetPanelsOrientation} from "@/reducers/workspace/workspaceActions"; @@ -17,7 +17,7 @@ export const PanelsOrientationButton: React.FC = ( const dispatch = useDispatch(); // store - const direction = useSelector((state: Store) => state.workspace.panelsOrientation); + const direction = useSelector((state: RootState) => state.workspace.panelsOrientation); // actions const handlePanelDirectionChange = () => { diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx index 9df67e2..7ffc30d 100644 --- a/src/pages/_app.tsx +++ b/src/pages/_app.tsx @@ -12,7 +12,7 @@ import SEO from '../../next-seo.config.json'; // state management import {Provider} from "react-redux"; -import {store, persist} from "@/store"; +import {store, persistor} from "@/store"; import {useRouter} from "next/router"; import {PersistGate} from 'redux-persist/integration/react' @@ -28,7 +28,7 @@ export default function MyApp({Component, pageProps}: AppProps) { return ( - + diff --git a/src/reducers/app/appSelectors.ts b/src/reducers/app/appSelectors.ts index abb60a5..4c9ee3d 100644 --- a/src/reducers/app/appSelectors.ts +++ b/src/reducers/app/appSelectors.ts @@ -1,3 +1,3 @@ -import {Store} from "@/types/system"; +import {RootState} from "@/types/system"; -export const selectColorMode = (state: Store) => state.app.colorMode; \ No newline at end of file +export const selectColorMode = (state: RootState) => state.app.colorMode; \ No newline at end of file diff --git a/src/reducers/export/exportReducer.ts b/src/reducers/export/exportReducer.ts new file mode 100644 index 0000000..e69de29 diff --git a/src/reducers/index.ts b/src/reducers/index.ts index ffc9401..2828ba2 100644 --- a/src/reducers/index.ts +++ b/src/reducers/index.ts @@ -1,5 +1,5 @@ import {combineReducers} from "redux"; -import {Store, Action} from "@/types/system"; +import {RootState, Action} from "@/types/system"; import storage from "@/store/storage"; // reducers diff --git a/src/reducers/preview/previewSelectors.ts b/src/reducers/preview/previewSelectors.ts index a26fdfb..85f98d9 100644 --- a/src/reducers/preview/previewSelectors.ts +++ b/src/reducers/preview/previewSelectors.ts @@ -1,6 +1,6 @@ -import {Store} from "@/types/system"; +import {RootState} from "@/types/system"; -export const selectPreviewType = (state: Store) => state.preview.previewType; -export const selectRawViewShowLineNumber = (state: Store) => state.preview.rawViewShowLineNumber; -export const selectRawViewLineWrap = (state: Store) => state.preview.rawViewLineWrap; -export const selectRawViewFontSize = (state: Store) => state.preview.rawViewFontSize; \ No newline at end of file +export const selectPreviewType = (state: RootState) => state.preview.previewType; +export const selectRawViewShowLineNumber = (state: RootState) => state.preview.rawViewShowLineNumber; +export const selectRawViewLineWrap = (state: RootState) => state.preview.rawViewLineWrap; +export const selectRawViewFontSize = (state: RootState) => state.preview.rawViewFontSize; \ No newline at end of file diff --git a/src/reducers/workspace/workspaceSelectors.ts b/src/reducers/workspace/workspaceSelectors.ts index 679bb6d..b2dea75 100644 --- a/src/reducers/workspace/workspaceSelectors.ts +++ b/src/reducers/workspace/workspaceSelectors.ts @@ -1,21 +1,21 @@ -import {Store} from "@/types/system"; +import {RootState} from "@/types/system"; import {createSelector} from "reselect"; //panels orientation -export const selectPanelsOrientation = (state: Store) => state.workspace.panelsOrientation; +export const selectPanelsOrientation = (state: RootState) => state.workspace.panelsOrientation; // data fields -export const selectDataFields = (state: Store) => state.workspace.dataFields; -export const selectDataFieldsSortableIdsList = (state: Store) => state.workspace.dataFieldsSortableIdsList; +export const selectDataFields = (state: RootState) => state.workspace.dataFields; +export const selectDataFieldsSortableIdsList = (state: RootState) => state.workspace.dataFieldsSortableIdsList; export const selectNumbersOfDataFields = createSelector( selectDataFields, (dataFields) => Object.keys(dataFields).length); // data type select modal -export const selectShowDataTypeSelectModal = (state: Store) => state.workspace.showDataTypeSelectModal; -export const selectCurrentDataTypeSelectModalTargetFieldId = (state: Store) => state.workspace.currentDataTypeSelectModalTargetFieldId; +export const selectShowDataTypeSelectModal = (state: RootState) => state.workspace.showDataTypeSelectModal; +export const selectCurrentDataTypeSelectModalTargetFieldId = (state: RootState) => state.workspace.currentDataTypeSelectModalTargetFieldId; export const selectCurrentDataTypeSelectModalTargetField = createSelector( selectDataFields, selectCurrentDataTypeSelectModalTargetFieldId, @@ -24,8 +24,8 @@ export const selectCurrentDataTypeSelectModalTargetField = createSelector( // data type options modal -export const selectShowDataTypeOptionsModal = (state: Store) => state.workspace.showDataTypeOptionsModal; -export const selectCurrentDataTypeOptionsModalTargetFieldId = (state: Store) => state.workspace.currentDataTypeOptionsModalTargetFieldId; +export const selectShowDataTypeOptionsModal = (state: RootState) => state.workspace.showDataTypeOptionsModal; +export const selectCurrentDataTypeOptionsModalTargetFieldId = (state: RootState) => state.workspace.currentDataTypeOptionsModalTargetFieldId; export const selectCurrentDataTypeOptionsModalTargetField = createSelector( selectDataFields, selectCurrentDataTypeOptionsModalTargetFieldId, @@ -33,10 +33,10 @@ export const selectCurrentDataTypeOptionsModalTargetField = createSelector( ) // preview data -export const selectPreviewData = (state: Store) => state.workspace.previewData; -export const selectPreviewFormattedData = (state: Store) => state.workspace.previewFormattedData; +export const selectPreviewData = (state: RootState) => state.workspace.previewData; +export const selectPreviewFormattedData = (state: RootState) => state.workspace.previewFormattedData; // export -export const selectExportFormat = (state: Store) => state.workspace.exportFormat; -export const selectNumberOfExportRows = (state: Store) => state.workspace.numberOfExportRows; -export const selectFormatterConfig = (state: Store) => state.workspace.formatterConfig; +export const selectExportFormat = (state: RootState) => state.workspace.exportFormat; +export const selectNumberOfExportRows = (state: RootState) => state.workspace.numberOfExportRows; +export const selectFormatterConfig = (state: RootState) => state.workspace.formatterConfig; diff --git a/src/types/system.d.ts b/src/types/system.d.ts index 500de22..bb0b8d3 100644 --- a/src/types/system.d.ts +++ b/src/types/system.d.ts @@ -16,7 +16,7 @@ export interface Action { payload?: any; } -export interface Store { +export interface RootState { app: AppReducerState; workspace: WorkspaceReducerState; preview: PreviewReducerState; From d56c28ea48b7df8ce76193a7767edbedcfdc7d1e Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Mon, 12 Jun 2023 00:09:49 +1200 Subject: [PATCH 03/60] feat: exportModal UI --- package-lock.json | 25 +++++-- package.json | 3 +- .../ExportFormatConfiguratorModal.tsx | 2 +- src/components/Exporter/index.ts | 2 + .../Exporter/src/ExportModal.module.scss | 8 ++ src/components/Exporter/src/ExportModal.tsx | 74 ++++++++++++++++-- .../src/ExportProgressDash.module.scss | 27 +++++++ .../Exporter/src/ExportProgressDash.tsx | 75 +++++++++++++++++++ src/components/Exporter/src/index.tsx | 1 + .../Toolbar/src/components/GenerateButton.tsx | 18 +++-- .../Toolbar/src/components/NumOfRowInput.tsx | 2 +- src/constants/actions.ts | 1 + src/constants/core.ts | 2 +- src/locale/translations/en.ts | 9 ++- src/locale/translations/zhCN.ts | 9 ++- src/pages/workspace/index.tsx | 2 + src/reducers/app/appActions.ts | 2 - src/reducers/export/exportActions.ts | 7 ++ src/reducers/export/exportReducer.ts | 20 +++++ src/reducers/export/exportSelectors.ts | 22 ++++++ src/reducers/index.ts | 13 +++- src/reducers/preview/previewActions.ts | 2 +- src/store/index.ts | 3 +- src/styles/generators.scss | 2 +- src/types/system.d.ts | 5 ++ 25 files changed, 306 insertions(+), 30 deletions(-) create mode 100644 src/components/Exporter/src/ExportModal.module.scss create mode 100644 src/components/Exporter/src/ExportProgressDash.module.scss create mode 100644 src/components/Exporter/src/ExportProgressDash.tsx create mode 100644 src/reducers/export/exportActions.ts create mode 100644 src/reducers/export/exportSelectors.ts diff --git a/package-lock.json b/package-lock.json index 1cafe55..d3db8e8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,18 +1,18 @@ { "name": "dummyi", - "version": "1.0.0", + "version": "0.1.0", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "dummyi", - "version": "1.0.0", + "version": "0.1.0", "dependencies": { "@douyinfe/semi-next": "^2.36.0", "@douyinfe/semi-ui": "^2.36.0", "@faker-js/faker": "^8.0.2", "@reduxjs/toolkit": "^1.9.5", - "@semi-bot/semi-theme-mockdatanz": "^1.1.4", + "@semi-bot/semi-theme-mockdatanz": "^1.1.5", "@types/node": "20.1.4", "@types/react": "18.2.6", "@types/react-dom": "18.2.4", @@ -36,6 +36,7 @@ "react-intl": "^6.4.2", "react-redux": "^8.0.5", "react-reflex": "^4.1.0", + "react-sparklines": "^1.7.0", "redux-persist": "^6.0.0", "sass": "^1.62.1", "tailwindcss": "^3.3.2", @@ -1495,9 +1496,9 @@ "integrity": "sha512-sXo/qW2/pAcmT43VoRKOJbDOfV3cYpq3szSVfIThQXNt+E4DfKj361vaAt3c88U5tPUxzEswam7GW48PJqtKAg==" }, "node_modules/@semi-bot/semi-theme-mockdatanz": { - "version": "1.1.4", - "resolved": "https://registry.npmjs.org/@semi-bot/semi-theme-mockdatanz/-/semi-theme-mockdatanz-1.1.4.tgz", - "integrity": "sha512-beTeL2JyaWx3MOZs9bEgZS7R7A2VMTN74pOonxmFZiT8rCQc5D7Ywp7XkPbXirYLI9n92RUBKFRjUjUS7az74w==" + "version": "1.1.5", + "resolved": "https://registry.npmjs.org/@semi-bot/semi-theme-mockdatanz/-/semi-theme-mockdatanz-1.1.5.tgz", + "integrity": "sha512-u4JHNJlQ9yZWr45T6ZzGqjSIBSIP33oX3WpRsblDun5XuMtXN3/KJn2I2JmDTHf0N6Ix7l4KtLnvurUEFCNBpw==" }, "node_modules/@swc/helpers": { "version": "0.5.1", @@ -6792,6 +6793,18 @@ "react": "^16.0.0 || ^17.0.0 || ^18.0.0" } }, + "node_modules/react-sparklines": { + "version": "1.7.0", + "resolved": "https://registry.npmjs.org/react-sparklines/-/react-sparklines-1.7.0.tgz", + "integrity": "sha512-bJFt9K4c5Z0k44G8KtxIhbG+iyxrKjBZhdW6afP+R7EnIq+iKjbWbEFISrf3WKNFsda+C46XAfnX0StS5fbDcg==", + "dependencies": { + "prop-types": "^15.5.10" + }, + "peerDependencies": { + "react": "*", + "react-dom": "*" + } + }, "node_modules/react-window": { "version": "1.8.9", "resolved": "https://registry.npmjs.org/react-window/-/react-window-1.8.9.tgz", diff --git a/package.json b/package.json index 1742298..25fa1b1 100644 --- a/package.json +++ b/package.json @@ -14,7 +14,7 @@ "@douyinfe/semi-ui": "^2.36.0", "@faker-js/faker": "^8.0.2", "@reduxjs/toolkit": "^1.9.5", - "@semi-bot/semi-theme-mockdatanz": "^1.1.4", + "@semi-bot/semi-theme-mockdatanz": "^1.1.5", "@types/node": "20.1.4", "@types/react": "18.2.6", "@types/react-dom": "18.2.4", @@ -38,6 +38,7 @@ "react-intl": "^6.4.2", "react-redux": "^8.0.5", "react-reflex": "^4.1.0", + "react-sparklines": "^1.7.0", "redux-persist": "^6.0.0", "sass": "^1.62.1", "tailwindcss": "^3.3.2", diff --git a/src/components/ExportFormatConfigurator/src/components/ExportFormatConfiguratorModal.tsx b/src/components/ExportFormatConfigurator/src/components/ExportFormatConfiguratorModal.tsx index 442a2fd..5002a6b 100644 --- a/src/components/ExportFormatConfigurator/src/components/ExportFormatConfiguratorModal.tsx +++ b/src/components/ExportFormatConfigurator/src/components/ExportFormatConfiguratorModal.tsx @@ -48,7 +48,7 @@ export const ExportFormatConfiguratorModal: React.FC - + } onCancel={onClose}> diff --git a/src/components/Exporter/index.ts b/src/components/Exporter/index.ts index e69de29..4a96d6e 100644 --- a/src/components/Exporter/index.ts +++ b/src/components/Exporter/index.ts @@ -0,0 +1,2 @@ +import {ExportModal} from "./src"; +export {ExportModal} \ No newline at end of file diff --git a/src/components/Exporter/src/ExportModal.module.scss b/src/components/Exporter/src/ExportModal.module.scss new file mode 100644 index 0000000..325eb60 --- /dev/null +++ b/src/components/Exporter/src/ExportModal.module.scss @@ -0,0 +1,8 @@ +.exportModal__inputs { + display: flex; + align-items: center; +} + +.exportModal__estimated_number{ + margin-left: 10px; +} \ No newline at end of file diff --git a/src/components/Exporter/src/ExportModal.tsx b/src/components/Exporter/src/ExportModal.tsx index ee5c87e..fef5763 100644 --- a/src/components/Exporter/src/ExportModal.tsx +++ b/src/components/Exporter/src/ExportModal.tsx @@ -1,16 +1,80 @@ import React from 'react'; -import {Modal} from "@douyinfe/semi-ui"; -import {ExportFormatConfigurator} from "@/components/ExportFormatConfigurator"; +import {Descriptions, Divider, Modal, Typography} from "@douyinfe/semi-ui"; import {NumbOfRowInput} from "@/components/Toolbar/src/components/NumOfRowInput"; +import {useDispatch, useSelector} from "react-redux"; +import {selectEstimatedFileSize, selectShowExportModal} from "@/reducers/export/exportSelectors"; +import {doSetShowExportModal} from "@/reducers/export/exportActions"; +import {ComponentSize} from "@/constants/enums"; +import {ExportFormatConfigurator} from "@/components/ExportFormatConfigurator"; +import style from './ExportModal.module.scss'; +import {FormattedMessage} from "@/locale"; +import {OptionsInput} from "@/components/Utils"; + export interface ExportModalProps { } -export const ExportModal:React.FunctionComponent = () => { - return( - {}} onOk={()=>{}}> +export const ExportModal: React.FunctionComponent = () => { + const dispatch = useDispatch(); + const {Numeral} = Typography; + + // state + const visible = useSelector(selectShowExportModal); + const estimatedSize = useSelector(selectEstimatedFileSize); + + // action + const onCancel = () => { + dispatch(doSetShowExportModal(false)); + } + + return ( + } + onCancel={onCancel} + onOk={() => { + }} + > +
+
+
+ +
+ +
+
+
+ +
+ +
+
+ + } + value={'exportFileName'} + onChange={() => { + }} + style={{width: '260px'}} + /> + + + +
+
+ +
+
+ + {estimatedSize} + +
+
+ + {/**/} ) } \ No newline at end of file diff --git a/src/components/Exporter/src/ExportProgressDash.module.scss b/src/components/Exporter/src/ExportProgressDash.module.scss new file mode 100644 index 0000000..efa04e6 --- /dev/null +++ b/src/components/Exporter/src/ExportProgressDash.module.scss @@ -0,0 +1,27 @@ +.exportProgressDash { + display: flex; + align-items: center; +} + +.exportProgress { + width: 120px; + margin: 9px; + + .exportProgress__percent { + font-size: 18px; + font-weight: 800; + } +} + +.exportDescription { + margin: 9px; + + .exportDescription__sparkline { + margin-top: 15px; + } +} + +.divider { + height: 120px; + margin: 6px; +} diff --git a/src/components/Exporter/src/ExportProgressDash.tsx b/src/components/Exporter/src/ExportProgressDash.tsx new file mode 100644 index 0000000..9ee3697 --- /dev/null +++ b/src/components/Exporter/src/ExportProgressDash.tsx @@ -0,0 +1,75 @@ +import React from 'react'; +import {Descriptions, Divider, Progress, Typography} from "@douyinfe/semi-ui"; +import styles from './ExportProgressDash.module.scss'; +import {Sparklines, SparklinesLine} from 'react-sparklines'; +import {useSelector} from "react-redux"; +import {selectColorMode} from "@/reducers/app/appSelectors"; +import {ColorMode} from "@/constants/enums"; + +export interface ExportProgressDashProps { +} + +export const ExportProgressDash: React.FunctionComponent = () => { + const {Numeral} = Typography; + + // selectors + const colorMode = useSelector(selectColorMode); + + // parser + function parserTCH(oldVal) { + return oldVal.split(' ').map(item => + Number(item) ? `${item.replace(/(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')}` : item + ).join(' '); + } + + function parserTime(milliseconds) { + const seconds = Math.floor(milliseconds / 1000); + const minutes = Math.floor(seconds / 60); + const secondsLeft = seconds - minutes * 60; + return `${minutes}:${secondsLeft}`; + } + + return ( +
+ +
+ {per} % +
+ } + /> + + + +
+ + + + + 643888 + + + + + + 647836 + + + + +
+ + + +
+
+ +
+ ) +} \ No newline at end of file diff --git a/src/components/Exporter/src/index.tsx b/src/components/Exporter/src/index.tsx index e69de29..018d82e 100644 --- a/src/components/Exporter/src/index.tsx +++ b/src/components/Exporter/src/index.tsx @@ -0,0 +1 @@ +export * from './ExportModal'; \ No newline at end of file diff --git a/src/components/Toolbar/src/components/GenerateButton.tsx b/src/components/Toolbar/src/components/GenerateButton.tsx index 9183bec..4a87111 100644 --- a/src/components/Toolbar/src/components/GenerateButton.tsx +++ b/src/components/Toolbar/src/components/GenerateButton.tsx @@ -1,9 +1,11 @@ import React from "react"; import {Button} from "@douyinfe/semi-ui"; -import {IconPlayCircle } from "@douyinfe/semi-icons"; +import {IconPlayCircle} from "@douyinfe/semi-icons"; import Styles from "@/components/Toolbar/src/Toolbar.module.css"; -import {useIntl} from "@/locale"; +import {FormattedMessage} from "@/locale"; import {ComponentSize} from "@/constants/enums"; +import {useDispatch} from "react-redux"; +import {doSetShowExportModal} from "@/reducers/export/exportActions"; export type GenerateButtonProps = { size: ComponentSize; @@ -11,16 +13,22 @@ export type GenerateButtonProps = { export const GenerateButton: React.FC = ({...props}) => { const {size} = props; - const intl = useIntl(); + const dispatch = useDispatch(); + + // action + const openGenerateModal = () => { + dispatch(doSetShowExportModal(true)); + } return ( ) } \ No newline at end of file diff --git a/src/components/Toolbar/src/components/NumOfRowInput.tsx b/src/components/Toolbar/src/components/NumOfRowInput.tsx index 706e9db..fb63e27 100644 --- a/src/components/Toolbar/src/components/NumOfRowInput.tsx +++ b/src/components/Toolbar/src/components/NumOfRowInput.tsx @@ -36,7 +36,7 @@ export const NumbOfRowInput: React.FC = ({...props}) => { placeholder={size === 'small' ? intl.formatMessage({id: 'toolbar.numOfRowInput.suffix'}) : null} style={{ width: size === 'large' ? - '120px' : '80px', marginRight: '9px' + '150px' : '100px', marginRight: '9px' }} /> ) diff --git a/src/constants/actions.ts b/src/constants/actions.ts index e438209..9b45afb 100644 --- a/src/constants/actions.ts +++ b/src/constants/actions.ts @@ -6,6 +6,7 @@ export const SET_COLOR_MODE = 'SET_COLOR_MODE'; export const SET_NUMBER_OF_EXPORT_ROWS = 'SET_NUMBER_OF_EXPORT_ROWS'; export const SET_EXPORT_FORMAT = 'SET_EXPORT_FORMAT'; export const SET_FORMATTER_CONFIG = 'SET_FORMATTER_CONFIG'; +export const SET_SHOW_EXPORT_MODAL = 'SET_SHOW_EXPORT_MODAL'; // workspace export const SET_PANELS_DIRECTION = 'SET_PANELS_DIRECTION'; diff --git a/src/constants/core.ts b/src/constants/core.ts index 62cc856..79e4558 100644 --- a/src/constants/core.ts +++ b/src/constants/core.ts @@ -6,7 +6,7 @@ export const DEFAULT_COLOR_MODE = ColorMode.DARK; // exporter export const DEFAULT_NUMBER_EXPORT_ROWS = 100; -export const MAX_NUMBER_EXPORT_ROWS = 1000; +export const MAX_NUMBER_EXPORT_ROWS = 10000; export const MIN_NUMBER_EXPORT_ROWS = 1; // workspace diff --git a/src/locale/translations/en.ts b/src/locale/translations/en.ts index 88330ff..20a0ef2 100644 --- a/src/locale/translations/en.ts +++ b/src/locale/translations/en.ts @@ -9,10 +9,17 @@ export const en = { // export format modal "export.configurator.modal.title": "Export Format", - "export.configurator.modal.closeButton.text": "Close", + "export.configurator.modal.confirmButton.text": "Confirm", "export.configurator.config.label": "Configurations", "export.configurator.config.empty": "Configuration of this export format is currently not available.", + // export modal + "export.modal.title": "Generate", + "export.modal.exportNumOfRows.label": "Rows to generate", + "export.modal.exportFormat.label": "Export format", + "export.modal.estimatedSize.label": "Estimated size", + "export.modal.exportFileName.label": "File name", + // csv "export.configurator.csv.delimiter": "Delimiter", "export.configurator.csv.includeHeader": "Include header", diff --git a/src/locale/translations/zhCN.ts b/src/locale/translations/zhCN.ts index 1211f94..1e76495 100644 --- a/src/locale/translations/zhCN.ts +++ b/src/locale/translations/zhCN.ts @@ -8,10 +8,17 @@ export const zhCN = { // export format modal "export.configurator.modal.title": "导出格式", - "export.configurator.modal.closeButton.text": "关闭", + "export.configurator.modal.confirmButton.text": "确认", "export.configurator.config.label": "配置", "export.configurator.config.empty": "该输出格式的配置暂时还不可用", + // export modal + "export.modal.title": "生成数据", + "export.modal.exportNumOfRows.label": "生成数据行数", + "export.modal.exportFormat.label": "生成格式", + "export.modal.estimatedSize.label": "预计大小", + "export.modal.exportFileName.label": "文件名", + // csv "export.configurator.csv.delimiter": "分隔符", "export.configurator.csv.includeHeader": "包含表头", diff --git a/src/pages/workspace/index.tsx b/src/pages/workspace/index.tsx index 7630ed3..cc8f6bf 100644 --- a/src/pages/workspace/index.tsx +++ b/src/pages/workspace/index.tsx @@ -11,6 +11,7 @@ import {useIntl} from "@/locale"; import {FilesPanel} from "@/components/FilesPanel/src"; import {selectPanelsOrientation, selectPreviewData} from "@/reducers/workspace/workspaceSelectors"; import {selectColorMode} from "@/reducers/app/appSelectors"; +import {ExportModal} from "@/components/Exporter"; export default function Workspace() { const intl = useIntl(); @@ -127,6 +128,7 @@ export default function Workspace() { + ); } \ No newline at end of file diff --git a/src/reducers/app/appActions.ts b/src/reducers/app/appActions.ts index f7175f8..89643ac 100644 --- a/src/reducers/app/appActions.ts +++ b/src/reducers/app/appActions.ts @@ -1,8 +1,6 @@ import {SET_COLOR_MODE, SET_LOCALE} from "@/constants/actions"; import {ColorMode,Locales} from "@/constants/enums"; - - // change color mode export const doSetColorMode = (colorMode: ColorMode): any => async dispatch => { diff --git a/src/reducers/export/exportActions.ts b/src/reducers/export/exportActions.ts new file mode 100644 index 0000000..32ff670 --- /dev/null +++ b/src/reducers/export/exportActions.ts @@ -0,0 +1,7 @@ +import {SET_SHOW_EXPORT_MODAL} from "@/constants/actions"; + +// set show export modal +export const doSetShowExportModal = (show: boolean): any => + async dispatch => { + dispatch({type: SET_SHOW_EXPORT_MODAL, payload: show}); + }; \ No newline at end of file diff --git a/src/reducers/export/exportReducer.ts b/src/reducers/export/exportReducer.ts index e69de29..89fac8f 100644 --- a/src/reducers/export/exportReducer.ts +++ b/src/reducers/export/exportReducer.ts @@ -0,0 +1,20 @@ +import {Action, ExportReducerState} from "@/types/system"; +import {SET_SHOW_EXPORT_MODAL} from "@/constants/actions"; + + +export const initStates: ExportReducerState = { + showExportModal: false, +} + +// eslint-disable-next-line import/no-anonymous-default-export +export default (state: ExportReducerState = initStates, action: Action) => { + switch (action.type) { + case SET_SHOW_EXPORT_MODAL: + return { + ...state, + showExportModal: action.payload + }; + default: + return state; + } +} diff --git a/src/reducers/export/exportSelectors.ts b/src/reducers/export/exportSelectors.ts new file mode 100644 index 0000000..9100771 --- /dev/null +++ b/src/reducers/export/exportSelectors.ts @@ -0,0 +1,22 @@ +import {RootState} from "@/types/system"; +import {createSelector} from "reselect"; +import { + selectCurrentDataTypeSelectModalTargetFieldId, + selectDataFields, selectNumberOfExportRows, + selectPreviewFormattedData +} from "@/reducers/workspace/workspaceSelectors"; + +export const selectShowExportModal = (state: RootState) => state.export.showExportModal; + +export const selectEstimatedFileSize = createSelector( + selectPreviewFormattedData, + selectNumberOfExportRows, + (previewFormattedData, numberOfExportRows) => { + if (previewFormattedData.length === 0) { + return 0; + } + const averageRowSize = previewFormattedData.length / 20; + return averageRowSize * numberOfExportRows; + } +); + diff --git a/src/reducers/index.ts b/src/reducers/index.ts index 2828ba2..ec87459 100644 --- a/src/reducers/index.ts +++ b/src/reducers/index.ts @@ -1,12 +1,12 @@ import {combineReducers} from "redux"; -import {RootState, Action} from "@/types/system"; import storage from "@/store/storage"; // reducers +import {persistReducer} from "redux-persist"; import app from "@/reducers/app/appReducer"; import workspace from "@/reducers/workspace/workspaceReducer"; import preview from "@/reducers/preview/previewReducer"; -import {persistReducer} from "redux-persist"; +import exportReducer from "@/reducers/export/exportReducer"; // persist const appPersistConfig = { @@ -24,10 +24,17 @@ const previewPersistConfig = { storage: storage } +const exportPersistConfig = { + key: 'export', + storage: storage, + blacklist: ['showExportModal'] +} + const rootReducer = combineReducers({ app: persistReducer(appPersistConfig, app), workspace: persistReducer(workspacePersistConfig, workspace), - preview: persistReducer(previewPersistConfig, preview) + preview: persistReducer(previewPersistConfig, preview), + export: persistReducer(exportPersistConfig, exportReducer), }); diff --git a/src/reducers/preview/previewActions.ts b/src/reducers/preview/previewActions.ts index e78eaad..2725848 100644 --- a/src/reducers/preview/previewActions.ts +++ b/src/reducers/preview/previewActions.ts @@ -5,7 +5,7 @@ import { SET_RAW_VIEW_LINE_WRAP, SET_RAW_VIEW_SHOW_LINE_NUMBERS } from "@/constants/actions"; -import {PanelsOrientation, PreviewType} from "@/constants/enums"; +import {PreviewType} from "@/constants/enums"; // set rawPreview show line numbers diff --git a/src/store/index.ts b/src/store/index.ts index a3203b9..33a4d52 100644 --- a/src/store/index.ts +++ b/src/store/index.ts @@ -14,7 +14,8 @@ import { const persistConfig = { key: 'root', - storage: storage + storage: storage, + blacklist: ['export'] }; const persistedReducer = persistReducer(persistConfig, rootReducer) diff --git a/src/styles/generators.scss b/src/styles/generators.scss index bdf699b..669b077 100644 --- a/src/styles/generators.scss +++ b/src/styles/generators.scss @@ -4,7 +4,7 @@ flex-direction: column; .generatorConfig_column__label{ - color: var(--semi-color-text-0); + color: var(--semi-color-text-2); font-weight: normal; font-size: small; margin-left: 6px; diff --git a/src/types/system.d.ts b/src/types/system.d.ts index bb0b8d3..944bbcf 100644 --- a/src/types/system.d.ts +++ b/src/types/system.d.ts @@ -20,6 +20,7 @@ export interface RootState { app: AppReducerState; workspace: WorkspaceReducerState; preview: PreviewReducerState; + export: ExportReducerState; } export interface AppReducerState { @@ -51,6 +52,10 @@ export interface PreviewReducerState { rawViewFontSize: number; } +export interface ExportReducerState { + showExportModal: boolean; +} + // locales export type IntlMessageKeys = keyof typeof enTranslations; export type FormatMessageArgs = Parameters; From f8dc17ee2d481cf10fe45997febb01d14e74a88d Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Mon, 12 Jun 2023 00:57:29 +1200 Subject: [PATCH 04/60] feat: export preview error validation --- src/components/Exporter/src/ExportModal.tsx | 59 +++--------- src/components/Exporter/src/ExportPreview.tsx | 96 +++++++++++++++++++ .../Toolbar/src/components/NumOfRowInput.tsx | 36 ++++--- src/components/Utils/src/OptionsInput.tsx | 4 +- src/constants/actions.ts | 1 + src/core/formatters/Csv/index.ts | 3 +- src/core/formatters/JavaScript/index.ts | 3 +- src/core/formatters/Json/index.ts | 1 + src/core/formatters/Xml/index.ts | 1 + src/locale/translations/en.ts | 2 + src/locale/translations/zhCN.ts | 2 + src/reducers/export/exportActions.ts | 8 +- src/reducers/export/exportReducer.ts | 9 +- src/reducers/export/exportSelectors.ts | 5 +- src/types/formatter.d.ts | 1 + src/types/system.d.ts | 1 + src/utils/formatterUtils.ts | 7 +- src/utils/typeUtils.ts | 4 + 18 files changed, 173 insertions(+), 70 deletions(-) create mode 100644 src/components/Exporter/src/ExportPreview.tsx diff --git a/src/components/Exporter/src/ExportModal.tsx b/src/components/Exporter/src/ExportModal.tsx index fef5763..220c7ff 100644 --- a/src/components/Exporter/src/ExportModal.tsx +++ b/src/components/Exporter/src/ExportModal.tsx @@ -1,27 +1,24 @@ import React from 'react'; -import {Descriptions, Divider, Modal, Typography} from "@douyinfe/semi-ui"; -import {NumbOfRowInput} from "@/components/Toolbar/src/components/NumOfRowInput"; +import {Modal} from "@douyinfe/semi-ui"; import {useDispatch, useSelector} from "react-redux"; -import {selectEstimatedFileSize, selectShowExportModal} from "@/reducers/export/exportSelectors"; +import {selectEstimatedFileSize, selectExportFileName, selectShowExportModal} from "@/reducers/export/exportSelectors"; import {doSetShowExportModal} from "@/reducers/export/exportActions"; -import {ComponentSize} from "@/constants/enums"; -import {ExportFormatConfigurator} from "@/components/ExportFormatConfigurator"; -import style from './ExportModal.module.scss'; import {FormattedMessage} from "@/locale"; -import {OptionsInput} from "@/components/Utils"; +import {selectExportFormat, selectNumberOfExportRows} from "@/reducers/workspace/workspaceSelectors"; +import {ExportPreview} from "@/components/Exporter/src/ExportPreview"; -export interface ExportModalProps { - -} +export interface ExportModalProps {} export const ExportModal: React.FunctionComponent = () => { const dispatch = useDispatch(); - const {Numeral} = Typography; // state const visible = useSelector(selectShowExportModal); const estimatedSize = useSelector(selectEstimatedFileSize); + const format = useSelector(selectExportFormat); + const exportFileName = useSelector(selectExportFileName); + const exportNumOfRows = useSelector(selectNumberOfExportRows); // action const onCancel = () => { @@ -37,43 +34,13 @@ export const ExportModal: React.FunctionComponent = () => { onOk={() => { }} > -
-
-
- -
- -
-
-
- -
- -
-
- - } - value={'exportFileName'} - onChange={() => { - }} - style={{width: '260px'}} + - - -
-
- -
-
- - {estimatedSize} - -
-
- - {/**/} ) diff --git a/src/components/Exporter/src/ExportPreview.tsx b/src/components/Exporter/src/ExportPreview.tsx new file mode 100644 index 0000000..9c67e76 --- /dev/null +++ b/src/components/Exporter/src/ExportPreview.tsx @@ -0,0 +1,96 @@ +import React from 'react'; +import {ComponentSize, ExportFormat} from "@/constants/enums"; +import style from "@/components/Exporter/src/ExportModal.module.scss"; +import {FormattedMessage, useIntl} from "@/locale"; +import {NumbOfRowInput} from "@/components/Toolbar/src/components/NumOfRowInput"; +import {ExportFormatConfigurator} from "@/components/ExportFormatConfigurator"; +import {OptionsInput} from "@/components/Utils"; +import {getFileExtensionByFormat} from "@/utils/formatterUtils"; +import {Divider, Typography} from "@douyinfe/semi-ui"; +import {doSetExportFileName} from "@/reducers/export/exportActions"; +import {useDispatch} from "react-redux"; +import {isNullOrWhiteSpace} from "@/utils/stringUtils"; +import {isNullOrUndefined} from "@/utils/typeUtils"; + +export interface ExportPreviewProps { + exportNumOfRows: number; + exportFileName: string; + estimatedSize: number; + format: ExportFormat; +} + +export const ExportPreview: React.FunctionComponent = ({...props}) => { + const {exportFileName, estimatedSize, format, exportNumOfRows} = props; + const {Numeral} = Typography; + const dispatch = useDispatch(); + const intl = useIntl(); + + // actions + const onChangeExportFileName = (value: string) => { + dispatch(doSetExportFileName(value)); + } + + // error validation + const [errorMessages, setErrorMessages] = React.useState({ + exportNumOfRows: '', + exportFileName: '', + }); + + React.useEffect(() => { + const newErrorMessages = {...errorMessages}; + if (isNullOrWhiteSpace(exportFileName)) { + newErrorMessages.exportFileName = intl.formatMessage({id: 'export.modal.exportFileName.empty'}); + } else { + newErrorMessages.exportFileName = ''; + } + + if (isNullOrUndefined(exportNumOfRows)) { + newErrorMessages.exportNumOfRows = intl.formatMessage({id: 'export.modal.exportNumOfRows.empty'}); + } else { + newErrorMessages.exportNumOfRows = ''; + } + + setErrorMessages(newErrorMessages); + }, [exportFileName, exportNumOfRows]); + + return ( +
+
+
+
+ +
+ +
+
+
+ +
+ +
+
+ + } + value={exportFileName} + errorMessage={errorMessages.exportFileName} + suffix={`.${getFileExtensionByFormat(format)}`} + onChange={onChangeExportFileName} + style={{width: '260px'}} + /> + + + +
+
+ +
+
+ + {estimatedSize} + +
+
+
+ ); +} \ No newline at end of file diff --git a/src/components/Toolbar/src/components/NumOfRowInput.tsx b/src/components/Toolbar/src/components/NumOfRowInput.tsx index fb63e27..f0e9ace 100644 --- a/src/components/Toolbar/src/components/NumOfRowInput.tsx +++ b/src/components/Toolbar/src/components/NumOfRowInput.tsx @@ -6,14 +6,17 @@ import {doSetNumberOfExportRows} from "@/reducers/workspace/workspaceActions"; import {MAX_NUMBER_EXPORT_ROWS, MIN_NUMBER_EXPORT_ROWS} from "@/constants/core"; import {ComponentSize} from "@/constants/enums"; import {selectNumberOfExportRows} from "@/reducers/workspace/workspaceSelectors"; +import {ErrorTooltip} from "@/components/Utils"; +import {isNullOrWhiteSpace} from "@/utils/stringUtils"; export type NumbOfRowInputProps = { - size: ComponentSize + size: ComponentSize, + errorMessage?: string, } export const NumbOfRowInput: React.FC = ({...props}) => { - const {size} = props; + const {size, errorMessage} = props; const intl = useIntl(); const dispatch = useDispatch(); @@ -26,19 +29,22 @@ export const NumbOfRowInput: React.FC = ({...props}) => { } return ( - + + + ) } diff --git a/src/components/Utils/src/OptionsInput.tsx b/src/components/Utils/src/OptionsInput.tsx index c9c6164..c54aeb4 100644 --- a/src/components/Utils/src/OptionsInput.tsx +++ b/src/components/Utils/src/OptionsInput.tsx @@ -7,13 +7,14 @@ export interface OptionsInputProps { label: string | React.ReactNode; infoTooltip?: string | React.ReactNode; errorMessage?: string; + suffix?: string | React.ReactNode; value: string; onChange: (value: any) => void; style?: React.CSSProperties; } export const OptionsInput: React.FunctionComponent = ({...props}) => { - const {label, infoTooltip, errorMessage, value, style, onChange} = props; + const {label, infoTooltip, errorMessage, value, style, suffix, onChange} = props; return (
@@ -28,6 +29,7 @@ export const OptionsInput: React.FunctionComponent = ({...pro onChange={(value) => onChange(value)} value={value} style={style} + suffix={suffix} validateStatus={!isNullOrWhiteSpace(errorMessage) ? 'error' : 'default'} /> diff --git a/src/constants/actions.ts b/src/constants/actions.ts index 9b45afb..ff5c10e 100644 --- a/src/constants/actions.ts +++ b/src/constants/actions.ts @@ -7,6 +7,7 @@ export const SET_NUMBER_OF_EXPORT_ROWS = 'SET_NUMBER_OF_EXPORT_ROWS'; export const SET_EXPORT_FORMAT = 'SET_EXPORT_FORMAT'; export const SET_FORMATTER_CONFIG = 'SET_FORMATTER_CONFIG'; export const SET_SHOW_EXPORT_MODAL = 'SET_SHOW_EXPORT_MODAL'; +export const SET_EXPORT_FILE_NAME = 'SET_EXPORT_FILE_NAME'; // workspace export const SET_PANELS_DIRECTION = 'SET_PANELS_DIRECTION'; diff --git a/src/core/formatters/Csv/index.ts b/src/core/formatters/Csv/index.ts index 08bfef5..d8e5f39 100644 --- a/src/core/formatters/Csv/index.ts +++ b/src/core/formatters/Csv/index.ts @@ -8,5 +8,6 @@ export const CsvFormatter: Formatter = { category: ExportFormatCategory.FILE_TYPES, format: format, configComponent: CsvConfigComponent, - defaultConfig: defaultCsvFormatterConfig + defaultConfig: defaultCsvFormatterConfig, + fileExtension: 'csv' }; \ No newline at end of file diff --git a/src/core/formatters/JavaScript/index.ts b/src/core/formatters/JavaScript/index.ts index 73cb608..8a37875 100644 --- a/src/core/formatters/JavaScript/index.ts +++ b/src/core/formatters/JavaScript/index.ts @@ -6,5 +6,6 @@ import {JavaScriptConfig} from "@/core/formatters/JavaScript/JavaScript.config"; export const JavaScriptFormatter: Formatter = { type: ExportFormat.JAVA_SCRIPT, category: ExportFormatCategory.PROGRAMMING_LANGUAGES, - format: format + format: format, + fileExtension: 'js', } \ No newline at end of file diff --git a/src/core/formatters/Json/index.ts b/src/core/formatters/Json/index.ts index 61e0cf0..cec4385 100644 --- a/src/core/formatters/Json/index.ts +++ b/src/core/formatters/Json/index.ts @@ -6,6 +6,7 @@ export const JsonFormatter: Formatter = { type: ExportFormat.JSON, category: ExportFormatCategory.FILE_TYPES, format: format, + fileExtension: 'json', configComponent: JsonConfigComponent, defaultConfig: defaultJsonFormatterConfig }; \ No newline at end of file diff --git a/src/core/formatters/Xml/index.ts b/src/core/formatters/Xml/index.ts index 29a08a8..81d0ba0 100644 --- a/src/core/formatters/Xml/index.ts +++ b/src/core/formatters/Xml/index.ts @@ -7,6 +7,7 @@ export const XmlFormatter: Formatter = { type: ExportFormat.XML, category: ExportFormatCategory.FILE_TYPES, format: format, + fileExtension: 'xml', configComponent: XmlConfigComponent, defaultConfig: defaultXmlFormatterConfig, } \ No newline at end of file diff --git a/src/locale/translations/en.ts b/src/locale/translations/en.ts index 20a0ef2..08be3a5 100644 --- a/src/locale/translations/en.ts +++ b/src/locale/translations/en.ts @@ -16,9 +16,11 @@ export const en = { // export modal "export.modal.title": "Generate", "export.modal.exportNumOfRows.label": "Rows to generate", + "export.modal.exportNumOfRows.empty": "Rows to generate cannot be empty", "export.modal.exportFormat.label": "Export format", "export.modal.estimatedSize.label": "Estimated size", "export.modal.exportFileName.label": "File name", + "export.modal.exportFileName.empty": "File name cannot be empty", // csv "export.configurator.csv.delimiter": "Delimiter", diff --git a/src/locale/translations/zhCN.ts b/src/locale/translations/zhCN.ts index 1e76495..73091bd 100644 --- a/src/locale/translations/zhCN.ts +++ b/src/locale/translations/zhCN.ts @@ -15,9 +15,11 @@ export const zhCN = { // export modal "export.modal.title": "生成数据", "export.modal.exportNumOfRows.label": "生成数据行数", + "export.modal.exportNumOfRows.empty": "生成数据行数不能为空", "export.modal.exportFormat.label": "生成格式", "export.modal.estimatedSize.label": "预计大小", "export.modal.exportFileName.label": "文件名", + "export.modal.exportFileName.empty": "文件名不能为空", // csv "export.configurator.csv.delimiter": "分隔符", diff --git a/src/reducers/export/exportActions.ts b/src/reducers/export/exportActions.ts index 32ff670..62c0514 100644 --- a/src/reducers/export/exportActions.ts +++ b/src/reducers/export/exportActions.ts @@ -1,7 +1,13 @@ -import {SET_SHOW_EXPORT_MODAL} from "@/constants/actions"; +import {SET_EXPORT_FILE_NAME, SET_SHOW_EXPORT_MODAL} from "@/constants/actions"; // set show export modal export const doSetShowExportModal = (show: boolean): any => async dispatch => { dispatch({type: SET_SHOW_EXPORT_MODAL, payload: show}); + }; + +// set export file name +export const doSetExportFileName = (fileName: string): any => + async dispatch => { + dispatch({type: SET_EXPORT_FILE_NAME, payload: fileName}); }; \ No newline at end of file diff --git a/src/reducers/export/exportReducer.ts b/src/reducers/export/exportReducer.ts index 89fac8f..fe8401a 100644 --- a/src/reducers/export/exportReducer.ts +++ b/src/reducers/export/exportReducer.ts @@ -1,9 +1,9 @@ import {Action, ExportReducerState} from "@/types/system"; -import {SET_SHOW_EXPORT_MODAL} from "@/constants/actions"; - +import {SET_EXPORT_FILE_NAME, SET_SHOW_EXPORT_MODAL} from "@/constants/actions"; export const initStates: ExportReducerState = { showExportModal: false, + exportFileName: 'data-export', } // eslint-disable-next-line import/no-anonymous-default-export @@ -14,6 +14,11 @@ export default (state: ExportReducerState = initStates, action: Action) => { ...state, showExportModal: action.payload }; + case SET_EXPORT_FILE_NAME: + return { + ...state, + exportFileName: action.payload + } default: return state; } diff --git a/src/reducers/export/exportSelectors.ts b/src/reducers/export/exportSelectors.ts index 9100771..fda4498 100644 --- a/src/reducers/export/exportSelectors.ts +++ b/src/reducers/export/exportSelectors.ts @@ -1,13 +1,14 @@ import {RootState} from "@/types/system"; import {createSelector} from "reselect"; import { - selectCurrentDataTypeSelectModalTargetFieldId, - selectDataFields, selectNumberOfExportRows, + selectNumberOfExportRows, selectPreviewFormattedData } from "@/reducers/workspace/workspaceSelectors"; export const selectShowExportModal = (state: RootState) => state.export.showExportModal; +export const selectExportFileName = (state: RootState) => state.export.exportFileName; + export const selectEstimatedFileSize = createSelector( selectPreviewFormattedData, selectNumberOfExportRows, diff --git a/src/types/formatter.d.ts b/src/types/formatter.d.ts index 53e6e0a..4c2e7ea 100644 --- a/src/types/formatter.d.ts +++ b/src/types/formatter.d.ts @@ -7,6 +7,7 @@ export interface Formatter { type: ExportType; category: ExportTypeCategory; format: (request: FormatRequest) => string; + fileExtension: string; configComponent?: React.FunctionComponent; defaultConfig?: any; } diff --git a/src/types/system.d.ts b/src/types/system.d.ts index 944bbcf..87d9ca7 100644 --- a/src/types/system.d.ts +++ b/src/types/system.d.ts @@ -54,6 +54,7 @@ export interface PreviewReducerState { export interface ExportReducerState { showExportModal: boolean; + exportFileName: string; } // locales diff --git a/src/utils/formatterUtils.ts b/src/utils/formatterUtils.ts index 39727cb..d5881c8 100644 --- a/src/utils/formatterUtils.ts +++ b/src/utils/formatterUtils.ts @@ -31,11 +31,16 @@ export const getFormatterByFormat = (format: ExportFormat): Formatter => { return formatters[format]; } -// Gey formatter config component by format +// Get formatter config component by format export const getFormatterConfigComponentByFormat = (format: ExportFormat): any => { return formatters[format].configComponent; } +// Get file extension by format +export const getFileExtensionByFormat = (format: ExportFormat): string => { + return formatters[format].fileExtension; +} + // Get codemirror language plugin by format export const getCodemirrorLanguagePluginByFormat = (format: ExportFormat): any => { switch (format) { diff --git a/src/utils/typeUtils.ts b/src/utils/typeUtils.ts index fb13df7..7b479b1 100644 --- a/src/utils/typeUtils.ts +++ b/src/utils/typeUtils.ts @@ -2,4 +2,8 @@ // e.g. true -> 'true', false -> 'false' export const boolToString = (value: boolean): string => { return value ? 'true' : 'false'; +} + +export const isNullOrUndefined = (value: any): boolean => { + return value === null || value === undefined || value === ''; } \ No newline at end of file From 928d97007e5c7e93812e3427d8cb8ea52d737731 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Tue, 13 Jun 2023 11:22:03 +1200 Subject: [PATCH 05/60] refactor: split ExportModal components --- src/components/Exporter/src/Export.tsx | 0 src/components/Exporter/src/ExportModal.tsx | 72 +++++++++++++++---- src/components/Exporter/src/ExportPreview.tsx | 19 ++--- .../Exporter/src/ExportProgressDash.tsx | 7 +- .../src/components/DataFieldsListItem.tsx | 2 +- .../Toolbar/src/components/NumOfRowInput.tsx | 2 +- src/constants/actions.ts | 1 + src/constants/{core.ts => config.ts} | 3 +- src/constants/enums.ts | 8 ++- src/locale/translations/en.ts | 5 ++ src/locale/translations/zhCN.ts | 5 ++ src/reducers/app/appReducer.ts | 8 +-- src/reducers/export/exportActions.ts | 9 ++- src/reducers/export/exportReducer.ts | 19 +++-- src/reducers/export/exportSelectors.ts | 29 ++++++-- src/reducers/index.ts | 2 +- src/reducers/preview/previewReducer.ts | 7 +- src/reducers/workspace/workspaceReducer.ts | 13 ++-- src/types/system.d.ts | 3 +- src/utils/typeUtils.ts | 14 ++-- 20 files changed, 165 insertions(+), 63 deletions(-) create mode 100644 src/components/Exporter/src/Export.tsx rename src/constants/{core.ts => config.ts} (84%) diff --git a/src/components/Exporter/src/Export.tsx b/src/components/Exporter/src/Export.tsx new file mode 100644 index 0000000..e69de29 diff --git a/src/components/Exporter/src/ExportModal.tsx b/src/components/Exporter/src/ExportModal.tsx index 220c7ff..b943216 100644 --- a/src/components/Exporter/src/ExportModal.tsx +++ b/src/components/Exporter/src/ExportModal.tsx @@ -1,14 +1,22 @@ import React from 'react'; -import {Modal} from "@douyinfe/semi-ui"; +import {Button, Modal} from "@douyinfe/semi-ui"; import {useDispatch, useSelector} from "react-redux"; -import {selectEstimatedFileSize, selectExportFileName, selectShowExportModal} from "@/reducers/export/exportSelectors"; -import {doSetShowExportModal} from "@/reducers/export/exportActions"; +import { + selectEstimatedFileSize, + selectExportFileName, + selectExportProcessStage, + selectShowExportModal +} from "@/reducers/export/exportSelectors"; +import {doSetExportProcessStage, doSetShowExportModal} from "@/reducers/export/exportActions"; import {FormattedMessage} from "@/locale"; import {selectExportFormat, selectNumberOfExportRows} from "@/reducers/workspace/workspaceSelectors"; import {ExportPreview} from "@/components/Exporter/src/ExportPreview"; +import {ExportProcessStage} from "@/constants/enums"; +import {ExportProgressDash} from "@/components/Exporter/src/ExportProgressDash"; -export interface ExportModalProps {} +export interface ExportModalProps { +} export const ExportModal: React.FunctionComponent = () => { const dispatch = useDispatch(); @@ -19,29 +27,65 @@ export const ExportModal: React.FunctionComponent = () => { const format = useSelector(selectExportFormat); const exportFileName = useSelector(selectExportFileName); const exportNumOfRows = useSelector(selectNumberOfExportRows); + const exportProcessStage = useSelector(selectExportProcessStage); + + // action const onCancel = () => { dispatch(doSetShowExportModal(false)); } + const onGenerate = () => { + dispatch(doSetExportProcessStage(ExportProcessStage.GENERATING)); + } + + // render + const renderModalContent = () => { + switch (exportProcessStage) { + case ExportProcessStage.PREVIEW: + return + case ExportProcessStage.GENERATING: + return + + } + } + + const renderModalFooter = () => { + switch (exportProcessStage) { + case ExportProcessStage.PREVIEW: + return <> + + + + case ExportProcessStage.GENERATING: + return <> + + + + } + } + return ( } onCancel={onCancel} - onOk={() => { - }} + footer={renderModalFooter()} > - - - {/**/} + {renderModalContent()} ) } \ No newline at end of file diff --git a/src/components/Exporter/src/ExportPreview.tsx b/src/components/Exporter/src/ExportPreview.tsx index 9c67e76..c4e758b 100644 --- a/src/components/Exporter/src/ExportPreview.tsx +++ b/src/components/Exporter/src/ExportPreview.tsx @@ -80,15 +80,16 @@ export const ExportPreview: React.FunctionComponent = ({...p /> - -
-
- -
-
- - {estimatedSize} - +
+
+
+ +
+
+ + {estimatedSize} + +
diff --git a/src/components/Exporter/src/ExportProgressDash.tsx b/src/components/Exporter/src/ExportProgressDash.tsx index 9ee3697..6519a1c 100644 --- a/src/components/Exporter/src/ExportProgressDash.tsx +++ b/src/components/Exporter/src/ExportProgressDash.tsx @@ -5,6 +5,7 @@ import {Sparklines, SparklinesLine} from 'react-sparklines'; import {useSelector} from "react-redux"; import {selectColorMode} from "@/reducers/app/appSelectors"; import {ColorMode} from "@/constants/enums"; +import {FormattedMessage} from "@/locale"; export interface ExportProgressDashProps { } @@ -47,16 +48,16 @@ export const ExportProgressDash: React.FunctionComponent -
+
- + }> 643888 - + }> 647836 diff --git a/src/components/InputPanel/src/components/DataFieldsListItem.tsx b/src/components/InputPanel/src/components/DataFieldsListItem.tsx index 932ff42..55578c4 100644 --- a/src/components/InputPanel/src/components/DataFieldsListItem.tsx +++ b/src/components/InputPanel/src/components/DataFieldsListItem.tsx @@ -145,7 +145,7 @@ export const DataFieldsListItem: React.FunctionComponent} onClick={handleOpenDataTypeOptionsModal} style={{width: 80}} - icon={} + icon={} />} )} diff --git a/src/components/Toolbar/src/components/NumOfRowInput.tsx b/src/components/Toolbar/src/components/NumOfRowInput.tsx index f0e9ace..de32cba 100644 --- a/src/components/Toolbar/src/components/NumOfRowInput.tsx +++ b/src/components/Toolbar/src/components/NumOfRowInput.tsx @@ -3,7 +3,7 @@ import {InputNumber} from "@douyinfe/semi-ui"; import {useIntl} from "@/locale"; import {useDispatch, useSelector} from "react-redux"; import {doSetNumberOfExportRows} from "@/reducers/workspace/workspaceActions"; -import {MAX_NUMBER_EXPORT_ROWS, MIN_NUMBER_EXPORT_ROWS} from "@/constants/core"; +import {MAX_NUMBER_EXPORT_ROWS, MIN_NUMBER_EXPORT_ROWS} from "@/constants/config"; import {ComponentSize} from "@/constants/enums"; import {selectNumberOfExportRows} from "@/reducers/workspace/workspaceSelectors"; import {ErrorTooltip} from "@/components/Utils"; diff --git a/src/constants/actions.ts b/src/constants/actions.ts index ff5c10e..39a603c 100644 --- a/src/constants/actions.ts +++ b/src/constants/actions.ts @@ -8,6 +8,7 @@ export const SET_EXPORT_FORMAT = 'SET_EXPORT_FORMAT'; export const SET_FORMATTER_CONFIG = 'SET_FORMATTER_CONFIG'; export const SET_SHOW_EXPORT_MODAL = 'SET_SHOW_EXPORT_MODAL'; export const SET_EXPORT_FILE_NAME = 'SET_EXPORT_FILE_NAME'; +export const SET_EXPORT_PROCESS_STAGE = 'SET_EXPORT_PROCESS_STAGE'; // workspace export const SET_PANELS_DIRECTION = 'SET_PANELS_DIRECTION'; diff --git a/src/constants/core.ts b/src/constants/config.ts similarity index 84% rename from src/constants/core.ts rename to src/constants/config.ts index 79e4558..e14ba11 100644 --- a/src/constants/core.ts +++ b/src/constants/config.ts @@ -6,8 +6,9 @@ export const DEFAULT_COLOR_MODE = ColorMode.DARK; // exporter export const DEFAULT_NUMBER_EXPORT_ROWS = 100; -export const MAX_NUMBER_EXPORT_ROWS = 10000; +export const MAX_NUMBER_EXPORT_ROWS = 999999; export const MIN_NUMBER_EXPORT_ROWS = 1; +export const DEFAULT_EXPORT_FILE_NAME = 'data-export'; // workspace export const DEFAULT_PANELS_ORIENTATION = PanelsOrientation.HORIZONTAL; diff --git a/src/constants/enums.ts b/src/constants/enums.ts index d824c53..75bf051 100644 --- a/src/constants/enums.ts +++ b/src/constants/enums.ts @@ -1,5 +1,5 @@ -// format data +// export format export enum ExportFormatCategory { FILE_TYPES = "fileTypes", PROGRAMMING_LANGUAGES = "programmingLanguages", @@ -20,6 +20,12 @@ export enum ExportValueType { NULL = "null" } +export enum ExportProcessStage{ + PREVIEW = "preview", + GENERATING = "generating", + COMPLETED = "completed", +} + // data types export enum DataTypeCategory { ALL= "all", diff --git a/src/locale/translations/en.ts b/src/locale/translations/en.ts index 08be3a5..d1f77a5 100644 --- a/src/locale/translations/en.ts +++ b/src/locale/translations/en.ts @@ -19,8 +19,13 @@ export const en = { "export.modal.exportNumOfRows.empty": "Rows to generate cannot be empty", "export.modal.exportFormat.label": "Export format", "export.modal.estimatedSize.label": "Estimated size", + "export.modal.estimatedTime.label": "Estimated time", "export.modal.exportFileName.label": "File name", "export.modal.exportFileName.empty": "File name cannot be empty", + "export.modal.cancel.button.text": "Cancel", + "export.modal.generate.button.text": "Generate", + "export.modal.generating.rows.text": "Rows", + "export.modal.generating.time.text": "Time", // csv "export.configurator.csv.delimiter": "Delimiter", diff --git a/src/locale/translations/zhCN.ts b/src/locale/translations/zhCN.ts index 73091bd..1fcffaf 100644 --- a/src/locale/translations/zhCN.ts +++ b/src/locale/translations/zhCN.ts @@ -18,8 +18,13 @@ export const zhCN = { "export.modal.exportNumOfRows.empty": "生成数据行数不能为空", "export.modal.exportFormat.label": "生成格式", "export.modal.estimatedSize.label": "预计大小", + "export.modal.estimatedTime.label": "预计时间", "export.modal.exportFileName.label": "文件名", "export.modal.exportFileName.empty": "文件名不能为空", + "export.modal.cancel.button.text": "取消", + "export.modal.generate.button.text": "生成", + "export.modal.generating.rows.text": "行数", + "export.modal.generating.time.text": "时间", // csv "export.configurator.csv.delimiter": "分隔符", diff --git a/src/reducers/app/appReducer.ts b/src/reducers/app/appReducer.ts index f25c529..7fbe7bb 100644 --- a/src/reducers/app/appReducer.ts +++ b/src/reducers/app/appReducer.ts @@ -1,14 +1,13 @@ import {Action, AppReducerState} from "@/types/system"; import {SET_COLOR_MODE, SET_LOCALE} from "@/constants/actions"; -import {DEFAULT_COLOR_MODE, DEFAULT_LOCALE} from "@/constants/core"; +import {DEFAULT_COLOR_MODE, DEFAULT_LOCALE} from "@/constants/config"; export const initStates: AppReducerState = { locale:DEFAULT_LOCALE, colorMode: DEFAULT_COLOR_MODE } -// eslint-disable-next-line import/no-anonymous-default-export -export default (state: AppReducerState = initStates, action: Action) => { +const appReducer = (state: AppReducerState = initStates, action: Action) => { switch (action.type) { case SET_LOCALE: return { @@ -23,6 +22,7 @@ export default (state: AppReducerState = initStates, action: Action) => { default: return state; } -} +}; +export default appReducer; diff --git a/src/reducers/export/exportActions.ts b/src/reducers/export/exportActions.ts index 62c0514..3d59230 100644 --- a/src/reducers/export/exportActions.ts +++ b/src/reducers/export/exportActions.ts @@ -1,4 +1,5 @@ -import {SET_EXPORT_FILE_NAME, SET_SHOW_EXPORT_MODAL} from "@/constants/actions"; +import {SET_EXPORT_FILE_NAME, SET_EXPORT_PROCESS_STAGE, SET_SHOW_EXPORT_MODAL} from "@/constants/actions"; +import {ExportProcessStage} from "@/constants/enums"; // set show export modal export const doSetShowExportModal = (show: boolean): any => @@ -10,4 +11,10 @@ export const doSetShowExportModal = (show: boolean): any => export const doSetExportFileName = (fileName: string): any => async dispatch => { dispatch({type: SET_EXPORT_FILE_NAME, payload: fileName}); + }; + +// set export process stage +export const doSetExportProcessStage = (stage: ExportProcessStage): any => + async dispatch => { + dispatch({type: SET_EXPORT_PROCESS_STAGE, payload: stage}); }; \ No newline at end of file diff --git a/src/reducers/export/exportReducer.ts b/src/reducers/export/exportReducer.ts index fe8401a..cc12556 100644 --- a/src/reducers/export/exportReducer.ts +++ b/src/reducers/export/exportReducer.ts @@ -1,13 +1,15 @@ import {Action, ExportReducerState} from "@/types/system"; -import {SET_EXPORT_FILE_NAME, SET_SHOW_EXPORT_MODAL} from "@/constants/actions"; +import {SET_EXPORT_FILE_NAME, SET_EXPORT_PROCESS_STAGE, SET_SHOW_EXPORT_MODAL} from "@/constants/actions"; +import {ExportProcessStage} from "@/constants/enums"; +import {DEFAULT_EXPORT_FILE_NAME} from "@/constants/config"; export const initStates: ExportReducerState = { showExportModal: false, - exportFileName: 'data-export', + exportFileName: DEFAULT_EXPORT_FILE_NAME, + exportProcessStage: ExportProcessStage.PREVIEW } -// eslint-disable-next-line import/no-anonymous-default-export -export default (state: ExportReducerState = initStates, action: Action) => { +const exportReducer = (state: ExportReducerState = initStates, action: Action) => { switch (action.type) { case SET_SHOW_EXPORT_MODAL: return { @@ -18,8 +20,15 @@ export default (state: ExportReducerState = initStates, action: Action) => { return { ...state, exportFileName: action.payload + }; + case SET_EXPORT_PROCESS_STAGE: + return { + ...state, + exportProcessStage: action.payload } default: return state; } -} +}; + +export default exportReducer; diff --git a/src/reducers/export/exportSelectors.ts b/src/reducers/export/exportSelectors.ts index fda4498..924e4f5 100644 --- a/src/reducers/export/exportSelectors.ts +++ b/src/reducers/export/exportSelectors.ts @@ -1,14 +1,17 @@ import {RootState} from "@/types/system"; import {createSelector} from "reselect"; import { - selectNumberOfExportRows, + selectDataFields, selectDataFieldsSortableIdsList, selectExportFormat, selectFormatterConfig, + selectNumberOfExportRows, selectPreviewData, selectPreviewFormattedData } from "@/reducers/workspace/workspaceSelectors"; +import {calculateByteSize} from "@/utils/typeUtils"; +import {generateData} from "@/utils/generatorUtils"; +import {formatData} from "@/utils/formatterUtils"; export const selectShowExportModal = (state: RootState) => state.export.showExportModal; - export const selectExportFileName = (state: RootState) => state.export.exportFileName; - +export const selectExportProcessStage = (state: RootState) => state.export.exportProcessStage; export const selectEstimatedFileSize = createSelector( selectPreviewFormattedData, selectNumberOfExportRows, @@ -16,8 +19,24 @@ export const selectEstimatedFileSize = createSelector( if (previewFormattedData.length === 0) { return 0; } - const averageRowSize = previewFormattedData.length / 20; - return averageRowSize * numberOfExportRows; + const averageSize = calculateByteSize(previewFormattedData) / 20; + return averageSize * numberOfExportRows; + } +); +export const selectPreviewEstimatedTime = createSelector( + selectDataFields, + selectDataFieldsSortableIdsList, + selectNumberOfExportRows, + selectExportFormat, + selectFormatterConfig, + (dataFields, sortableIdList, numberOfExportRows, exportFormat, config) => { + const startTime = performance.now(); + const data = generateData(dataFields, sortableIdList, 20).length; + const endTime = performance.now(); + const executionTime = endTime - startTime; + const averageTime = executionTime / 20; + console.log(averageTime*numberOfExportRows); + return averageTime * numberOfExportRows; } ); diff --git a/src/reducers/index.ts b/src/reducers/index.ts index ec87459..2924877 100644 --- a/src/reducers/index.ts +++ b/src/reducers/index.ts @@ -27,7 +27,7 @@ const previewPersistConfig = { const exportPersistConfig = { key: 'export', storage: storage, - blacklist: ['showExportModal'] + blacklist: ['exportProcessStage', 'exportFileName', 'exportProcessStage'] } const rootReducer = combineReducers({ diff --git a/src/reducers/preview/previewReducer.ts b/src/reducers/preview/previewReducer.ts index 96c1e38..5eb8045 100644 --- a/src/reducers/preview/previewReducer.ts +++ b/src/reducers/preview/previewReducer.ts @@ -11,7 +11,7 @@ import { DEFAULT_SHOW_ROW_NUMBERS, DEFAULT_FONT_SIZE, DEFAULT_PREVIEW_TYPE -} from "@/constants/core"; +} from "@/constants/config"; export const initState: PreviewReducerState = { previewType: DEFAULT_PREVIEW_TYPE, @@ -21,7 +21,7 @@ export const initState: PreviewReducerState = { } -export default (state: PreviewReducerState = initState, action: any) => { +const previewReducer = (state: PreviewReducerState = initState, action: any) => { switch (action.type) { case SET_PREVIEW_TYPE: return { @@ -51,6 +51,7 @@ export default (state: PreviewReducerState = initState, action: any) => { default: return state; } -} +}; +export default previewReducer; diff --git a/src/reducers/workspace/workspaceReducer.ts b/src/reducers/workspace/workspaceReducer.ts index c53f4d8..50565da 100644 --- a/src/reducers/workspace/workspaceReducer.ts +++ b/src/reducers/workspace/workspaceReducer.ts @@ -11,7 +11,7 @@ import { SORT_DATA_FIELDS, UPDATE_DATA_FIELD, UPDATE_DATA_FIELD_NAME } from "@/constants/actions"; -import {DEFAULT_NUMBER_EXPORT_ROWS, DEFAULT_PANELS_ORIENTATION} from "@/constants/core"; +import {DEFAULT_NUMBER_EXPORT_ROWS, DEFAULT_PANELS_ORIENTATION} from "@/constants/config"; import {mockFields} from "@/reducers/mock"; import {deleteSpecificFieldData, generateData, generateSpecificFieldData} from "@/utils/generatorUtils"; import {ExportFormat} from "@/constants/enums"; @@ -37,8 +37,7 @@ export const initStates: WorkspaceReducerState = { currentDataTypeOptionsModalTargetFieldId: null, } -// eslint-disable-next-line import/no-anonymous-default-export -export default (state: WorkspaceReducerState = initStates, action: Action) => { +const workspaceReducer = (state: WorkspaceReducerState = initStates, action: Action) => { switch (action.type) { case SET_PANELS_DIRECTION: return { @@ -107,7 +106,7 @@ export default (state: WorkspaceReducerState = initStates, action: Action) => { }; case UPDATE_DATA_FIELD_NAME: const {id: fieldId, name} = action.payload; - return{ + return { ...state, dataFields: { ...state.dataFields, @@ -131,8 +130,8 @@ export default (state: WorkspaceReducerState = initStates, action: Action) => { dataTypeOptions: options }; - if(isNullOrWhiteSpace(field.fieldName)){ - field.fieldName = generateDefaultFieldName(dataType,state.dataFields, state.dataFieldsSortableIdsList) + if (isNullOrWhiteSpace(field.fieldName)) { + field.fieldName = generateDefaultFieldName(dataType, state.dataFields, state.dataFieldsSortableIdsList) } return { @@ -186,4 +185,4 @@ export default (state: WorkspaceReducerState = initStates, action: Action) => { } } - +export default workspaceReducer; diff --git a/src/types/system.d.ts b/src/types/system.d.ts index 87d9ca7..7166f02 100644 --- a/src/types/system.d.ts +++ b/src/types/system.d.ts @@ -1,4 +1,4 @@ -import {ColorMode, ExportFormat, Locales, PanelsOrientation, PreviewType} from "@/constants/enums"; +import {ColorMode, ExportFormat, ExportProcessStage, Locales, PanelsOrientation, PreviewType} from "@/constants/enums"; import enTranslations from "@/locales/en.json"; import type {IntlFormatters} from 'react-intl'; import {DataField, DataFieldList} from "@/types/generator"; @@ -55,6 +55,7 @@ export interface PreviewReducerState { export interface ExportReducerState { showExportModal: boolean; exportFileName: string; + exportProcessStage: ExportProcessStage; } // locales diff --git a/src/utils/typeUtils.ts b/src/utils/typeUtils.ts index 7b479b1..8b29cf6 100644 --- a/src/utils/typeUtils.ts +++ b/src/utils/typeUtils.ts @@ -1,9 +1,11 @@ -// convert boolean to string -// e.g. true -> 'true', false -> 'false' -export const boolToString = (value: boolean): string => { - return value ? 'true' : 'false'; -} - +// determine if a value is null or undefined export const isNullOrUndefined = (value: any): boolean => { return value === null || value === undefined || value === ''; +} + +// calculate the byte size of a string +export const calculateByteSize = (str: string) => { + const encoder = new TextEncoder(); + const encodedData = encoder.encode(str); + return encodedData.length; } \ No newline at end of file From 8f4a207733e61eb40d8d82e520435c3c454b19e5 Mon Sep 17 00:00:00 2001 From: thongteav Date: Thu, 15 Jun 2023 23:05:02 +1200 Subject: [PATCH 06/60] add treeselect on toolbar in mobile --- src/components/FilesPanel/src/FilesPanel.tsx | 39 ++++++----- src/components/InputPanel/src/InputPanel.tsx | 53 ++++++++++++++- src/components/Toolbar/src/Toolbar.tsx | 2 +- src/pages/workspace/index.tsx | 71 +++++++++++--------- 4 files changed, 109 insertions(+), 56 deletions(-) diff --git a/src/components/FilesPanel/src/FilesPanel.tsx b/src/components/FilesPanel/src/FilesPanel.tsx index 4672ab5..cb37d01 100644 --- a/src/components/FilesPanel/src/FilesPanel.tsx +++ b/src/components/FilesPanel/src/FilesPanel.tsx @@ -1,4 +1,4 @@ -import { Tree } from '@douyinfe/semi-ui'; +import { Tree, TreeSelect } from '@douyinfe/semi-ui'; import React, { ReactNode, useState } from 'react'; import styles from "./FilesPanel.module.css"; import { Emoji, EmojiStyle } from 'emoji-picker-react'; @@ -28,29 +28,28 @@ export const convertToUnifiedCode = (code: string) => { return unifiedParts.join('-'); }; -export const FilesPanel: React.FunctionComponent = ({files}) => { - const convertToTreeData = (data: FilesPanelProps['files'], parentKey: string): TreeNode[] => { - return data.map((node, index) => { - const key = parentKey ? `${parentKey}-${index}` : `${index}`; - const treeNode: TreeNode = { - label: node.label, - value: node.label, - key: key - }; +export const convertToTreeData = (data: FilesPanelProps['files'], parentKey: string): TreeNode[] => { + return data.map((node, index) => { + const key = parentKey ? `${parentKey}-${index}` : `${index}`; + const treeNode: TreeNode = { + label: node.label, + value: node.label, + key: key + }; - if (node.children) { - treeNode.children = convertToTreeData(node.children, key); - } + if (node.children) { + treeNode.children = convertToTreeData(node.children, key); + } - if (node.emoji) { - console.log(convertToUnifiedCode(node.emoji.code)); - treeNode.icon =
- } + if (node.emoji) { + treeNode.icon =
+ } - return treeNode; - }); - }; + return treeNode; + }); +}; +export const FilesPanel: React.FunctionComponent = ({files}) => { const initTreeData = convertToTreeData(files, ''); const [treeData, setTreeData] = useState(initTreeData); diff --git a/src/components/InputPanel/src/InputPanel.tsx b/src/components/InputPanel/src/InputPanel.tsx index 0e89ff7..e419980 100644 --- a/src/components/InputPanel/src/InputPanel.tsx +++ b/src/components/InputPanel/src/InputPanel.tsx @@ -1,17 +1,60 @@ -import React, {useEffect, useRef} from 'react'; +import React, {useEffect, useRef, useState} from 'react'; import {Toolbar} from "@/components/Toolbar"; import styles from "./InputPanel.module.css"; import {DataFieldsList} from "@/components/InputPanel/src/components"; import {ComponentSize} from "@/constants/enums"; +import { TreeSelect } from '@douyinfe/semi-ui'; +import { convertToTreeData } from '@/components/FilesPanel/src'; -export type InputPanelProps = {} +export type InputPanelProps = { + isMobile: boolean +} -export const InputPanel: React.FunctionComponent = () => { +export const InputPanel: React.FunctionComponent = ({isMobile, ...props}) => { const containerRef = useRef(null); const [containerHeight, setPanelHeight] = React.useState(800); const [componentSize, setComponentSize] = React.useState(ComponentSize.LARGE); + const files = [ + { + label: 'Asia', + emoji: { + background: "#123456", + code: "U+1F600" + }, + + children: [ + { + label: 'China', + emoji: { + background: "#123456", + code: "U+1F1E8 U+1F1F3", + }, + children: [ + { + label: 'Beijing', + }, + { + label: 'Guangzhou', + }, + ], + }, + { + label: 'Japan', + emoji: { + background: "#123456", + code: "U+1F1EF U+1F1F5", + }, + }, + ], + }, + ]; + + const initTreeData = convertToTreeData(files, ''); + + console.log("init tree data: ", initTreeData); + const [treeData, setTreeData] = useState(initTreeData); useEffect(() => { const resizeObserver = new ResizeObserver((entries) => { @@ -37,9 +80,13 @@ export const InputPanel: React.FunctionComponent = () => { resizeObserver.disconnect(); }; }, [containerRef]); + return (
+ {isMobile && + + }
diff --git a/src/components/Toolbar/src/Toolbar.tsx b/src/components/Toolbar/src/Toolbar.tsx index 5b76163..272ed75 100644 --- a/src/components/Toolbar/src/Toolbar.tsx +++ b/src/components/Toolbar/src/Toolbar.tsx @@ -74,7 +74,7 @@ export const Toolbar: React.FC = () => { { setIsEmptyPageConfirmationModalOpen(true) }}/> - {window.innerWidth < 700 ? null : } + {window.innerWidth < 750 ? null : } }> - @@ -101,6 +103,7 @@ export const ExportModal: React.FunctionComponent = () => { <> } onCancel={onCloseModal} diff --git a/src/core/generators/Sex/index.ts b/src/core/generators/Sex/index.ts index 3d7d34c..fa546f6 100644 --- a/src/core/generators/Sex/index.ts +++ b/src/core/generators/Sex/index.ts @@ -6,7 +6,6 @@ export const SexGenerator: Generator = { type: DataType.SEX, category: DataTypeCategory.PERSON, generate: generate, - optionsComponent: SexGeneratorOptionsComponent, defaultOptions: SexGeneratorDefaultOptions, exampleLines: ['male', 'female'] } diff --git a/src/reducers/export/exportReducer.ts b/src/reducers/export/exportReducer.ts index dbe9db3..b761aaf 100644 --- a/src/reducers/export/exportReducer.ts +++ b/src/reducers/export/exportReducer.ts @@ -37,13 +37,13 @@ const exportReducer = (state: ExportReducerState = initStates, action: Action) = exportProcessStage: action.payload } case ON_BATCH_GENERATE_COMPLETE: - console.log(action) + const newSparkLineData = [...state.sparkLineData, action.payload.batchTimeElapsed]; // 创建新的数组副本，包含新值 return { ...state, - currentNumOfRowsGenerated:action.payload.totalNumOfRowsGenerated, - timeElapsed:action.payload.totalTimeElapsed, - - } + currentNumOfRowsGenerated: action.payload.totalNumOfRowsGenerated, + timeElapsed: action.payload.totalTimeElapsed, + sparkLineData: newSparkLineData + }; default: return state; } diff --git a/src/utils/generatorUtils.ts b/src/utils/generatorUtils.ts index 8ca1886..3125ccc 100644 --- a/src/utils/generatorUtils.ts +++ b/src/utils/generatorUtils.ts @@ -124,30 +124,32 @@ export const generateDataByDataType = (dataType: DataType, options: any): Genera } // Batch generation -export const batchGenerateData = (fields: DataFieldList, sortableList: string[], count: number, callback: (data: any) => void): void => { +export const batchGenerateData = async (fields: DataFieldList, sortableList: string[], count: number, callback: (data: any) => void): Promise => { const batchSize = 100000; const batchCount = Math.ceil(count / batchSize); - const data = []; let totalTime = 0; let totalNumOfRowsGenerated = 0; + for (let i = 0; i < batchCount; i++) { const startTime = performance.now(); let generateCount = batchSize; if (i === batchCount - 1) { generateCount = count - batchSize * i; } - data.push(...generateData(fields, sortableList, generateCount)); + const batchData = generateData(fields, sortableList, generateCount); const endTime = performance.now(); const batchTimeElapsed = endTime - startTime; totalTime += batchTimeElapsed; totalNumOfRowsGenerated += generateCount; + const response: GenerateDataBatchCompletedCallbackResponse = { batchIndex: i, batchCount: generateCount, batchTimeElapsed: batchTimeElapsed, totalTimeElapsed: totalTime, totalNumOfRowsGenerated: totalNumOfRowsGenerated - } + }; callback(response); + await new Promise(resolve => setTimeout(resolve, 100)); } -} \ No newline at end of file +}; diff --git a/src/utils/stringUtils.ts b/src/utils/stringUtils.ts index b3be994..d469373 100644 --- a/src/utils/stringUtils.ts +++ b/src/utils/stringUtils.ts @@ -17,8 +17,8 @@ export const parseTimeCount = (value) => { if (value < 1000) { return '< 1s'; } - const seconds = Math.floor(value / 1000); + const seconds = Math.ceil(value / 1000); const minutes = Math.floor(seconds / 60); const secondsLeft = seconds - minutes * 60; return `${String(minutes).padStart(2, '0')}:${String(secondsLeft).padStart(2, '0')}`; -} +} \ No newline at end of file From 0216ed4d462aba7b3f6a4e94ddbe048c8629dcb7 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Sun, 20 Aug 2023 15:44:27 +1200 Subject: [PATCH 13/60] feat: collection reducer --- src/components/FilesPanel/src/FilesPanel.tsx | 80 +++++-------------- src/components/InputPanel/src/InputPanel.tsx | 51 ++---------- .../src/components/LocaleSwitchButton.tsx | 3 +- src/constants/actions.ts | 5 +- src/constants/enums.ts | 5 ++ src/pages/workspace/index.tsx | 37 +-------- src/reducers/collection/collectionActions.ts | 9 +++ src/reducers/collection/collectionReducer.ts | 19 +++++ .../collection/collectionSelectors.ts | 7 ++ src/reducers/index.ts | 4 +- src/reducers/mock.ts | 54 ++++++++++++- src/types/system.d.ts | 25 +++++- src/utils/collectionUtils.tsx | 26 ++++++ 13 files changed, 179 insertions(+), 146 deletions(-) create mode 100644 src/reducers/collection/collectionActions.ts create mode 100644 src/reducers/collection/collectionReducer.ts create mode 100644 src/reducers/collection/collectionSelectors.ts create mode 100644 src/utils/collectionUtils.tsx diff --git a/src/components/FilesPanel/src/FilesPanel.tsx b/src/components/FilesPanel/src/FilesPanel.tsx index cb37d01..40922f7 100644 --- a/src/components/FilesPanel/src/FilesPanel.tsx +++ b/src/components/FilesPanel/src/FilesPanel.tsx @@ -1,67 +1,26 @@ -import { Tree, TreeSelect } from '@douyinfe/semi-ui'; -import React, { ReactNode, useState } from 'react'; +import {Tree, TreeSelect} from '@douyinfe/semi-ui'; +import React, {ReactNode, useState} from 'react'; import styles from "./FilesPanel.module.css"; -import { Emoji, EmojiStyle } from 'emoji-picker-react'; +import {Emoji, EmojiStyle} from 'emoji-picker-react'; +import {useSelector} from "react-redux"; +import {selectCollections} from "@/reducers/collection/collectionSelectors"; +import {SchemasCollection} from "@/types/system"; +import {convertToTreeData} from "@/utils/collectionUtils"; -export type TreeNode = { - label: string; - value: string; - icon?: ReactNode; - key: string; - children?: TreeNode[]; -}; -export type FilesPanelProps = { - files: { - label: string; - emoji?: { - background: string; - code: string; - } - children?: FilesPanelProps['files'] - }[]; -}; - -export const convertToUnifiedCode = (code: string) => { - const parts = code.split(' '); - const unifiedParts = parts.map(part => part.replace('U+', '').toLowerCase()).filter(part => part.trim() !== ''); - return unifiedParts.join('-'); -}; - -export const convertToTreeData = (data: FilesPanelProps['files'], parentKey: string): TreeNode[] => { - return data.map((node, index) => { - const key = parentKey ? `${parentKey}-${index}` : `${index}`; - const treeNode: TreeNode = { - label: node.label, - value: node.label, - key: key - }; - - if (node.children) { - treeNode.children = convertToTreeData(node.children, key); - } - - if (node.emoji) { - treeNode.icon =
- } - - return treeNode; - }); -}; -export const FilesPanel: React.FunctionComponent = ({files}) => { - const initTreeData = convertToTreeData(files, ''); +export const FilesPanel: React.FunctionComponent = () => { - const [treeData, setTreeData] = useState(initTreeData); + // state + const collections = useSelector(selectCollections); const onDrop = (info) => { - const { dropToGap, node, dragNode } = info; + const {dropToGap, node, dragNode} = info; const dropKey = node.key; const dragKey = dragNode.key; const dropPos = node.pos.split('-'); const dropPosition = info.dropPosition - Number(dropPos[dropPos.length - 1]); - - const data = [...treeData]; + const data = [...collections]; const loop = (data, key, callback) => { data.forEach((item, index, arr) => { if (item.key === key) return callback(item, index, arr); @@ -81,16 +40,14 @@ export const FilesPanel: React.FunctionComponent = ({files}) => item.children = item.children || []; item.children.push(dragObj); }); - } - else if (dropPosition === 1 && node.children && node.expanded) { + } else if (dropPosition === 1 && node.children && node.expanded) { // has children && expanded and drop into the node bottom gap // could insert anywhere. Here we insert to the top. loop(data, dropKey, item => { item.children = item.children || []; item.children.unshift(dragObj); }); - } - else { + } else { let dropNodeInd; let dropNodePosArr; loop(data, dropKey, (item, ind, arr) => { @@ -100,18 +57,19 @@ export const FilesPanel: React.FunctionComponent = ({files}) => if (dropPosition === -1) { // insert to top dropNodePosArr.splice(dropNodeInd, 0, dragObj); - } - else { + } else { // insert to bottom dropNodePosArr.splice(dropNodeInd + 1, 0, dragObj); } } - setTreeData(data); + + console.log(data); + // setTreeData(data); } return ( = ({isMobile, const containerRef = useRef(null); const [containerHeight, setPanelHeight] = React.useState(800); const [componentSize, setComponentSize] = React.useState(ComponentSize.LARGE); - const files = [ - { - label: 'Asia', - emoji: { - background: "#123456", - code: "U+1F600" - }, - children: [ - { - label: 'China', - emoji: { - background: "#123456", - code: "U+1F1E8 U+1F1F3", - }, - children: [ - { - label: 'Beijing', - }, - { - label: 'Guangzhou', - }, - ], - }, - { - label: 'Japan', - emoji: { - background: "#123456", - code: "U+1F1EF U+1F1F5", - }, - }, - ], - }, - ]; - - const initTreeData = convertToTreeData(files, ''); - const [treeData, setTreeData] = useState(initTreeData); + // state + const collections = useSelector(selectCollections); useEffect(() => { const resizeObserver = new ResizeObserver((entries) => { @@ -78,12 +43,12 @@ export const InputPanel: React.FunctionComponent = ({isMobile, resizeObserver.disconnect(); }; }, [containerRef]); - + return (
{isMobile && - + } diff --git a/src/components/Layout/src/components/LocaleSwitchButton.tsx b/src/components/Layout/src/components/LocaleSwitchButton.tsx index 16e2c56..505f31f 100644 --- a/src/components/Layout/src/components/LocaleSwitchButton.tsx +++ b/src/components/Layout/src/components/LocaleSwitchButton.tsx @@ -6,7 +6,8 @@ import {useRouter} from 'next/router'; import {Locales} from '@/constants/enums'; import {useIntl} from "@/locale"; import { Emoji, EmojiStyle } from 'emoji-picker-react'; -import { convertToUnifiedCode } from '@/components/FilesPanel/src/FilesPanel'; +import {convertToUnifiedCode} from "@/utils/collectionUtils"; + const localeMap = { [Locales.EN]: { diff --git a/src/constants/actions.ts b/src/constants/actions.ts index e438209..c16c3b0 100644 --- a/src/constants/actions.ts +++ b/src/constants/actions.ts @@ -29,4 +29,7 @@ export const SET_PREVIEW_TYPE = 'SET_PREVIEW_TYPE'; export const SET_RAW_VIEW_SHOW_LINE_NUMBERS = 'SET_RAW_VIEW_SHOW_LINE_NUMBERS'; export const SET_RAW_VIEW_LINE_WRAP = 'SET_RAW_VIEW_LINE_WRAP'; export const SET_RAW_VIEW_FONT_SIZE = 'SET_RAW_VIEW_FONT_SIZE'; -export const SET_PREVIEW_FORMATTED_DATA = 'SET_PREVIEW_FORMATTED_DATA'; \ No newline at end of file +export const SET_PREVIEW_FORMATTED_DATA = 'SET_PREVIEW_FORMATTED_DATA'; + +// collections +export const ON_DROP_TREE_NODE = 'ON_DROP_TREE_NODE'; \ No newline at end of file diff --git a/src/constants/enums.ts b/src/constants/enums.ts index d824c53..05c6fb5 100644 --- a/src/constants/enums.ts +++ b/src/constants/enums.ts @@ -67,6 +67,11 @@ export enum PreviewType{ RAW = "raw" } +export enum CollectionNodeType{ + COLLECTION = "collection", + SCHEMA = "schema" +} + export enum EndOfLineChars { LF = '\n', CRLF = '\r\n' diff --git a/src/pages/workspace/index.tsx b/src/pages/workspace/index.tsx index b8518a1..b1aea57 100644 --- a/src/pages/workspace/index.tsx +++ b/src/pages/workspace/index.tsx @@ -31,41 +31,6 @@ export default function Workspace() { } }) - const files = [ - { - label: 'Asia', - emoji: { - background: "#123456", - code: "U+1F600" - }, - - children: [ - { - label: 'China', - emoji: { - background: "#123456", - code: "U+1F1E8 U+1F1F3", - }, - children: [ - { - label: 'Beijing', - }, - { - label: 'Guangzhou', - }, - ], - }, - { - label: 'Japan', - emoji: { - background: "#123456", - code: "U+1F1EF U+1F1F5", - }, - }, - ], - }, - ]; - useEffect(() => { function handleResize() { const currentIsMobileView = window.innerWidth < MOBILE_VIEW_MAX_WIDTH; @@ -94,7 +59,7 @@ export default function Workspace() { {!isMobileView && ( - + )} diff --git a/src/reducers/collection/collectionActions.ts b/src/reducers/collection/collectionActions.ts new file mode 100644 index 0000000..72f12be --- /dev/null +++ b/src/reducers/collection/collectionActions.ts @@ -0,0 +1,9 @@ +import {ON_DROP_TREE_NODE} from "@/constants/actions"; +import {SchemasCollection} from "@/types/system"; + +// on tree node drop +export const doDropTreeNode= (collections:SchemasCollection[]): any => + async dispatch => { + // TODO: mapping + dispatch({type: ON_DROP_TREE_NODE, payload: collections}); + }; \ No newline at end of file diff --git a/src/reducers/collection/collectionReducer.ts b/src/reducers/collection/collectionReducer.ts new file mode 100644 index 0000000..577abf9 --- /dev/null +++ b/src/reducers/collection/collectionReducer.ts @@ -0,0 +1,19 @@ +import {Action, CollectionReducerState} from "@/types/system"; +import {mockCollections} from "@/reducers/mock"; +import {ON_DROP_TREE_NODE} from "@/constants/actions"; + +export const initStates: CollectionReducerState = { + collections: mockCollections +} + +export default (state: CollectionReducerState = initStates, action: Action) => { + switch (action.type) { + case ON_DROP_TREE_NODE: + return { + ...state, + collections: action.payload + }; + default: + return state; + } +} \ No newline at end of file diff --git a/src/reducers/collection/collectionSelectors.ts b/src/reducers/collection/collectionSelectors.ts new file mode 100644 index 0000000..d8376af --- /dev/null +++ b/src/reducers/collection/collectionSelectors.ts @@ -0,0 +1,7 @@ +import {Store} from "@/types/system"; +import {convertToTreeData} from "@/utils/collectionUtils"; + + +export const selectCollections = (state: Store) => { + return convertToTreeData(state.collection.collections); +} diff --git a/src/reducers/index.ts b/src/reducers/index.ts index 38f5596..d95f1fb 100644 --- a/src/reducers/index.ts +++ b/src/reducers/index.ts @@ -5,11 +5,13 @@ import {Store, Action} from "@/types/system"; import app from "@/reducers/app/appReducer"; import workspace from "@/reducers/workspace/workspaceReducer"; import preview from "@/reducers/preview/previewReducer"; +import collection from "@/reducers/collection/collectionReducer"; const rootReducer = combineReducers({ app, workspace, - preview + preview, + collection }); diff --git a/src/reducers/mock.ts b/src/reducers/mock.ts index a349dbb..14920cd 100644 --- a/src/reducers/mock.ts +++ b/src/reducers/mock.ts @@ -1,7 +1,8 @@ import {DataField, DataFieldList} from "@/types/generator"; -import {DataType} from "@/constants/enums"; +import {CollectionNodeType, DataType} from "@/constants/enums"; import {NumberGeneratorDefaultOptions} from "@/core/generators/Number/Number"; import {BooleanGeneratorDefaultOptions} from "@/core/generators/Boolean/Boolean"; +import {SchemasCollection} from "@/types/system"; export const mockFields: DataFieldList = { @@ -19,5 +20,54 @@ export const mockFields: DataFieldList = dataTypeOptions: BooleanGeneratorDefaultOptions, emptyRate: 0, } - } + }; +export const mockCollections: SchemasCollection[] = + [ + { + id: '213123132123', + key:'0', + label: 'Asia', + type: CollectionNodeType.COLLECTION, + emoji: { + background: "#000000", + code: "U+1F600" + }, + children: [ + { + id: '213123132124', + key:'0-0', + label: 'Japan', + type: CollectionNodeType.COLLECTION, + emoji: { + background: "#123456", + code: "U+1F1EF U+1F1F5", + }, + }, + { + id: '213123132125', + key:'0-1', + label: 'China', + type: CollectionNodeType.COLLECTION, + emoji: { + background: "#123456", + code: "U+1F1E8 U+1F1F3", + }, + children: [ + { + id: '213123132126', + key:'0-1-0', + label: 'Beijing', + type: CollectionNodeType.SCHEMA + }, + { + id: '213123132127', + key:'0-1-1', + label: 'Guangzhou', + type: CollectionNodeType.SCHEMA, + }, + ], + }, + ] + } + ] diff --git a/src/types/system.d.ts b/src/types/system.d.ts index 500de22..f099684 100644 --- a/src/types/system.d.ts +++ b/src/types/system.d.ts @@ -1,7 +1,8 @@ -import {ColorMode, ExportFormat, Locales, PanelsOrientation, PreviewType} from "@/constants/enums"; +import {CollectionNodeType, ColorMode, ExportFormat, Locales, PanelsOrientation, PreviewType} from "@/constants/enums"; import enTranslations from "@/locales/en.json"; import type {IntlFormatters} from 'react-intl'; import {DataField, DataFieldList} from "@/types/generator"; +import {ReactNode} from "react"; // routes export interface RouteType { @@ -20,6 +21,7 @@ export interface Store { app: AppReducerState; workspace: WorkspaceReducerState; preview: PreviewReducerState; + collection: CollectionReducerState; } export interface AppReducerState { @@ -51,6 +53,10 @@ export interface PreviewReducerState { rawViewFontSize: number; } +export interface CollectionReducerState{ + collections: SchemasCollection[]; +} + // locales export type IntlMessageKeys = keyof typeof enTranslations; export type FormatMessageArgs = Parameters; @@ -59,3 +65,20 @@ export type FormatMessageArgs = Parameters; export type JsonObject = { [key: string]: any; } + +// collection +export type SchemasCollection = { + id: string; + key: string; + label: string; + icon?: ReactNode; + type: CollectionNodeType; + emoji?: FolderEmojiIconProps; + children?: SchemasCollection[]; +} + +export type FolderEmojiIconProps = { + background: string; + code: string; +} + diff --git a/src/utils/collectionUtils.tsx b/src/utils/collectionUtils.tsx new file mode 100644 index 0000000..3209823 --- /dev/null +++ b/src/utils/collectionUtils.tsx @@ -0,0 +1,26 @@ +import {SchemasCollection} from "@/types/system"; +import styles from "@/components/FilesPanel/src/FilesPanel.module.css"; +import {Emoji, EmojiStyle} from "emoji-picker-react"; +import React from "react"; + + +export const convertToTreeData = (data: SchemasCollection[]): SchemasCollection[] => { + return data.map((node, index) => { + if (node.children) { + node.children = convertToTreeData(node.children); + } + + if (node.emoji) { + node.icon =
+ +
+ } + return node; + }); +}; + +export const convertToUnifiedCode = (code: string) => { + const parts = code.split(' '); + const unifiedParts = parts.map(part => part.replace('U+', '').toLowerCase()).filter(part => part.trim() !== ''); + return unifiedParts.join('-'); +}; \ No newline at end of file From f0d61b44627d8e622c0139578f28a6f0d264030c Mon Sep 17 00:00:00 2001 From: thongteav Date: Sun, 20 Aug 2023 16:53:20 +1200 Subject: [PATCH 14/60] fix dispatch mapping --- package-lock.json | 14 +++++ package.json | 2 + src/components/FilesPanel/src/FilesPanel.tsx | 20 +++---- src/reducers/collection/collectionActions.ts | 5 +- src/utils/collectionUtils.tsx | 58 ++++++++++++++++---- 5 files changed, 75 insertions(+), 24 deletions(-) diff --git a/package-lock.json b/package-lock.json index 581698f..3eefd76 100644 --- a/package-lock.json +++ b/package-lock.json @@ -25,6 +25,7 @@ "eslint": "8.41.0", "eslint-config-next": "13.4.4", "hamburger-react": "^2.5.0", + "loadash": "^1.0.0", "next": "13.4.3", "next-redux-wrapper": "^8.1.0", "next-seo": "^6.0.0", @@ -43,6 +44,7 @@ "uuidjs": "^5.0.1" }, "devDependencies": { + "@types/lodash": "^4.14.197", "cypress": "^12.14.0", "mini-css-extract-plugin": "^2.7.6", "typescript": "^5.1.3", @@ -1907,6 +1909,12 @@ "resolved": "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz", "integrity": "sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==" }, + "node_modules/@types/lodash": { + "version": "4.14.197", + "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.197.tgz", + "integrity": "sha512-BMVOiWs0uNxHVlHBgzTIqJYmj+PgCo4euloGF+5m4okL3rEYzM2EEv78mw8zWSMM57dM7kVIgJ2QDvwHSoCI5g==", + "dev": true + }, "node_modules/@types/node": { "version": "20.1.4", "resolved": "https://registry.npmjs.org/@types/node/-/node-20.1.4.tgz", @@ -5867,6 +5875,12 @@ } } }, + "node_modules/loadash": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/loadash/-/loadash-1.0.0.tgz", + "integrity": "sha512-xlX5HBsXB3KG0FJbJJG/3kYWCfsCyCSus3T+uHVu6QL6YxAdggmm3QeyLgn54N2yi5/UE6xxL5ZWJAAiHzHYEg==", + "deprecated": "Package is unsupport. Please use the lodash package instead." + }, "node_modules/loader-runner": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-4.3.0.tgz", diff --git a/package.json b/package.json index 7673962..ed541a7 100644 --- a/package.json +++ b/package.json @@ -28,6 +28,7 @@ "eslint": "8.41.0", "eslint-config-next": "13.4.4", "hamburger-react": "^2.5.0", + "loadash": "^1.0.0", "next": "13.4.3", "next-redux-wrapper": "^8.1.0", "next-seo": "^6.0.0", @@ -46,6 +47,7 @@ "uuidjs": "^5.0.1" }, "devDependencies": { + "@types/lodash": "^4.14.197", "cypress": "^12.14.0", "mini-css-extract-plugin": "^2.7.6", "typescript": "^5.1.3", diff --git a/src/components/FilesPanel/src/FilesPanel.tsx b/src/components/FilesPanel/src/FilesPanel.tsx index 40922f7..5371b05 100644 --- a/src/components/FilesPanel/src/FilesPanel.tsx +++ b/src/components/FilesPanel/src/FilesPanel.tsx @@ -1,18 +1,15 @@ -import {Tree, TreeSelect} from '@douyinfe/semi-ui'; -import React, {ReactNode, useState} from 'react'; -import styles from "./FilesPanel.module.css"; -import {Emoji, EmojiStyle} from 'emoji-picker-react'; -import {useSelector} from "react-redux"; +import {Tree} from '@douyinfe/semi-ui'; +import React, {} from 'react'; +import {useDispatch, useSelector} from "react-redux"; import {selectCollections} from "@/reducers/collection/collectionSelectors"; -import {SchemasCollection} from "@/types/system"; -import {convertToTreeData} from "@/utils/collectionUtils"; - - +import { doDropTreeNode } from '@/reducers/collection/collectionActions'; +import { cloneDeep } from 'lodash'; export const FilesPanel: React.FunctionComponent = () => { // state const collections = useSelector(selectCollections); + const dispatch = useDispatch(); const onDrop = (info) => { const {dropToGap, node, dragNode} = info; @@ -20,7 +17,7 @@ export const FilesPanel: React.FunctionComponent = () => { const dragKey = dragNode.key; const dropPos = node.pos.split('-'); const dropPosition = info.dropPosition - Number(dropPos[dropPos.length - 1]); - const data = [...collections]; + const data = cloneDeep(collections); const loop = (data, key, callback) => { data.forEach((item, index, arr) => { if (item.key === key) return callback(item, index, arr); @@ -63,8 +60,7 @@ export const FilesPanel: React.FunctionComponent = () => { } } - console.log(data); - // setTreeData(data); + dispatch(doDropTreeNode(data)); } return ( diff --git a/src/reducers/collection/collectionActions.ts b/src/reducers/collection/collectionActions.ts index 72f12be..4db9b94 100644 --- a/src/reducers/collection/collectionActions.ts +++ b/src/reducers/collection/collectionActions.ts @@ -1,9 +1,10 @@ import {ON_DROP_TREE_NODE} from "@/constants/actions"; import {SchemasCollection} from "@/types/system"; +import { convertToSchemaCollections } from "@/utils/collectionUtils"; // on tree node drop export const doDropTreeNode= (collections:SchemasCollection[]): any => async dispatch => { - // TODO: mapping - dispatch({type: ON_DROP_TREE_NODE, payload: collections}); + const payload = convertToSchemaCollections(collections); + dispatch({type: ON_DROP_TREE_NODE, payload: payload}); }; \ No newline at end of file diff --git a/src/utils/collectionUtils.tsx b/src/utils/collectionUtils.tsx index 3209823..2e3b31f 100644 --- a/src/utils/collectionUtils.tsx +++ b/src/utils/collectionUtils.tsx @@ -1,21 +1,53 @@ -import {SchemasCollection} from "@/types/system"; +import {FolderEmojiIconProps, SchemasCollection} from "@/types/system"; import styles from "@/components/FilesPanel/src/FilesPanel.module.css"; import {Emoji, EmojiStyle} from "emoji-picker-react"; -import React from "react"; - +import React, { ReactElement, ReactNode } from "react"; export const convertToTreeData = (data: SchemasCollection[]): SchemasCollection[] => { + return data.map((node) => { + let newChildren = node.children ? convertToTreeData(node.children) : undefined; + let newIcon: ReactNode | undefined = undefined; + + if (node.emoji) { + newIcon = ( +
+ +
+ ); + } + + return { + ...node, // Spread the original node properties. + children: newChildren, + icon: newIcon // Override the icon with the new one. + }; + }); +}; + +export const convertToSchemaCollections = (data: SchemasCollection[]): SchemasCollection[] => { return data.map((node, index) => { - if (node.children) { - node.children = convertToTreeData(node.children); + let newChildren = node.children ? convertToSchemaCollections(node.children) : undefined; + let newEmoji: FolderEmojiIconProps | undefined = undefined; + + if (node.icon && React.isValidElement(node.icon)) { + const iconElement = node.icon as ReactElement; + const unifiedCode = iconElement.props['data-unified']; + + // Convert the unified code back to the original format. + const originalCode = convertFromUnifiedCode(unifiedCode); + newEmoji = { + code: originalCode, + background: '' // Note: You may need to provide an actual background value here. + }; } + + const { icon, ...nodeWithoutIcon } = node; - if (node.emoji) { - node.icon =
- -
+ return { + ...nodeWithoutIcon, + children: newChildren, + emoji: newEmoji } - return node; }); }; @@ -23,4 +55,10 @@ export const convertToUnifiedCode = (code: string) => { const parts = code.split(' '); const unifiedParts = parts.map(part => part.replace('U+', '').toLowerCase()).filter(part => part.trim() !== ''); return unifiedParts.join('-'); +}; + +export const convertFromUnifiedCode = (unified: string) => { + const parts = unified.split('-'); + const originalParts = parts.map(part => 'U+' + part.toUpperCase()); + return originalParts.join(' '); }; \ No newline at end of file From 1f5cf0e81ae6269ac417b79f0410b1e05c4d2aa2 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Sun, 20 Aug 2023 23:19:04 +1200 Subject: [PATCH 15/60] feat: export timer --- src/components/Exporter/src/ExportDash.tsx | 4 +- src/components/Exporter/src/ExportModal.tsx | 65 ++++++++++++------- src/components/Toolbar/src/Toolbar.tsx | 1 - .../Toolbar/src/components/GenerateButton.tsx | 1 - src/locale/translations/en.ts | 2 +- src/locale/translations/jaJP.ts | 2 +- src/locale/translations/zhCN.ts | 2 +- src/utils/stringUtils.ts | 13 ++-- 8 files changed, 50 insertions(+), 40 deletions(-) diff --git a/src/components/Exporter/src/ExportDash.tsx b/src/components/Exporter/src/ExportDash.tsx index b5034de..ece572a 100644 --- a/src/components/Exporter/src/ExportDash.tsx +++ b/src/components/Exporter/src/ExportDash.tsx @@ -20,7 +20,7 @@ export const ExportDash: React.FunctionComponent = ({.. const {Numeral} = Typography; // percent - let percent = currentExportedRows / 99999999999; + let percent = currentExportedRows / exportRows; // selectors const colorMode = useSelector(selectColorMode); @@ -58,7 +58,7 @@ export const ExportDash: React.FunctionComponent = ({..
- +
diff --git a/src/components/Exporter/src/ExportModal.tsx b/src/components/Exporter/src/ExportModal.tsx index faa1b07..1bd355d 100644 --- a/src/components/Exporter/src/ExportModal.tsx +++ b/src/components/Exporter/src/ExportModal.tsx @@ -1,16 +1,16 @@ -import React from 'react'; +import React, {useEffect, useState} from 'react'; import {Button, Modal} from "@douyinfe/semi-ui"; import {useDispatch, useSelector} from "react-redux"; import { - selectCurrentNumOfRowsGenerated, selectEstimatedFileSize, - selectExportFileName, selectExportProcessStage, selectShowExportModal, - selectSparkLineData, selectTimeElapsed + selectCurrentNumOfRowsGenerated, + selectEstimatedFileSize, + selectExportFileName, + selectExportProcessStage, + selectShowExportModal, + selectSparkLineData, + selectTimeElapsed } from "@/reducers/export/exportSelectors"; -import { - doOnBatchComplete, - doSetExportProcessStage, - doSetShowExportModal, -} from "@/reducers/export/exportActions"; +import {doOnBatchComplete, doSetExportProcessStage, doSetShowExportModal,} from "@/reducers/export/exportActions"; import {FormattedMessage} from "@/locale"; import { selectDataFields, @@ -28,7 +28,7 @@ export const ExportModal: React.FunctionComponent = () => { const dispatch = useDispatch(); // state - const [loading, setLoading] = React.useState(false); + const [totalTimerSeconds, setTotalTimerSeconds] = useState(0); // selectors const visible = useSelector(selectShowExportModal); @@ -44,19 +44,35 @@ export const ExportModal: React.FunctionComponent = () => { const totalNumOfRowsGenerated = useSelector(selectCurrentNumOfRowsGenerated); const timeElapsed = useSelector(selectTimeElapsed); + // effect + useEffect(() => { + let interval = null; + + if (exportProcessStage == ExportProcessStage.GENERATING) { + interval = setInterval(() => { + setTotalTimerSeconds((prevTotalSeconds) => prevTotalSeconds + 1); + }, 1000); + } else { + clearInterval(interval); + } + + return () => { + clearInterval(interval); + }; + }, [exportProcessStage]); + // render const renderModalContent = () => { - switch (exportProcessStage) { - case ExportProcessStage.PREVIEW: - return - case ExportProcessStage.COMPLETED: - return + if (exportProcessStage == ExportProcessStage.PREVIEW) { + return + } else { + return } } @@ -67,8 +83,9 @@ export const ExportModal: React.FunctionComponent = () => { // generate const onGenerate = async () => { + dispatch(doSetExportProcessStage(ExportProcessStage.GENERATING)); + await batchGenerateData(dataFields, sortableIdList, exportRows, onBatchCompleteCallback); dispatch(doSetExportProcessStage(ExportProcessStage.COMPLETED)); - await batchGenerateData(dataFields, sortableIdList, 99999999999, onBatchCompleteCallback); } const onBatchCompleteCallback = async (data: GenerateDataBatchCompletedCallbackResponse) => { @@ -83,7 +100,7 @@ export const ExportModal: React.FunctionComponent = () => { - @@ -102,7 +119,7 @@ export const ExportModal: React.FunctionComponent = () => { return ( <> } diff --git a/src/components/Toolbar/src/Toolbar.tsx b/src/components/Toolbar/src/Toolbar.tsx index 5b76163..76a6db0 100644 --- a/src/components/Toolbar/src/Toolbar.tsx +++ b/src/components/Toolbar/src/Toolbar.tsx @@ -92,7 +92,6 @@ export const Toolbar: React.FC = () => { - diff --git a/src/components/Toolbar/src/components/GenerateButton.tsx b/src/components/Toolbar/src/components/GenerateButton.tsx index 4a87111..46d5766 100644 --- a/src/components/Toolbar/src/components/GenerateButton.tsx +++ b/src/components/Toolbar/src/components/GenerateButton.tsx @@ -26,7 +26,6 @@ export const GenerateButton: React.FC = ({...props}) => { loading={false} icon={} className={Styles.generateButton} - style={{width: size === 'large' ? '100px' : '50px'}} theme={'solid'}> {size === 'large' ? : null} diff --git a/src/locale/translations/en.ts b/src/locale/translations/en.ts index e2eefe9..1838fe8 100644 --- a/src/locale/translations/en.ts +++ b/src/locale/translations/en.ts @@ -130,7 +130,7 @@ export const en = { // workspace "toolbar.numOfRowInput.suffix": "Rows", - "toolbar.generateButton.text": "Generate", + "toolbar.generateButton.text": "Batch Generate", "toolbar.panelsOrientationButton.tooltip.switchToColumn": "Switch panels to column", "toolbar.panelsOrientationButton.tooltip.switchToRow": "Switch panels to row", "toolbar.emptyPageButton.tooltip": "Empty workplace", diff --git a/src/locale/translations/jaJP.ts b/src/locale/translations/jaJP.ts index 944b7f9..ddba928 100644 --- a/src/locale/translations/jaJP.ts +++ b/src/locale/translations/jaJP.ts @@ -82,7 +82,7 @@ export const jaJP = { // workspace "toolbar.numOfRowInput.suffix": "行", - "toolbar.generateButton.text": "生成", + "toolbar.generateButton.text": "批量生成", "toolbar.panelsOrientationButton.tooltip.switchToColumn": "パネルを列に切り替え", "toolbar.panelsOrientationButton.tooltip.switchToRow": "パネルを行に切り替え", "toolbar.emptyPageButton.tooltip": "ワークスペースを空にする", diff --git a/src/locale/translations/zhCN.ts b/src/locale/translations/zhCN.ts index 1eca522..03fb8da 100644 --- a/src/locale/translations/zhCN.ts +++ b/src/locale/translations/zhCN.ts @@ -129,7 +129,7 @@ export const zhCN = { // workspace "toolbar.numOfRowInput.suffix": "行", - "toolbar.generateButton.text": "生成", + "toolbar.generateButton.text": "批量生成", "toolbar.panelsOrientationButton.tooltip.switchToColumn": "切换面板为横向", "toolbar.panelsOrientationButton.tooltip.switchToRow": "切换面板为竖向", "toolbar.emptyPageButton.tooltip": "清空工作台", diff --git a/src/utils/stringUtils.ts b/src/utils/stringUtils.ts index d469373..194b9a0 100644 --- a/src/utils/stringUtils.ts +++ b/src/utils/stringUtils.ts @@ -11,14 +11,9 @@ export const parseTCH = (value) => { ).join(' '); } -// parse milliseconds to a time count string -export const parseTimeCount = (value) => { - value = parseFloat(value); - if (value < 1000) { - return '< 1s'; - } - const seconds = Math.ceil(value / 1000); +// parse time count string +export const parseTimeCount = (seconds) => { const minutes = Math.floor(seconds / 60); - const secondsLeft = seconds - minutes * 60; - return `${String(minutes).padStart(2, '0')}:${String(secondsLeft).padStart(2, '0')}`; + const secondsRemaining = seconds % 60; + return `${String(minutes).padStart(2, '0')}:${String(secondsRemaining).padStart(2, '0')}`; } \ No newline at end of file From 3db6b56233110db888337cd7450e3145d91424c7 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Sun, 20 Aug 2023 21:17:05 +0000 Subject: [PATCH 16/60] chore: bump typescript from 5.1.3 to 5.1.6 Bumps [typescript](https://github.com/Microsoft/TypeScript) from 5.1.3 to 5.1.6. - [Release notes](https://github.com/Microsoft/TypeScript/releases) - [Commits](https://github.com/Microsoft/TypeScript/compare/v5.1.3...v5.1.6) --- updated-dependencies: - dependency-name: typescript dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] --- package-lock.json | 8 ++++---- package.json | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package-lock.json b/package-lock.json index 2968f3f..1b14b06 100644 --- a/package-lock.json +++ b/package-lock.json @@ -48,7 +48,7 @@ "@types/lodash": "^4.14.197", "cypress": "^12.14.0", "mini-css-extract-plugin": "^2.7.6", - "typescript": "^5.1.3", + "typescript": "^5.1.6", "webpack": "^5.88.2" } }, @@ -8533,9 +8533,9 @@ } }, "node_modules/typescript": { - "version": "5.1.3", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.1.3.tgz", - "integrity": "sha512-XH627E9vkeqhlZFQuL+UsyAXEnibT0kWR2FWONlr4sTjvxyJYnyefgrkyECLzM5NenmKzRAy2rR/OlYLA1HkZw==", + "version": "5.1.6", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.1.6.tgz", + "integrity": "sha512-zaWCozRZ6DLEWAWFrVDz1H6FVXzUSfTy5FUMWsQlU8Ym5JP9eO4xkTIROFCQvhQf61z6O/G6ugw3SgAnvvm+HA==", "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" diff --git a/package.json b/package.json index 44b668e..86c1959 100644 --- a/package.json +++ b/package.json @@ -51,7 +51,7 @@ "@types/lodash": "^4.14.197", "cypress": "^12.14.0", "mini-css-extract-plugin": "^2.7.6", - "typescript": "^5.1.3", + "typescript": "^5.1.6", "webpack": "^5.88.2" } } From 4e84505fc58a11a1c403886327df391fc4ddc5a6 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Mon, 21 Aug 2023 09:55:51 +1200 Subject: [PATCH 17/60] fix: type names --- src/reducers/collection/collectionSelectors.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/reducers/collection/collectionSelectors.ts b/src/reducers/collection/collectionSelectors.ts index d8376af..7540b8d 100644 --- a/src/reducers/collection/collectionSelectors.ts +++ b/src/reducers/collection/collectionSelectors.ts @@ -1,7 +1,7 @@ -import {Store} from "@/types/system"; +import {RootState} from "@/types/system"; import {convertToTreeData} from "@/utils/collectionUtils"; -export const selectCollections = (state: Store) => { +export const selectCollections = (state: RootState) => { return convertToTreeData(state.collection.collections); } From acbc336f503ed9f07e6e8919491263bbc5c09e6e Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Mon, 21 Aug 2023 10:37:47 +1200 Subject: [PATCH 18/60] feat: add emoji generator --- src/components/Utils/src/OptionsSelect.tsx | 13 ++- src/constants/enums.ts | 1 + src/core/generators/Emoji/Emoji.tsx | 118 +++++++++++++++++++++ src/core/generators/Emoji/index.ts | 13 +++ src/core/generators/index.ts | 2 + src/locale/translations/en.ts | 20 +++- src/locale/translations/jaJP.ts | 20 +++- src/locale/translations/zhCN.ts | 20 +++- 8 files changed, 188 insertions(+), 19 deletions(-) create mode 100644 src/core/generators/Emoji/Emoji.tsx create mode 100644 src/core/generators/Emoji/index.ts diff --git a/src/components/Utils/src/OptionsSelect.tsx b/src/components/Utils/src/OptionsSelect.tsx index 6d020cc..a9ecda2 100644 --- a/src/components/Utils/src/OptionsSelect.tsx +++ b/src/components/Utils/src/OptionsSelect.tsx @@ -15,11 +15,13 @@ export interface OptionsSelectProps { errorMessage?: string; value: any; onChange: (value: any) => void; + multiple?: boolean; + maxTagCount?: number; style?: React.CSSProperties; } export const OptionsSelect: React.FunctionComponent = ({...props}) => { - const {label, selectOptions, infoTooltip, errorMessage, value, style, onChange} = props; + const {label, selectOptions, infoTooltip, errorMessage, value, style, multiple, maxTagCount, onChange} = props; return (
@@ -29,9 +31,12 @@ export const OptionsSelect: React.FunctionComponent = ({...p }
- onChange(value)}> {selectOptions.map((option, index) => { return ( diff --git a/src/constants/enums.ts b/src/constants/enums.ts index b5146d2..9ad57b1 100644 --- a/src/constants/enums.ts +++ b/src/constants/enums.ts @@ -36,6 +36,7 @@ export enum DataTypeCategory { } export enum DataType { + EMOJI = "emoji", PERSONTITLE = "persontitle", MIDDLENAME = "middlename", LASTNAME = "lastname", diff --git a/src/core/generators/Emoji/Emoji.tsx b/src/core/generators/Emoji/Emoji.tsx new file mode 100644 index 0000000..cbb0a99 --- /dev/null +++ b/src/core/generators/Emoji/Emoji.tsx @@ -0,0 +1,118 @@ +import React from "react"; +import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; +import {ExportValueType, Sex} from "@/constants/enums"; +import {OptionsSelect, SelectOption} from "@/components/Utils"; +import {FormattedMessage} from "@/locale"; +import {faker} from "@faker-js/faker"; + +// ------------------------------------------------------------------------------------------------------------- +// types +export type EmojiType = + | 'smiley' + | 'body' + | 'person' + | 'nature' + | 'food' + | 'travel' + | 'activity' + | 'object' + | 'symbol' + | 'flag'; + +export interface EmojiGeneratorOptions { + type: EmojiType[] +} + +// ------------------------------------------------------------------------------------------------------------- +// default options +export const EmojiGeneratorDefaultOptions: EmojiGeneratorOptions = { + type: ['smiley', 'body', 'person', 'nature', 'food', 'travel', 'activity', 'object', 'symbol', 'flag'] +} + +// ------------------------------------------------------------------------------------------------------------- +// generate method +export const generate = (options: any): GenerateResult => { + const config = {}; + config['types'] = options.type; + + + const value = faker.internet.emoji(config); + + return { + value: value, + stringValue: value, + type: ExportValueType.STRING + }; +} + +// ------------------------------------------------------------------------------------------------------------- +// options component +export const EmojiGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { + const {options, onOptionsChange} = props; + + const handleOptionsChange = (changedFieldName: string, value: any) => { + let newOptions = {...options, [changedFieldName]: value}; + onOptionsChange(newOptions); + }; + + return ( +
+ } + selectOptions={EmojiTypeSelectOptions} + value={options.type} + onChange={(v) => handleOptionsChange("type", v)} + style={{width: '200px'}} + /> +
+ ); +} + +export const EmojiTypeSelectOptions: SelectOption[] = [ + { + label: , + value: "smiley", + }, + { + label: , + value: "body" + }, + { + label: , + value: "person" + }, + { + label: , + value: "nature" + }, + { + label: , + value: "food" + }, + { + label: , + value: "travel" + }, + { + label: , + value: "activity" + }, + { + label: , + value: "object" + }, + { + label: , + value: "symbol" + }, + { + label: , + value: "flag" + } +] + + + + diff --git a/src/core/generators/Emoji/index.ts b/src/core/generators/Emoji/index.ts new file mode 100644 index 0000000..0ce288a --- /dev/null +++ b/src/core/generators/Emoji/index.ts @@ -0,0 +1,13 @@ +import {Generator} from "@/types/generator"; +import {DataType, DataTypeCategory} from "@/constants/enums"; +import {EmojiGeneratorDefaultOptions, EmojiGeneratorOptionsComponent, generate} from "./Emoji"; + +export const EmojiGenerator: Generator = { + type: DataType.EMOJI, + category: DataTypeCategory.NETWORK, + generate: generate, + optionsComponent: EmojiGeneratorOptionsComponent, + defaultOptions: EmojiGeneratorDefaultOptions, + exampleLines: ["NOT IMPLEMENTED", "NOT IMPLEMENTED", "NOT IMPLEMENTED"] +} + \ No newline at end of file diff --git a/src/core/generators/index.ts b/src/core/generators/index.ts index a1b2522..d1b3d22 100644 --- a/src/core/generators/index.ts +++ b/src/core/generators/index.ts @@ -1,3 +1,4 @@ +import {EmojiGenerator} from "@/core/generators/Emoji"; import {PersonTitleGenerator} from "@/core/generators/PersonTitle"; import {MiddleNameGenerator} from "@/core/generators/MiddleName"; import {LastNameGenerator} from "@/core/generators/LastName"; @@ -11,6 +12,7 @@ import {CompanyNameGenerator} from "@/core/generators/CompanyName"; import {DataType} from "@/constants/enums"; export const generators = { + [DataType.EMOJI]: EmojiGenerator, [DataType.PERSONTITLE]: PersonTitleGenerator, [DataType.MIDDLENAME]: MiddleNameGenerator, [DataType.LASTNAME]: LastNameGenerator, diff --git a/src/locale/translations/en.ts b/src/locale/translations/en.ts index e2eefe9..56d4f05 100644 --- a/src/locale/translations/en.ts +++ b/src/locale/translations/en.ts @@ -44,12 +44,22 @@ export const en = { // ------------------------------------------------------------------------------------------------------------- // data types - - - - - + // emoji + "dataType.emoji": "Emoji", + "dataType.emoji.type": "Type", + "dataType.emoji.type.all": "All", + "dataType.emoji.type.smiley": "Smiley", + "dataType.emoji.type.body" : "Body", + "dataType.emoji.type.person" : "Person", + "dataType.emoji.type.nature" : "Nature", + "dataType.emoji.type.food" : "Food", + "dataType.emoji.type.travel" : "Travel", + "dataType.emoji.type.activity" : "Activity", + "dataType.emoji.type.object" : "Object", + "dataType.emoji.type.symbol" : "Symbol", + "dataType.emoji.type.flag" : "Flag", + // persontitle "dataType.persontitle": "Person Title", diff --git a/src/locale/translations/jaJP.ts b/src/locale/translations/jaJP.ts index 944b7f9..d2df842 100644 --- a/src/locale/translations/jaJP.ts +++ b/src/locale/translations/jaJP.ts @@ -22,11 +22,21 @@ export const jaJP = { // ------------------------------------------------------------------------------------------------------------- // data types - - - - - + // emoji + "dataType.emoji": "Emoji", + "dataType.emoji.type": "Type", + "dataType.emoji.type.all": "All", + "dataType.emoji.type.smiley": "Smiley", + "dataType.emoji.type.body" : "Body", + "dataType.emoji.type.person" : "Person", + "dataType.emoji.type.nature" : "Nature", + "dataType.emoji.type.food" : "Food", + "dataType.emoji.type.travel" : "Travel", + "dataType.emoji.type.activity" : "Activity", + "dataType.emoji.type.object" : "Object", + "dataType.emoji.type.symbol" : "Symbol", + "dataType.emoji.type.flag" : "Flag", + // persontitle "dataType.persontitle": "PersonTitle", diff --git a/src/locale/translations/zhCN.ts b/src/locale/translations/zhCN.ts index 1eca522..a2dbce7 100644 --- a/src/locale/translations/zhCN.ts +++ b/src/locale/translations/zhCN.ts @@ -43,12 +43,22 @@ export const zhCN = { // ------------------------------------------------------------------------------------------------------------- // data types - - - - - + // emoji + "dataType.emoji": "表情符号", + "dataType.emoji.type": "类型", + "dataType.emoji.type.all": "全部", + "dataType.emoji.type.smiley": "笑脸", + "dataType.emoji.type.body" : "人体", + "dataType.emoji.type.person" : "人物", + "dataType.emoji.type.nature" : "自然", + "dataType.emoji.type.food" : "食物", + "dataType.emoji.type.travel" : "旅行", + "dataType.emoji.type.activity" : "活动", + "dataType.emoji.type.object" : "物品", + "dataType.emoji.type.symbol" : "符号", + "dataType.emoji.type.flag" : "国旗", + // persontitle "dataType.persontitle": "人物称谓", From 6636c8ef363ef1824d7dd1c80a4f2033abc91da6 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 21 Aug 2023 03:00:57 +0000 Subject: [PATCH 19/60] chore: bump cypress from 12.14.0 to 12.17.4 Bumps [cypress](https://github.com/cypress-io/cypress) from 12.14.0 to 12.17.4. - [Release notes](https://github.com/cypress-io/cypress/releases) - [Changelog](https://github.com/cypress-io/cypress/blob/develop/CHANGELOG.md) - [Commits](https://github.com/cypress-io/cypress/compare/v12.14.0...v12.17.4) --- updated-dependencies: - dependency-name: cypress dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] --- package-lock.json | 89 +++++++++++++++++++++++++++++++++++------------ package.json | 2 +- 2 files changed, 67 insertions(+), 24 deletions(-) diff --git a/package-lock.json b/package-lock.json index cb1fd7e..084143d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -46,7 +46,7 @@ }, "devDependencies": { "@types/lodash": "^4.14.197", - "cypress": "^12.14.0", + "cypress": "^12.17.4", "mini-css-extract-plugin": "^2.7.6", "typescript": "^5.1.6", "webpack": "^5.88.2" @@ -714,9 +714,9 @@ } }, "node_modules/@cypress/request": { - "version": "2.88.11", - "resolved": "https://registry.npmjs.org/@cypress/request/-/request-2.88.11.tgz", - "integrity": "sha512-M83/wfQ1EkspjkE2lNWNV5ui2Cv7UCv1swW1DqljahbzLVWltcsexQh8jYtuS/vzFXP+HySntGM83ZXA9fn17w==", + "version": "2.88.12", + "resolved": "https://registry.npmjs.org/@cypress/request/-/request-2.88.12.tgz", + "integrity": "sha512-tOn+0mDZxASFM+cuAP9szGUGPI1HwWVSvdzm7V4cCsPdFTx6qMj29CwaQmRAMIEhORIUBFBsYROYJcveK4uOjA==", "dev": true, "dependencies": { "aws-sign2": "~0.7.0", @@ -734,7 +734,7 @@ "performance-now": "^2.1.0", "qs": "~6.10.3", "safe-buffer": "^5.1.2", - "tough-cookie": "~2.5.0", + "tough-cookie": "^4.1.3", "tunnel-agent": "^0.6.0", "uuid": "^8.3.2" }, @@ -3527,15 +3527,15 @@ "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==" }, "node_modules/cypress": { - "version": "12.14.0", - "resolved": "https://registry.npmjs.org/cypress/-/cypress-12.14.0.tgz", - "integrity": "sha512-HiLIXKXZaIT1RT7sw1sVPt+qKtis3uYNm6KwC4qoYjabwLKaqZlyS/P+uVvvlBNcHIwL/BC6nQZajpbUd7hOgQ==", + "version": "12.17.4", + "resolved": "https://registry.npmjs.org/cypress/-/cypress-12.17.4.tgz", + "integrity": "sha512-gAN8Pmns9MA5eCDFSDJXWKUpaL3IDd89N9TtIupjYnzLSmlpVr+ZR+vb4U/qaMp+lB6tBvAmt7504c3Z4RU5KQ==", "dev": true, "hasInstallScript": true, "dependencies": { - "@cypress/request": "^2.88.10", + "@cypress/request": "2.88.12", "@cypress/xvfb": "^1.2.4", - "@types/node": "^14.14.31", + "@types/node": "^16.18.39", "@types/sinonjs__fake-timers": "8.1.1", "@types/sizzle": "^2.3.2", "arch": "^2.2.0", @@ -3568,9 +3568,10 @@ "minimist": "^1.2.8", "ospath": "^1.2.2", "pretty-bytes": "^5.6.0", + "process": "^0.11.10", "proxy-from-env": "1.0.0", "request-progress": "^3.0.0", - "semver": "^7.3.2", + "semver": "^7.5.3", "supports-color": "^8.1.1", "tmp": "~0.2.1", "untildify": "^4.0.0", @@ -3584,9 +3585,9 @@ } }, "node_modules/cypress/node_modules/@types/node": { - "version": "14.18.47", - "resolved": "https://registry.npmjs.org/@types/node/-/node-14.18.47.tgz", - "integrity": "sha512-OuJi8bIng4wYHHA3YpKauL58dZrPxro3d0tabPHyiNF8rKfGKuVfr83oFlPLmKri1cX+Z3cJP39GXmnqkP11Gw==", + "version": "16.18.41", + "resolved": "https://registry.npmjs.org/@types/node/-/node-16.18.41.tgz", + "integrity": "sha512-YZJjn+Aaw0xihnpdImxI22jqGbp0DCgTFKRycygjGx/Y27NnWFJa5FJ7P+MRT3u07dogEeMVh70pWpbIQollTA==", "dev": true }, "node_modules/cypress/node_modules/commander": { @@ -7062,6 +7063,15 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/process": { + "version": "0.11.10", + "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz", + "integrity": "sha512-cdGef/drWFoydD1JsMzuFf8100nZl+GT+yacc2bEced5f9Rjk4z+WtFUTBu9PhOi9j/jfmBPu0mMEY4wIdAF8A==", + "dev": true, + "engines": { + "node": ">= 0.6.0" + } + }, "node_modules/prop-types": { "version": "15.8.1", "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz", @@ -7117,6 +7127,12 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/querystringify": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz", + "integrity": "sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ==", + "dev": true + }, "node_modules/queue-microtask": { "version": "1.2.3", "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz", @@ -7445,6 +7461,12 @@ "node": ">=0.10.0" } }, + "node_modules/requires-port": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz", + "integrity": "sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==", + "dev": true + }, "node_modules/reselect": { "version": "4.1.8", "resolved": "https://registry.npmjs.org/reselect/-/reselect-4.1.8.tgz", @@ -7849,9 +7871,9 @@ } }, "node_modules/semver": { - "version": "7.5.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.0.tgz", - "integrity": "sha512-+XC0AD/R7Q2mPSRuy2Id0+CGTZ98+8f+KvwirxOKIEyid+XSx6HbC63p+O4IndTHuX5Z+JxQ0TghCkO5Cg/2HA==", + "version": "7.5.4", + "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz", + "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==", "dependencies": { "lru-cache": "^6.0.0" }, @@ -8460,16 +8482,27 @@ } }, "node_modules/tough-cookie": { - "version": "2.5.0", - "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.5.0.tgz", - "integrity": "sha512-nlLsUzgm1kfLXSXfRZMc1KLAugd4hqJHDTvc2hDIwS3mZAfMEuMbc03SujMF+GEcpaX/qboeycw6iO8JwVv2+g==", + "version": "4.1.3", + "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-4.1.3.tgz", + "integrity": "sha512-aX/y5pVRkfRnfmuX+OdbSdXvPe6ieKX/G2s7e98f4poJHnqH3281gDPm/metm6E/WRamfx7WC4HUqkWHfQHprw==", "dev": true, "dependencies": { - "psl": "^1.1.28", - "punycode": "^2.1.1" + "psl": "^1.1.33", + "punycode": "^2.1.1", + "universalify": "^0.2.0", + "url-parse": "^1.5.3" }, "engines": { - "node": ">=0.8" + "node": ">=6" + } + }, + "node_modules/tough-cookie/node_modules/universalify": { + "version": "0.2.0", + "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.2.0.tgz", + "integrity": "sha512-CJ1QgKmNg3CwvAv/kOFmtnEN05f0D/cn9QntgNOQlQF9dgvVTHj3t+8JPdjqawCHk7V/KA+fbUqzZ9XWhcqPUg==", + "dev": true, + "engines": { + "node": ">= 4.0.0" } }, "node_modules/ts-interface-checker": { @@ -8661,6 +8694,16 @@ "punycode": "^2.1.0" } }, + "node_modules/url-parse": { + "version": "1.5.10", + "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.5.10.tgz", + "integrity": "sha512-WypcfiRhfeUP9vvF0j6rw0J3hrWrw6iZv3+22h6iRMJ/8z1Tj6XfLP4DsUix5MhMPnXpiHDoKyoZ/bdCkwBCiQ==", + "dev": true, + "dependencies": { + "querystringify": "^2.1.1", + "requires-port": "^1.0.0" + } + }, "node_modules/use-memo-one": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/use-memo-one/-/use-memo-one-1.1.3.tgz", diff --git a/package.json b/package.json index 5a985fa..ece035a 100644 --- a/package.json +++ b/package.json @@ -49,7 +49,7 @@ }, "devDependencies": { "@types/lodash": "^4.14.197", - "cypress": "^12.14.0", + "cypress": "^12.17.4", "mini-css-extract-plugin": "^2.7.6", "typescript": "^5.1.6", "webpack": "^5.88.2" From 6d85648fbe724ad3f6790b040953a9f1b5d62054 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 21 Aug 2023 03:01:08 +0000 Subject: [PATCH 20/60] chore: bump @douyinfe/semi-ui from 2.36.0 to 2.41.3 Bumps [@douyinfe/semi-ui](https://github.com/DouyinFE/semi-design) from 2.36.0 to 2.41.3. - [Release notes](https://github.com/DouyinFE/semi-design/releases) - [Commits](https://github.com/DouyinFE/semi-design/compare/v2.36.0...v2.41.3) --- updated-dependencies: - dependency-name: "@douyinfe/semi-ui" dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] --- package-lock.json | 213 ++++++++++++++++++++++------------------------ package.json | 2 +- 2 files changed, 101 insertions(+), 114 deletions(-) diff --git a/package-lock.json b/package-lock.json index cb1fd7e..87e3d90 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,7 +9,7 @@ "version": "0.1.0", "dependencies": { "@douyinfe/semi-next": "^2.41.2", - "@douyinfe/semi-ui": "^2.36.0", + "@douyinfe/semi-ui": "^2.41.3", "@faker-js/faker": "^8.0.2", "@reduxjs/toolkit": "^1.9.5", "@semi-bot/semi-theme-mockdatanz": "^1.1.5", @@ -310,18 +310,6 @@ "node": ">=6.9.0" } }, - "node_modules/@babel/runtime-corejs3": { - "version": "7.22.3", - "resolved": "https://registry.npmjs.org/@babel/runtime-corejs3/-/runtime-corejs3-7.22.3.tgz", - "integrity": "sha512-6bdmknScYKmt8I9VjsJuKKGr+TwUb555FTf6tT1P/ANlCjTHCiYLhiQ4X/O7J731w5NOqu8c1aYHEVuOwPz7jA==", - "dependencies": { - "core-js-pure": "^3.30.2", - "regenerator-runtime": "^0.13.11" - }, - "engines": { - "node": ">=6.9.0" - } - }, "node_modules/@babel/template": { "version": "7.22.5", "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.22.5.tgz", @@ -761,44 +749,84 @@ "ms": "^2.1.1" } }, - "node_modules/@douyinfe/semi-animation": { - "version": "2.36.0", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation/-/semi-animation-2.36.0.tgz", - "integrity": "sha512-+VgtnsT1//EnotjicQnecL0jLSZhbwX3uRIGfu+bXB3fH1B6wd24xsMGOe+sjawOYyh1leqSdzPnelMxZbg7KQ==", + "node_modules/@dnd-kit/accessibility": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/@dnd-kit/accessibility/-/accessibility-3.0.1.tgz", + "integrity": "sha512-HXRrwS9YUYQO9lFRc/49uO/VICbM+O+ZRpFDe9Pd1rwVv2PCNkRiTZRdxrDgng/UkvdC3Re9r2vwPpXXrWeFzg==", "dependencies": { - "bezier-easing": "^2.1.0" + "tslib": "^2.0.0" + }, + "peerDependencies": { + "react": ">=16.8.0" } }, - "node_modules/@douyinfe/semi-animation-react": { - "version": "2.36.0", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation-react/-/semi-animation-react-2.36.0.tgz", - "integrity": "sha512-W9wYVBx+B8N2dyT8A8tNXI2WbLaYzJcqbpViukiKQO+W5s+GsNzWOCssWo/Aqt1+WS/Y3I309+auClpVHTkI8A==", + "node_modules/@dnd-kit/core": { + "version": "6.0.8", + "resolved": "https://registry.npmjs.org/@dnd-kit/core/-/core-6.0.8.tgz", + "integrity": "sha512-lYaoP8yHTQSLlZe6Rr9qogouGUz9oRUj4AHhDQGQzq/hqaJRpFo65X+JKsdHf8oUFBzx5A+SJPUvxAwTF2OabA==", "dependencies": { - "@douyinfe/semi-animation": "2.12.0", - "@douyinfe/semi-animation-styled": "2.23.2", - "classnames": "^2.2.6" + "@dnd-kit/accessibility": "^3.0.0", + "@dnd-kit/utilities": "^3.2.1", + "tslib": "^2.0.0" + }, + "peerDependencies": { + "react": ">=16.8.0", + "react-dom": ">=16.8.0" } }, - "node_modules/@douyinfe/semi-animation-react/node_modules/@douyinfe/semi-animation": { - "version": "2.12.0", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation/-/semi-animation-2.12.0.tgz", - "integrity": "sha512-OAfL9Nk38ZPqfdKm9k4cvVXXzm16ALI4LxGNZ0qfe2RCLLnYGB/hNzTctoTDjYD35dFv0yroh3qsXtZuP2xNdg==", + "node_modules/@dnd-kit/sortable": { + "version": "7.0.2", + "resolved": "https://registry.npmjs.org/@dnd-kit/sortable/-/sortable-7.0.2.tgz", + "integrity": "sha512-wDkBHHf9iCi1veM834Gbk1429bd4lHX4RpAwT0y2cHLf246GAvU2sVw/oxWNpPKQNQRQaeGXhAVgrOl1IT+iyA==", + "dependencies": { + "@dnd-kit/utilities": "^3.2.0", + "tslib": "^2.0.0" + }, + "peerDependencies": { + "@dnd-kit/core": "^6.0.7", + "react": ">=16.8.0" + } + }, + "node_modules/@dnd-kit/utilities": { + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/@dnd-kit/utilities/-/utilities-3.2.1.tgz", + "integrity": "sha512-OOXqISfvBw/1REtkSK2N3Fi2EQiLMlWUlqnOK/UpOISqBZPWpE6TqL+jcPtMOkE8TqYGiURvRdPSI9hltNUjEA==", + "dependencies": { + "tslib": "^2.0.0" + }, + "peerDependencies": { + "react": ">=16.8.0" + } + }, + "node_modules/@douyinfe/semi-animation": { + "version": "2.40.0-beta.0", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation/-/semi-animation-2.40.0-beta.0.tgz", + "integrity": "sha512-YJhZalmBpo2BOAILasMgJnn7ybzKHSfGFVmbManuA1yP9GW4J3mF/HWthml5PVqNmeXGkLjjHJyrGJ7d9OZizQ==", "dependencies": { - "@babel/runtime-corejs3": "^7.15.4", "bezier-easing": "^2.1.0" } }, + "node_modules/@douyinfe/semi-animation-react": { + "version": "2.40.0-beta.0", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation-react/-/semi-animation-react-2.40.0-beta.0.tgz", + "integrity": "sha512-b68hGH8JqMGlGRwn0UNTx8zTSXb2oRgERyVziisVSlco6nhnp29CtAOLZuTxQrgHX9OEfA/Jz07ancg1ebqqUw==", + "dependencies": { + "@douyinfe/semi-animation": "2.40.0-beta.0", + "@douyinfe/semi-animation-styled": "2.40.0-beta.0", + "classnames": "^2.2.6" + } + }, "node_modules/@douyinfe/semi-animation-styled": { - "version": "2.23.2", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation-styled/-/semi-animation-styled-2.23.2.tgz", - "integrity": "sha512-cKaA1yGHPF76Rx7EZDZicj+1oX1su2wnqb/UGFOTquAwqWmkTfgQ+EKxCd/N704WH+RtmGf4xbrJKpBvvcEdSQ==" + "version": "2.40.0-beta.0", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation-styled/-/semi-animation-styled-2.40.0-beta.0.tgz", + "integrity": "sha512-+ez2aIIGnjMYr5u7mM747GqISBFnC2Zby/njMm+AL90gg7JTPU9jmIocaKF38W23DbDocdl/iGop1FNAq3fbvA==" }, "node_modules/@douyinfe/semi-foundation": { - "version": "2.36.0", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-foundation/-/semi-foundation-2.36.0.tgz", - "integrity": "sha512-lcDxviFlYdoq9KQTYQ0S+7x1ia8vWdu/uH3ACWAIZyUQ3W5Zd7pmDdmw9QsfQgdViJb9GnrejFrzgFEi4iEQjA==", + "version": "2.40.0-beta.0", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-foundation/-/semi-foundation-2.40.0-beta.0.tgz", + "integrity": "sha512-7tGu97gosYo5mCuPXqm9z8bYTuaAXt5U+6mq4VSrHcqpllOfGed3YvHPRDTz6JRKT7/PR+1yzK01VMzwy8P4zw==", "dependencies": { - "@douyinfe/semi-animation": "2.12.0", + "@douyinfe/semi-animation": "2.40.0-beta.0", "async-validator": "^3.5.0", "classnames": "^2.2.6", "date-fns": "^2.29.3", @@ -808,19 +836,10 @@ "scroll-into-view-if-needed": "^2.2.24" } }, - "node_modules/@douyinfe/semi-foundation/node_modules/@douyinfe/semi-animation": { - "version": "2.12.0", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation/-/semi-animation-2.12.0.tgz", - "integrity": "sha512-OAfL9Nk38ZPqfdKm9k4cvVXXzm16ALI4LxGNZ0qfe2RCLLnYGB/hNzTctoTDjYD35dFv0yroh3qsXtZuP2xNdg==", - "dependencies": { - "@babel/runtime-corejs3": "^7.15.4", - "bezier-easing": "^2.1.0" - } - }, "node_modules/@douyinfe/semi-icons": { - "version": "2.36.0", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-icons/-/semi-icons-2.36.0.tgz", - "integrity": "sha512-BGnbxCdZ9uhHqvIR73lhulF0jxDEWZU45PxxHDBvaAmx2zcvfMeDcdjJWIco0Pqeo5sfCwDEOYUHIWdq/9v7cw==", + "version": "2.40.0-beta.0", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-icons/-/semi-icons-2.40.0-beta.0.tgz", + "integrity": "sha512-J4BLLG1ShXoZ9wJaKhJ8b0fKHgPNUfzy2t+/FkWIfw9FF5Y14TMA51YzLKR6DY+s8ZKpikzO7PG/xmu3qqdrkg==", "dependencies": { "classnames": "^2.2.6" }, @@ -829,9 +848,9 @@ } }, "node_modules/@douyinfe/semi-illustrations": { - "version": "2.36.0", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-illustrations/-/semi-illustrations-2.36.0.tgz", - "integrity": "sha512-JTeCejgvPb8KqS+8dlOU5n5SoMQLcLK4FHfkMPcRA14ysmqdgNhrESLT+0WMNyB2A5RvfpNOBY/3ZGgi/veu5g==", + "version": "2.40.0-beta.0", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-illustrations/-/semi-illustrations-2.40.0-beta.0.tgz", + "integrity": "sha512-/JHPg8lX80a1L9qzF0Vf7vBkQ6n9fy2EcDAJDF1qx1+Eh3GaFi4Wi9ngbRPrla9cVdmsHyTTAUMoypxwoHMHVg==", "peerDependencies": { "react": "^16.8.0 || ^17.0.0 || ^18.0.0" } @@ -845,24 +864,27 @@ } }, "node_modules/@douyinfe/semi-theme-default": { - "version": "2.36.0", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-theme-default/-/semi-theme-default-2.36.0.tgz", - "integrity": "sha512-Z6U+Z9b0W3QJlFAFjR0dljLKl3/jFMXhwfefc9LHKiA/yaYJGzTEPgKiTDU7p98rTiCxjTvWkeZSb6/dI0kq3Q==", + "version": "2.40.0-beta.0", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-theme-default/-/semi-theme-default-2.40.0-beta.0.tgz", + "integrity": "sha512-fi9OCHVG3kY+bntiTfLkUz0BzC3xnzFFrvp+Wqg68OC11osLZMR5kKuAUFj/mskTsuUyikGI0lx/dIi0IMNNFw==", "dependencies": { "glob": "^7.1.6" } }, "node_modules/@douyinfe/semi-ui": { - "version": "2.36.0", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-ui/-/semi-ui-2.36.0.tgz", - "integrity": "sha512-6xGoQsy6Li1GZmEhRgZ5bSXSYEz3HrzpbfylSJbYb866zsMCl4VRzq4BkB4tebwJz/WmK8JSE6mfFauMYrLqYQ==", - "dependencies": { - "@douyinfe/semi-animation": "2.36.0", - "@douyinfe/semi-animation-react": "2.36.0", - "@douyinfe/semi-foundation": "2.36.0", - "@douyinfe/semi-icons": "2.36.0", - "@douyinfe/semi-illustrations": "2.36.0", - "@douyinfe/semi-theme-default": "2.36.0", + "version": "2.41.3", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-ui/-/semi-ui-2.41.3.tgz", + "integrity": "sha512-MbgGzltuJbktiGmpO0EMrO8adjBLKHpd+XCu8OeDbZONJaJsGXjY366UL7JLUs9ESTpzLPTJY3EKmT2nuZS5QA==", + "dependencies": { + "@dnd-kit/core": "^6.0.8", + "@dnd-kit/sortable": "^7.0.2", + "@dnd-kit/utilities": "^3.2.1", + "@douyinfe/semi-animation": "2.40.0-beta.0", + "@douyinfe/semi-animation-react": "2.40.0-beta.0", + "@douyinfe/semi-foundation": "2.40.0-beta.0", + "@douyinfe/semi-icons": "2.40.0-beta.0", + "@douyinfe/semi-illustrations": "2.40.0-beta.0", + "@douyinfe/semi-theme-default": "2.40.0-beta.0", "async-validator": "^3.5.0", "classnames": "^2.2.6", "copy-text-to-clipboard": "^2.1.1", @@ -870,8 +892,7 @@ "date-fns-tz": "^1.3.8", "lodash": "^4.17.21", "prop-types": "^15.7.2", - "react-resizable": "^1.8.0", - "react-sortable-hoc": "^2.0.0", + "react-resizable": "^3.0.5", "react-window": "^1.8.2", "resize-observer-polyfill": "^1.5.1", "scroll-into-view-if-needed": "^2.2.24", @@ -882,34 +903,6 @@ "react-dom": ">=16.0.0" } }, - "node_modules/@douyinfe/semi-ui/node_modules/react-resizable": { - "version": "1.11.1", - "resolved": "https://registry.npmjs.org/react-resizable/-/react-resizable-1.11.1.tgz", - "integrity": "sha512-S70gbLaAYqjuAd49utRHibtHLrHXInh7GuOR+6OO6RO6uleQfuBnWmZjRABfqNEx3C3Z6VPLg0/0uOYFrkfu9Q==", - "dependencies": { - "prop-types": "15.x", - "react-draggable": "^4.0.3" - }, - "peerDependencies": { - "react": "0.14.x || 15.x || 16.x || 17.x", - "react-dom": "0.14.x || 15.x || 16.x || 17.x" - } - }, - "node_modules/@douyinfe/semi-ui/node_modules/react-sortable-hoc": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/react-sortable-hoc/-/react-sortable-hoc-2.0.0.tgz", - "integrity": "sha512-JZUw7hBsAHXK7PTyErJyI7SopSBFRcFHDjWW5SWjcugY0i6iH7f+eJkY8cJmGMlZ1C9xz1J3Vjz0plFpavVeRg==", - "dependencies": { - "@babel/runtime": "^7.2.0", - "invariant": "^2.2.4", - "prop-types": "^15.5.7" - }, - "peerDependencies": { - "prop-types": "^15.5.7", - "react": "^16.3.0 || ^17.0.0", - "react-dom": "^16.3.0 || ^17.0.0" - } - }, "node_modules/@douyinfe/semi-webpack-plugin": { "version": "2.41.2", "resolved": "https://registry.npmjs.org/@douyinfe/semi-webpack-plugin/-/semi-webpack-plugin-2.41.2.tgz", @@ -3401,16 +3394,6 @@ "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/core-js-pure": { - "version": "3.30.2", - "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.30.2.tgz", - "integrity": "sha512-p/npFUJXXBkCCTIlEGBdghofn00jWG6ZOtdoIXSJmAu2QBvN0IqpZXWweOytcwE6cfx8ZvVUy1vw8zxhe4Y2vg==", - "hasInstallScript": true, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/core-js" - } - }, "node_modules/core-util-is": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz", @@ -5364,14 +5347,6 @@ "tslib": "^2.4.0" } }, - "node_modules/invariant": { - "version": "2.2.4", - "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz", - "integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==", - "dependencies": { - "loose-envify": "^1.0.0" - } - }, "node_modules/is-arguments": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/is-arguments/-/is-arguments-1.1.1.tgz", @@ -7335,6 +7310,18 @@ "react": "^16.0.0 || ^17.0.0 || ^18.0.0" } }, + "node_modules/react-resizable": { + "version": "3.0.5", + "resolved": "https://registry.npmjs.org/react-resizable/-/react-resizable-3.0.5.tgz", + "integrity": "sha512-vKpeHhI5OZvYn82kXOs1bC8aOXktGU5AmKAgaZS4F5JPburCtbmDPqE7Pzp+1kN4+Wb81LlF33VpGwWwtXem+w==", + "dependencies": { + "prop-types": "15.x", + "react-draggable": "^4.0.3" + }, + "peerDependencies": { + "react": ">= 16.3" + } + }, "node_modules/react-sparklines": { "version": "1.7.0", "resolved": "https://registry.npmjs.org/react-sparklines/-/react-sparklines-1.7.0.tgz", diff --git a/package.json b/package.json index 5a985fa..9119808 100644 --- a/package.json +++ b/package.json @@ -12,7 +12,7 @@ }, "dependencies": { "@douyinfe/semi-next": "^2.41.2", - "@douyinfe/semi-ui": "^2.36.0", + "@douyinfe/semi-ui": "^2.41.3", "@faker-js/faker": "^8.0.2", "@reduxjs/toolkit": "^1.9.5", "@semi-bot/semi-theme-mockdatanz": "^1.1.5", From 862c19b5b688e64b2953c37b9bcc18eac4277cc3 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Mon, 21 Aug 2023 15:32:35 +1200 Subject: [PATCH 21/60] feat: empty workspace (#152) --- .../src/components/EmptyPageButton.tsx | 7 +++-- src/constants/actions.ts | 1 + src/reducers/workspace/workspaceActions.ts | 31 ++++++++++++++----- src/reducers/workspace/workspaceReducer.ts | 26 +++++++++++++--- src/reducers/workspace/workspaceSelectors.ts | 2 ++ 5 files changed, 53 insertions(+), 14 deletions(-) diff --git a/src/components/Toolbar/src/components/EmptyPageButton.tsx b/src/components/Toolbar/src/components/EmptyPageButton.tsx index f296c10..fe595f8 100644 --- a/src/components/Toolbar/src/components/EmptyPageButton.tsx +++ b/src/components/Toolbar/src/components/EmptyPageButton.tsx @@ -2,6 +2,8 @@ import React from "react"; import {Button, Tooltip} from "@douyinfe/semi-ui"; import {IconDelete} from "@douyinfe/semi-icons"; import {useIntl} from "@/locale"; +import {useDispatch} from "react-redux"; +import {doEmptyWorkspace} from "@/reducers/workspace/workspaceActions"; @@ -11,10 +13,11 @@ export type EmptyPageButtonProps = { export const EmptyPageButton: React.FC = ({...props}) => { const intl = useIntl(); + const dispatch = useDispatch(); // actions const handleEmptyPage = () => { - // TODO: empty page + dispatch(doEmptyWorkspace()); } return ( @@ -29,7 +32,7 @@ export const EmptyPageButton: React.FC = ({...props}) => { theme={"borderless"} type='tertiary' icon={} - onClick={props.onClick} + onClick={handleEmptyPage} /> diff --git a/src/constants/actions.ts b/src/constants/actions.ts index 3b91051..e79ae02 100644 --- a/src/constants/actions.ts +++ b/src/constants/actions.ts @@ -28,6 +28,7 @@ export const GENERATE_SPECIFIC_FIELD_PREVIEW_DATA = 'GENERATE_SPECIFIC_FIELD_PRE export const FORMAT_PREVIEW_DATA = 'FORMAT_DATA'; export const UPDATE_DATA_FIELD_NAME = 'UPDATE_DATA_FIELD_NAME'; export const ON_BATCH_GENERATE_COMPLETE = 'ON_BATCH_GENERATE_COMPLETE'; +export const EMPTY_WORKSPACE = 'EMPTY_WORKSPACE'; // preview export const SET_PREVIEW_TYPE = 'SET_PREVIEW_TYPE'; diff --git a/src/reducers/workspace/workspaceActions.ts b/src/reducers/workspace/workspaceActions.ts index 6db87e0..211e7a8 100644 --- a/src/reducers/workspace/workspaceActions.ts +++ b/src/reducers/workspace/workspaceActions.ts @@ -1,12 +1,22 @@ import { - ADD_NEW_DATA_FIELD, CHANGE_DATA_TYPE, + ADD_NEW_DATA_FIELD, + CHANGE_DATA_TYPE, CLOSE_DATA_TYPE_OPTIONS_MODAL, CLOSE_DATA_TYPE_SELECT_MODAL, - DELETE_DATA_FIELD, FORMAT_PREVIEW_DATA, GENERATE_PREVIEW_DATA, GENERATE_SPECIFIC_FIELD_PREVIEW_DATA, + DELETE_DATA_FIELD, + EMPTY_WORKSPACE, + FORMAT_PREVIEW_DATA, + GENERATE_PREVIEW_DATA, + GENERATE_SPECIFIC_FIELD_PREVIEW_DATA, OPEN_DATA_TYPE_OPTIONS_MODAL, - OPEN_DATA_TYPE_SELECT_MODAL, SET_EXPORT_FORMAT, SET_FORMATTER_CONFIG, SET_NUMBER_OF_EXPORT_ROWS, - SET_PANELS_DIRECTION, SORT_DATA_FIELDS, - UPDATE_DATA_FIELD, UPDATE_DATA_FIELD_NAME + OPEN_DATA_TYPE_SELECT_MODAL, + SET_EXPORT_FORMAT, + SET_FORMATTER_CONFIG, + SET_NUMBER_OF_EXPORT_ROWS, + SET_PANELS_DIRECTION, + SORT_DATA_FIELDS, + UPDATE_DATA_FIELD, + UPDATE_DATA_FIELD_NAME } from "@/constants/actions"; import {DataType, ExportFormat, PanelsOrientation} from "@/constants/enums"; import {DataField} from "@/types/generator"; @@ -126,11 +136,18 @@ export const doUpdateFormatterConfig = (config: any): any => async dispatch => { dispatch({type: SET_FORMATTER_CONFIG, payload: config}); dispatch(doFormatPreviewData()); - } + }; // format data export const doFormatPreviewData = (): any => async dispatch => { dispatch({type: FORMAT_PREVIEW_DATA}); - } + }; + +// empty workspace +export const doEmptyWorkspace = (): any => + async dispatch => { + dispatch({type: EMPTY_WORKSPACE}); + }; + diff --git a/src/reducers/workspace/workspaceReducer.ts b/src/reducers/workspace/workspaceReducer.ts index 9693819..6b38d9e 100644 --- a/src/reducers/workspace/workspaceReducer.ts +++ b/src/reducers/workspace/workspaceReducer.ts @@ -1,15 +1,24 @@ import {Action, WorkspaceReducerState} from "@/types/system"; import { - ADD_NEW_DATA_FIELD, CHANGE_DATA_TYPE, + ADD_NEW_DATA_FIELD, + CHANGE_DATA_TYPE, CLOSE_DATA_TYPE_OPTIONS_MODAL, CLOSE_DATA_TYPE_SELECT_MODAL, - DELETE_DATA_FIELD, FORMAT_PREVIEW_DATA, GENERATE_PREVIEW_DATA, GENERATE_SPECIFIC_FIELD_PREVIEW_DATA, + DELETE_DATA_FIELD, + EMPTY_WORKSPACE, + FORMAT_PREVIEW_DATA, + GENERATE_PREVIEW_DATA, + GENERATE_SPECIFIC_FIELD_PREVIEW_DATA, OPEN_DATA_TYPE_OPTIONS_MODAL, OPEN_DATA_TYPE_SELECT_MODAL, - SET_DATA_FIELDS, SET_EXPORT_FORMAT, SET_FORMATTER_CONFIG, SET_NUMBER_OF_EXPORT_ROWS, + SET_DATA_FIELDS, + SET_EXPORT_FORMAT, + SET_FORMATTER_CONFIG, + SET_NUMBER_OF_EXPORT_ROWS, SET_PANELS_DIRECTION, SORT_DATA_FIELDS, - UPDATE_DATA_FIELD, UPDATE_DATA_FIELD_NAME + UPDATE_DATA_FIELD, + UPDATE_DATA_FIELD_NAME } from "@/constants/actions"; import {DEFAULT_NUMBER_EXPORT_ROWS, DEFAULT_PANELS_ORIENTATION} from "@/constants/config"; import {mockFields} from "@/reducers/mock"; @@ -179,7 +188,14 @@ const workspaceReducer = (state: WorkspaceReducerState = initStates, action: Act ...state, previewFormattedData: formatData(request) } - + case EMPTY_WORKSPACE: + return { + ...state, + dataFields: {}, + dataFieldsSortableIdsList: [], + previewData: [], + previewFormattedData: '', + } default: return state; } diff --git a/src/reducers/workspace/workspaceSelectors.ts b/src/reducers/workspace/workspaceSelectors.ts index b2dea75..a852af8 100644 --- a/src/reducers/workspace/workspaceSelectors.ts +++ b/src/reducers/workspace/workspaceSelectors.ts @@ -40,3 +40,5 @@ export const selectPreviewFormattedData = (state: RootState) => state.workspace. export const selectExportFormat = (state: RootState) => state.workspace.exportFormat; export const selectNumberOfExportRows = (state: RootState) => state.workspace.numberOfExportRows; export const selectFormatterConfig = (state: RootState) => state.workspace.formatterConfig; + + From 97821f40c794c5afd87240705f45d629f4196415 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Mon, 21 Aug 2023 15:41:34 +1200 Subject: [PATCH 22/60] feat: confirmation dialogue when emptying the workspace (#152) --- src/components/Toolbar/src/Toolbar.tsx | 6 +++++- .../Toolbar/src/components/EmptyPageButton.tsx | 12 +----------- 2 files changed, 6 insertions(+), 12 deletions(-) diff --git a/src/components/Toolbar/src/Toolbar.tsx b/src/components/Toolbar/src/Toolbar.tsx index 272ed75..8b8a317 100644 --- a/src/components/Toolbar/src/Toolbar.tsx +++ b/src/components/Toolbar/src/Toolbar.tsx @@ -12,6 +12,8 @@ import {ComponentSize} from "@/constants/enums"; import {ConfirmationModal} from "@/components/Modals"; import {useIntl} from "@/locale"; import {ExportFormatConfigurator} from "../../ExportFormatConfigurator"; +import {doEmptyWorkspace} from "@/reducers/workspace/workspaceActions"; +import {useDispatch} from "react-redux"; export type ToolbarProps = {} @@ -19,6 +21,7 @@ export type ToolbarProps = {} export const Toolbar: React.FC = () => { const intl = useIntl(); const containerRef = useRef(null); + const dispatch = useDispatch(); const [showMoreButton, setShowMoreButton] = React.useState(false); const [componentsSize, setComponentsSize] = React.useState(ComponentSize.LARGE); const [isEmptyPageConfirmationModalOpen, setIsEmptyPageConfirmationModalOpen] = React.useState(false); @@ -50,7 +53,8 @@ export const Toolbar: React.FC = () => { }, [containerRef]); function handleEmptyPage() { - // TODO: empty page + dispatch(doEmptyWorkspace()); + setIsEmptyPageConfirmationModalOpen(false); } return ( diff --git a/src/components/Toolbar/src/components/EmptyPageButton.tsx b/src/components/Toolbar/src/components/EmptyPageButton.tsx index fe595f8..9205de0 100644 --- a/src/components/Toolbar/src/components/EmptyPageButton.tsx +++ b/src/components/Toolbar/src/components/EmptyPageButton.tsx @@ -2,10 +2,6 @@ import React from "react"; import {Button, Tooltip} from "@douyinfe/semi-ui"; import {IconDelete} from "@douyinfe/semi-icons"; import {useIntl} from "@/locale"; -import {useDispatch} from "react-redux"; -import {doEmptyWorkspace} from "@/reducers/workspace/workspaceActions"; - - export type EmptyPageButtonProps = { onClick?: () => void; @@ -13,12 +9,6 @@ export type EmptyPageButtonProps = { export const EmptyPageButton: React.FC = ({...props}) => { const intl = useIntl(); - const dispatch = useDispatch(); - - // actions - const handleEmptyPage = () => { - dispatch(doEmptyWorkspace()); - } return ( <> @@ -32,7 +22,7 @@ export const EmptyPageButton: React.FC = ({...props}) => { theme={"borderless"} type='tertiary' icon={} - onClick={handleEmptyPage} + onClick={props.onClick} /> From 0276851548a54ca7cef512bcbbaba43a29a544fa Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Mon, 21 Aug 2023 16:26:55 +1200 Subject: [PATCH 23/60] feat: add phone number generator (#186) --- src/components/Utils/src/OptionsTagInput.tsx | 38 +++++++++++++ src/constants/enums.ts | 1 + src/core/generators/Emoji/index.ts | 2 +- src/core/generators/Phone/Phone.tsx | 57 ++++++++++++++++++++ src/core/generators/Phone/index.ts | 13 +++++ src/core/generators/index.ts | 14 ++--- src/locale/translations/en.ts | 30 ++++++----- src/locale/translations/jaJP.ts | 6 +++ src/locale/translations/zhCN.ts | 6 +++ 9 files changed, 148 insertions(+), 19 deletions(-) create mode 100644 src/components/Utils/src/OptionsTagInput.tsx create mode 100644 src/core/generators/Phone/Phone.tsx create mode 100644 src/core/generators/Phone/index.ts diff --git a/src/components/Utils/src/OptionsTagInput.tsx b/src/components/Utils/src/OptionsTagInput.tsx new file mode 100644 index 0000000..1886f50 --- /dev/null +++ b/src/components/Utils/src/OptionsTagInput.tsx @@ -0,0 +1,38 @@ +import React from 'react'; +import {ErrorTooltip, InfoTooltip} from "@/components/Utils"; +import {Input, TagInput} from "@douyinfe/semi-ui"; +import {isNullOrWhiteSpace} from "@/utils/stringUtils"; + +export interface OptionsTagInputProps { + label: string | React.ReactNode; + infoTooltip?: string | React.ReactNode; + errorMessage?: string; + suffix?: string | React.ReactNode; + value: string[]; + onChange: (value: any) => void; + style?: React.CSSProperties; +} + +export const OptionsTagInput: React.FunctionComponent = ({...props}) => { + const {label, infoTooltip, errorMessage, value, style, suffix, onChange} = props; + + return ( +
+
+ {label} + {infoTooltip && + {infoTooltip} + } +
+ + onChange(value)} + value={value} + style={style} + suffix={suffix} + validateStatus={!isNullOrWhiteSpace(errorMessage) ? 'error' : 'default'} + /> + +
+ ) +} \ No newline at end of file diff --git a/src/constants/enums.ts b/src/constants/enums.ts index 9ad57b1..433619a 100644 --- a/src/constants/enums.ts +++ b/src/constants/enums.ts @@ -36,6 +36,7 @@ export enum DataTypeCategory { } export enum DataType { + PHONE = "phone", EMOJI = "emoji", PERSONTITLE = "persontitle", MIDDLENAME = "middlename", diff --git a/src/core/generators/Emoji/index.ts b/src/core/generators/Emoji/index.ts index 0ce288a..f0d6ceb 100644 --- a/src/core/generators/Emoji/index.ts +++ b/src/core/generators/Emoji/index.ts @@ -8,6 +8,6 @@ export const EmojiGenerator: Generator = { generate: generate, optionsComponent: EmojiGeneratorOptionsComponent, defaultOptions: EmojiGeneratorDefaultOptions, - exampleLines: ["NOT IMPLEMENTED", "NOT IMPLEMENTED", "NOT IMPLEMENTED"] + exampleLines: ["🤜", "📖", "👰"] } \ No newline at end of file diff --git a/src/core/generators/Phone/Phone.tsx b/src/core/generators/Phone/Phone.tsx new file mode 100644 index 0000000..cd2d041 --- /dev/null +++ b/src/core/generators/Phone/Phone.tsx @@ -0,0 +1,57 @@ +import React from "react"; +import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; +import {ExportValueType} from "@/constants/enums"; +import {faker} from "@faker-js/faker"; +import {FormattedMessage} from "@/locale"; +import {OptionsTagInput} from "@/components/Utils/src/OptionsTagInput"; + +// ------------------------------------------------------------------------------------------------------------- +// types +export interface PhoneGeneratorOptions { + formats: string[]; +} + +// ------------------------------------------------------------------------------------------------------------- +// default options +export const PhoneGeneratorDefaultOptions: PhoneGeneratorOptions = { + formats: ["+1-###-###-###", "(555) ###-####"] +} + +// ------------------------------------------------------------------------------------------------------------- +// generate method +export const generate = (options: PhoneGeneratorOptions): GenerateResult => { + let format = ''; + if (options.formats && options.formats.length != 0) { + format = options.formats[faker.number.int({min: 0, max: options.formats.length - 1})]; + } + const value = faker.phone.number(format); + return { + value: value, + stringValue: value, + type: ExportValueType.STRING + }; +} + +// ------------------------------------------------------------------------------------------------------------- +// options component +export const PhoneGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { + const {options, onOptionsChange} = props; + + const handleOptionsChange = (changedFieldName: string, value: any) => { + let newOptions = {...options, [changedFieldName]: value}; + onOptionsChange(newOptions); + }; + + // TODO: implement your own options component here + return ( +
+ } + infoTooltip={} + value={options.formats} + onChange={(v) => handleOptionsChange("formats", v)} + style={{width: '350px'}} + /> +
+ ); +} \ No newline at end of file diff --git a/src/core/generators/Phone/index.ts b/src/core/generators/Phone/index.ts new file mode 100644 index 0000000..bb1769a --- /dev/null +++ b/src/core/generators/Phone/index.ts @@ -0,0 +1,13 @@ +import {Generator} from "@/types/generator"; +import {DataType, DataTypeCategory} from "@/constants/enums"; +import {PhoneGeneratorDefaultOptions, PhoneGeneratorOptionsComponent, generate} from "./Phone"; + +export const PhoneGenerator: Generator = { + type: DataType.PHONE, + category: DataTypeCategory.PERSON, + generate: generate, + optionsComponent: PhoneGeneratorOptionsComponent, + defaultOptions: PhoneGeneratorDefaultOptions, + exampleLines: ["+1-493-854-638", "(555) 750-8477", "(+64) 022-958-4397"] +} + \ No newline at end of file diff --git a/src/core/generators/index.ts b/src/core/generators/index.ts index d1b3d22..7e8952d 100644 --- a/src/core/generators/index.ts +++ b/src/core/generators/index.ts @@ -1,3 +1,4 @@ +import {PhoneGenerator} from "@/core/generators/Phone"; import {EmojiGenerator} from "@/core/generators/Emoji"; import {PersonTitleGenerator} from "@/core/generators/PersonTitle"; import {MiddleNameGenerator} from "@/core/generators/MiddleName"; @@ -12,12 +13,13 @@ import {CompanyNameGenerator} from "@/core/generators/CompanyName"; import {DataType} from "@/constants/enums"; export const generators = { - [DataType.EMOJI]: EmojiGenerator, - [DataType.PERSONTITLE]: PersonTitleGenerator, - [DataType.MIDDLENAME]: MiddleNameGenerator, - [DataType.LASTNAME]: LastNameGenerator, - [DataType.FIRSTNAME]: FirstNameGenerator, - [DataType.SEX]: SexGenerator, + [DataType.PHONE]: PhoneGenerator, + [DataType.EMOJI]: EmojiGenerator, + [DataType.PERSONTITLE]: PersonTitleGenerator, + [DataType.MIDDLENAME]: MiddleNameGenerator, + [DataType.LASTNAME]: LastNameGenerator, + [DataType.FIRSTNAME]: FirstNameGenerator, + [DataType.SEX]: SexGenerator, [DataType.BOOLEAN]: BooleanGenerator, [DataType.NUMBER]: NumberGenerator, [DataType.FULL_NAME]: FullNameGenerator, diff --git a/src/locale/translations/en.ts b/src/locale/translations/en.ts index 56d4f05..39b82cb 100644 --- a/src/locale/translations/en.ts +++ b/src/locale/translations/en.ts @@ -44,21 +44,27 @@ export const en = { // ------------------------------------------------------------------------------------------------------------- // data types - + + + // phone + "dataType.phone": "Phone Number", + "dataType.phone.formats.label": "Formats", + "dataType.phone.formats.tooltips": "Phone number format, please use \"#\" to represent digits, press Enter key to confirm", + // emoji "dataType.emoji": "Emoji", "dataType.emoji.type": "Type", "dataType.emoji.type.all": "All", "dataType.emoji.type.smiley": "Smiley", - "dataType.emoji.type.body" : "Body", - "dataType.emoji.type.person" : "Person", - "dataType.emoji.type.nature" : "Nature", - "dataType.emoji.type.food" : "Food", - "dataType.emoji.type.travel" : "Travel", - "dataType.emoji.type.activity" : "Activity", - "dataType.emoji.type.object" : "Object", - "dataType.emoji.type.symbol" : "Symbol", - "dataType.emoji.type.flag" : "Flag", + "dataType.emoji.type.body": "Body", + "dataType.emoji.type.person": "Person", + "dataType.emoji.type.nature": "Nature", + "dataType.emoji.type.food": "Food", + "dataType.emoji.type.travel": "Travel", + "dataType.emoji.type.activity": "Activity", + "dataType.emoji.type.object": "Object", + "dataType.emoji.type.symbol": "Symbol", + "dataType.emoji.type.flag": "Flag", // persontitle "dataType.persontitle": "Person Title", @@ -80,11 +86,11 @@ export const en = { "dataType.number.kind.label": "Kind", "dataType.number.precision.label": "Precision", "dataType.number.min.label": "Min.", - "dataType.number.min.tooltip":"Lower bound for generated numbers", + "dataType.number.min.tooltip": "Lower bound for generated numbers", "dataType.number.min.errorMessage.empty": "Min. value cannot be empty", "dataType.number.min.errorMessage.greaterThanMax": "Min. value cannot be greater than max. value", "dataType.number.max.label": "Max.", - "dataType.number.max.tooltip":"Upper bound for generated numbers", + "dataType.number.max.tooltip": "Upper bound for generated numbers", "dataType.number.max.errorMessage.empty": "Max. value cannot be empty", "dataType.number.max.errorMessage.lessThanMin": "Max. value cannot be less than min. value", diff --git a/src/locale/translations/jaJP.ts b/src/locale/translations/jaJP.ts index d2df842..f08da97 100644 --- a/src/locale/translations/jaJP.ts +++ b/src/locale/translations/jaJP.ts @@ -22,6 +22,12 @@ export const jaJP = { // ------------------------------------------------------------------------------------------------------------- // data types + + // phone + "dataType.phone": "Phone Number", + "dataType.phone.formats.label": "Formats", + "dataType.phone.formats.tooltips": "Phone number format, please use \"#\" to represent digits, press Enter key to confirm", + // emoji "dataType.emoji": "Emoji", "dataType.emoji.type": "Type", diff --git a/src/locale/translations/zhCN.ts b/src/locale/translations/zhCN.ts index a2dbce7..3ecca45 100644 --- a/src/locale/translations/zhCN.ts +++ b/src/locale/translations/zhCN.ts @@ -44,6 +44,12 @@ export const zhCN = { // ------------------------------------------------------------------------------------------------------------- // data types + + // phone + "dataType.phone": "电话号码", + "dataType.phone.formats.label": "格式", + "dataType.phone.formats.tooltips": "电话号码格式，请使用“#”代表数字，回车键确认输入", + // emoji "dataType.emoji": "表情符号", "dataType.emoji.type": "类型", From 6a487edf0f12d60506b469ea2d0f5ba61967994c Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 21 Aug 2023 21:56:23 +0000 Subject: [PATCH 24/60] chore: bump postcss from 8.4.24 to 8.4.28 Bumps [postcss](https://github.com/postcss/postcss) from 8.4.24 to 8.4.28. - [Release notes](https://github.com/postcss/postcss/releases) - [Changelog](https://github.com/postcss/postcss/blob/main/CHANGELOG.md) - [Commits](https://github.com/postcss/postcss/compare/8.4.24...8.4.28) --- updated-dependencies: - dependency-name: postcss dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] --- package-lock.json | 8 ++++---- package.json | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package-lock.json b/package-lock.json index a1a6176..90d6105 100644 --- a/package-lock.json +++ b/package-lock.json @@ -30,7 +30,7 @@ "next-redux-wrapper": "^8.1.0", "next-seo": "^6.1.0", "nextjs-progressbar": "^0.0.16", - "postcss": "8.4.24", + "postcss": "8.4.28", "react": "18.2.0", "react-beautiful-dnd": "^13.1.1", "react-dom": "18.2.0", @@ -6765,9 +6765,9 @@ } }, "node_modules/postcss": { - "version": "8.4.24", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.24.tgz", - "integrity": "sha512-M0RzbcI0sO/XJNucsGjvWU9ERWxb/ytp1w6dKtxTKgixdtQDq4rmx/g8W1hnaheq9jgwL/oyEdH5Bc4WwJKMqg==", + "version": "8.4.28", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.28.tgz", + "integrity": "sha512-Z7V5j0cq8oEKyejIKfpD8b4eBy9cwW2JWPk0+fB1HOAMsfHbnAXLLS+PfVWlzMSLQaWttKDt607I0XHmpE67Vw==", "funding": [ { "type": "opencollective", diff --git a/package.json b/package.json index 87f6866..97e041e 100644 --- a/package.json +++ b/package.json @@ -33,7 +33,7 @@ "next-redux-wrapper": "^8.1.0", "next-seo": "^6.1.0", "nextjs-progressbar": "^0.0.16", - "postcss": "8.4.24", + "postcss": "8.4.28", "react": "18.2.0", "react-beautiful-dnd": "^13.1.1", "react-dom": "18.2.0", From 7deffad6bc54775b0452f37d0c98c7fdc91864f6 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 21 Aug 2023 21:56:33 +0000 Subject: [PATCH 25/60] chore: bump eslint from 8.41.0 to 8.47.0 Bumps [eslint](https://github.com/eslint/eslint) from 8.41.0 to 8.47.0. - [Release notes](https://github.com/eslint/eslint/releases) - [Changelog](https://github.com/eslint/eslint/blob/main/CHANGELOG.md) - [Commits](https://github.com/eslint/eslint/compare/v8.41.0...v8.47.0) --- updated-dependencies: - dependency-name: eslint dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] --- package-lock.json | 112 +++++++++++++++++++++++----------------------- package.json | 2 +- 2 files changed, 56 insertions(+), 58 deletions(-) diff --git a/package-lock.json b/package-lock.json index a1a6176..dcbba12 100644 --- a/package-lock.json +++ b/package-lock.json @@ -22,7 +22,7 @@ "@vercel/analytics": "^1.0.1", "autoprefixer": "10.4.14", "emoji-picker-react": "^4.4.9", - "eslint": "8.41.0", + "eslint": "8.47.0", "eslint-config-next": "13.4.6", "hamburger-react": "^2.5.0", "loadash": "^1.0.0", @@ -52,6 +52,14 @@ "webpack": "^5.88.2" } }, + "node_modules/@aashutoshrathi/word-wrap": { + "version": "1.2.6", + "resolved": "https://registry.npmjs.org/@aashutoshrathi/word-wrap/-/word-wrap-1.2.6.tgz", + "integrity": "sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA==", + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/@alloc/quick-lru": { "version": "5.2.0", "resolved": "https://registry.npmjs.org/@alloc/quick-lru/-/quick-lru-5.2.0.tgz", @@ -1306,21 +1314,21 @@ } }, "node_modules/@eslint-community/regexpp": { - "version": "4.5.1", - "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.5.1.tgz", - "integrity": "sha512-Z5ba73P98O1KUYCCJTUeVpja9RcGoMdncZ6T49FCUl2lN38JtCJ+3WgIDBv0AuY4WChU5PmtJmOCTlN6FZTFKQ==", + "version": "4.6.2", + "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.6.2.tgz", + "integrity": "sha512-pPTNuaAG3QMH+buKyBIGJs3g/S5y0caxw0ygM3YyE6yJFySwiGGSzA+mM3KJ8QQvzeLh3blwgSonkFjgQdxzMw==", "engines": { "node": "^12.0.0 || ^14.0.0 || >=16.0.0" } }, "node_modules/@eslint/eslintrc": { - "version": "2.0.3", - "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-2.0.3.tgz", - "integrity": "sha512-+5gy6OQfk+xx3q0d6jGZZC3f3KzAkXc/IanVxd1is/VIIziRqqt3ongQz0FiTUXqTk0c7aDB3OaFuKnuSoJicQ==", + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-2.1.2.tgz", + "integrity": "sha512-+wvgpDsrB1YqAMdEUCcnTlpfVBH7Vqn6A/NT3D8WVXFIaKMlErPIZT3oCIAVCOtarRpMtelZLqJeU3t7WY6X6g==", "dependencies": { "ajv": "^6.12.4", "debug": "^4.3.2", - "espree": "^9.5.2", + "espree": "^9.6.0", "globals": "^13.19.0", "ignore": "^5.2.0", "import-fresh": "^3.2.1", @@ -1336,9 +1344,9 @@ } }, "node_modules/@eslint/js": { - "version": "8.41.0", - "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.41.0.tgz", - "integrity": "sha512-LxcyMGxwmTh2lY9FwHPGWOHmYFCZvbrFCBZL4FzSSsxsRPuhrYUg/49/0KDfW8tnIEaEHtfmn6+NPN+1DqaNmA==", + "version": "8.47.0", + "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.47.0.tgz", + "integrity": "sha512-P6omY1zv5MItm93kLM8s2vr1HICJH8v0dvddDhysbIuZ+vcjOHg5Zbkf1mTkcmi2JA9oBG2anOkRnW8WJTS8Og==", "engines": { "node": "^12.22.0 || ^14.17.0 || >=16.0.0" } @@ -1445,9 +1453,9 @@ } }, "node_modules/@humanwhocodes/config-array": { - "version": "0.11.8", - "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.8.tgz", - "integrity": "sha512-UybHIJzJnR5Qc/MsD9Kr+RpO2h+/P1GhOwdiLPXK5TWk5sgTdu88bTD9UP+CKbPPh5Rni1u0GjAdYQLemG8g+g==", + "version": "0.11.10", + "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.10.tgz", + "integrity": "sha512-KVVjQmNUepDVGXNuoRRdmmEjruj0KfiGSbS8LVc12LMsWDQzRXJ0qdhN8L8uUigKpfEHRhlaQFY0ib1tnUbNeQ==", "dependencies": { "@humanwhocodes/object-schema": "^1.2.1", "debug": "^4.1.1", @@ -2445,9 +2453,9 @@ "integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ==" }, "node_modules/acorn": { - "version": "8.8.2", - "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.8.2.tgz", - "integrity": "sha512-xjIYgE8HBrkpd/sJqOGNspf8uHG+NOHGOw6a/Urj8taM2EXfdNAH2oFcPeIFfsv3+kz/mJrS5VuMqbNLjCa2vw==", + "version": "8.10.0", + "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.10.0.tgz", + "integrity": "sha512-F0SAmZ8iUtS//m8DmCTA0jlh6TDKkHQyK6xc6V4KDTyZKA9dnvX9/3sRTVQrWm79glUAZbnmmNcdYwUIHWVybw==", "bin": { "acorn": "bin/acorn" }, @@ -4134,26 +4142,26 @@ } }, "node_modules/eslint": { - "version": "8.41.0", - "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.41.0.tgz", - "integrity": "sha512-WQDQpzGBOP5IrXPo4Hc0814r4/v2rrIsB0rhT7jtunIalgg6gYXWhRMOejVO8yH21T/FGaxjmFjBMNqcIlmH1Q==", + "version": "8.47.0", + "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.47.0.tgz", + "integrity": "sha512-spUQWrdPt+pRVP1TTJLmfRNJJHHZryFmptzcafwSvHsceV81djHOdnEeDmkdotZyLNjDhrOasNK8nikkoG1O8Q==", "dependencies": { "@eslint-community/eslint-utils": "^4.2.0", - "@eslint-community/regexpp": "^4.4.0", - "@eslint/eslintrc": "^2.0.3", - "@eslint/js": "8.41.0", - "@humanwhocodes/config-array": "^0.11.8", + "@eslint-community/regexpp": "^4.6.1", + "@eslint/eslintrc": "^2.1.2", + "@eslint/js": "^8.47.0", + "@humanwhocodes/config-array": "^0.11.10", "@humanwhocodes/module-importer": "^1.0.1", "@nodelib/fs.walk": "^1.2.8", - "ajv": "^6.10.0", + "ajv": "^6.12.4", "chalk": "^4.0.0", "cross-spawn": "^7.0.2", "debug": "^4.3.2", "doctrine": "^3.0.0", "escape-string-regexp": "^4.0.0", - "eslint-scope": "^7.2.0", - "eslint-visitor-keys": "^3.4.1", - "espree": "^9.5.2", + "eslint-scope": "^7.2.2", + "eslint-visitor-keys": "^3.4.3", + "espree": "^9.6.1", "esquery": "^1.4.2", "esutils": "^2.0.2", "fast-deep-equal": "^3.1.3", @@ -4163,7 +4171,6 @@ "globals": "^13.19.0", "graphemer": "^1.4.0", "ignore": "^5.2.0", - "import-fresh": "^3.0.0", "imurmurhash": "^0.1.4", "is-glob": "^4.0.0", "is-path-inside": "^3.0.3", @@ -4173,9 +4180,8 @@ "lodash.merge": "^4.6.2", "minimatch": "^3.1.2", "natural-compare": "^1.4.0", - "optionator": "^0.9.1", + "optionator": "^0.9.3", "strip-ansi": "^6.0.1", - "strip-json-comments": "^3.1.0", "text-table": "^0.2.0" }, "bin": { @@ -4476,9 +4482,9 @@ } }, "node_modules/eslint-scope": { - "version": "7.2.0", - "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-7.2.0.tgz", - "integrity": "sha512-DYj5deGlHBfMt15J7rdtyKNq/Nqlv5KfU4iodrQ019XESsRnwXH9KAE0y3cwtUHDo2ob7CypAnCqefh6vioWRw==", + "version": "7.2.2", + "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-7.2.2.tgz", + "integrity": "sha512-dOt21O7lTMhDM+X9mB4GX+DZrZtCUJPL/wlcTqxyrx5IvO0IYtILdtrQGQp+8n5S0gwSVmOf9NQrjMOgfQZlIg==", "dependencies": { "esrecurse": "^4.3.0", "estraverse": "^5.2.0" @@ -4491,9 +4497,9 @@ } }, "node_modules/eslint-visitor-keys": { - "version": "3.4.1", - "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.1.tgz", - "integrity": "sha512-pZnmmLwYzf+kWaM/Qgrvpen51upAktaaiI01nsJD/Yr3lMOdNtq0cxkrrg16w64VtisN6okbs7Q8AfGqj4c9fA==", + "version": "3.4.3", + "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz", + "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==", "engines": { "node": "^12.22.0 || ^14.17.0 || >=16.0.0" }, @@ -4502,11 +4508,11 @@ } }, "node_modules/espree": { - "version": "9.5.2", - "resolved": "https://registry.npmjs.org/espree/-/espree-9.5.2.tgz", - "integrity": "sha512-7OASN1Wma5fum5SrNhFMAMJxOUAbhyfQ8dQ//PJaJbNw0URTPWqIghHWt1MmAANKhHZIYOHruW4Kw4ruUWOdGw==", + "version": "9.6.1", + "resolved": "https://registry.npmjs.org/espree/-/espree-9.6.1.tgz", + "integrity": "sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ==", "dependencies": { - "acorn": "^8.8.0", + "acorn": "^8.9.0", "acorn-jsx": "^5.3.2", "eslint-visitor-keys": "^3.4.1" }, @@ -5016,9 +5022,9 @@ } }, "node_modules/globals": { - "version": "13.20.0", - "resolved": "https://registry.npmjs.org/globals/-/globals-13.20.0.tgz", - "integrity": "sha512-Qg5QtVkCy/kv3FUSlu4ukeZDVf9ee0iXLAUYX13gbR17bnejFTzr4iS9bY7kwCf1NztRNm1t91fjOiyx4CSwPQ==", + "version": "13.21.0", + "resolved": "https://registry.npmjs.org/globals/-/globals-13.21.0.tgz", + "integrity": "sha512-ybyme3s4yy/t/3s35bewwXKOf7cvzfreG2lH0lZl0JB7I4GxRP2ghxOK/Nb9EkRXdbBXZLfq/p/0W2JUONB/Gg==", "dependencies": { "type-fest": "^0.20.2" }, @@ -6608,16 +6614,16 @@ } }, "node_modules/optionator": { - "version": "0.9.1", - "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.1.tgz", - "integrity": "sha512-74RlY5FCnhq4jRxVUPKDaRwrVNXMqsGsiW6AJw4XK8hmtm10wC0ypZBLw5IIp85NZMr91+qd1RvvENwg7jjRFw==", + "version": "0.9.3", + "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.3.tgz", + "integrity": "sha512-JjCoypp+jKn1ttEFExxhetCKeJt9zhAgAve5FXHixTvFDW/5aEktX9bufBKLRRMdU7bNtpLfcGu94B3cdEJgjg==", "dependencies": { + "@aashutoshrathi/word-wrap": "^1.2.3", "deep-is": "^0.1.3", "fast-levenshtein": "^2.0.6", "levn": "^0.4.1", "prelude-ls": "^1.2.1", - "type-check": "^0.4.0", - "word-wrap": "^1.2.3" + "type-check": "^0.4.0" }, "engines": { "node": ">= 0.8.0" @@ -8921,14 +8927,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/word-wrap": { - "version": "1.2.3", - "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.3.tgz", - "integrity": "sha512-Hz/mrNwitNRh/HUAtM/VT/5VH+ygD6DV7mYKZAtHOrbs8U7lvPS6xf7EJKMF0uW1KJCl0H701g3ZGus+muE5vQ==", - "engines": { - "node": ">=0.10.0" - } - }, "node_modules/wrap-ansi": { "version": "7.0.0", "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz", diff --git a/package.json b/package.json index 87f6866..e81e498 100644 --- a/package.json +++ b/package.json @@ -25,7 +25,7 @@ "@vercel/analytics": "^1.0.1", "autoprefixer": "10.4.14", "emoji-picker-react": "^4.4.9", - "eslint": "8.41.0", + "eslint": "8.47.0", "eslint-config-next": "13.4.6", "hamburger-react": "^2.5.0", "loadash": "^1.0.0", From bf07f8d28989addcab933e7a8ada233240330e6a Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 21 Aug 2023 21:56:43 +0000 Subject: [PATCH 26/60] chore: bump @types/react-dom from 18.2.5 to 18.2.7 Bumps [@types/react-dom](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/HEAD/types/react-dom) from 18.2.5 to 18.2.7. - [Release notes](https://github.com/DefinitelyTyped/DefinitelyTyped/releases) - [Commits](https://github.com/DefinitelyTyped/DefinitelyTyped/commits/HEAD/types/react-dom) --- updated-dependencies: - dependency-name: "@types/react-dom" dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] --- package-lock.json | 8 ++++---- package.json | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package-lock.json b/package-lock.json index a1a6176..c297363 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15,7 +15,7 @@ "@semi-bot/semi-theme-mockdatanz": "^1.1.5", "@types/node": "20.1.4", "@types/react": "18.2.6", - "@types/react-dom": "18.2.5", + "@types/react-dom": "18.2.7", "@uiw/codemirror-extensions-langs": "^4.21.9", "@uiw/codemirror-themes": "^4.21.9", "@uiw/react-codemirror": "^4.19.16", @@ -2055,9 +2055,9 @@ } }, "node_modules/@types/react-dom": { - "version": "18.2.5", - "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.2.5.tgz", - "integrity": "sha512-sRQsOS/sCLnpQhR4DSKGTtWFE3FZjpQa86KPVbhUqdYMRZ9FEFcfAytKhR/vUG2rH1oFbOOej6cuD7MFSobDRQ==", + "version": "18.2.7", + "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.2.7.tgz", + "integrity": "sha512-GRaAEriuT4zp9N4p1i8BDBYmEyfo+xQ3yHjJU4eiK5NDa1RmUZG+unZABUTK4/Ox/M+GaHwb6Ow8rUITrtjszA==", "dependencies": { "@types/react": "*" } diff --git a/package.json b/package.json index 87f6866..6e5d97c 100644 --- a/package.json +++ b/package.json @@ -18,7 +18,7 @@ "@semi-bot/semi-theme-mockdatanz": "^1.1.5", "@types/node": "20.1.4", "@types/react": "18.2.6", - "@types/react-dom": "18.2.5", + "@types/react-dom": "18.2.7", "@uiw/codemirror-extensions-langs": "^4.21.9", "@uiw/codemirror-themes": "^4.21.9", "@uiw/react-codemirror": "^4.19.16", From 1a0da8fac2b804235f101433e3532b5ecff441dc Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 21 Aug 2023 21:56:49 +0000 Subject: [PATCH 27/60] chore: bump @vercel/analytics from 1.0.1 to 1.0.2 Bumps [@vercel/analytics](https://github.com/vercel/analytics/tree/HEAD/packages/web) from 1.0.1 to 1.0.2. - [Release notes](https://github.com/vercel/analytics/releases) - [Commits](https://github.com/vercel/analytics/commits/HEAD/packages/web) --- updated-dependencies: - dependency-name: "@vercel/analytics" dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] --- package-lock.json | 8 ++++---- package.json | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package-lock.json b/package-lock.json index a1a6176..1326f3b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -19,7 +19,7 @@ "@uiw/codemirror-extensions-langs": "^4.21.9", "@uiw/codemirror-themes": "^4.21.9", "@uiw/react-codemirror": "^4.19.16", - "@vercel/analytics": "^1.0.1", + "@vercel/analytics": "^1.0.2", "autoprefixer": "10.4.14", "emoji-picker-react": "^4.4.9", "eslint": "8.41.0", @@ -2299,9 +2299,9 @@ } }, "node_modules/@vercel/analytics": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/@vercel/analytics/-/analytics-1.0.1.tgz", - "integrity": "sha512-Ux0c9qUfkcPqng3vrR0GTrlQdqNJ2JREn/2ydrVuKwM3RtMfF2mWX31Ijqo1opSjNAq6rK76PwtANw6kl6TAow==" + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/@vercel/analytics/-/analytics-1.0.2.tgz", + "integrity": "sha512-BZFxVrv24VbNNl5xMxqUojQIegEeXMI6rX3rg1uVLYUEXsuKNBSAEQf4BWEcjQDp/8aYJOj6m8V4PUA3x/cxgg==" }, "node_modules/@webassemblyjs/ast": { "version": "1.11.5", diff --git a/package.json b/package.json index 87f6866..c501a80 100644 --- a/package.json +++ b/package.json @@ -22,7 +22,7 @@ "@uiw/codemirror-extensions-langs": "^4.21.9", "@uiw/codemirror-themes": "^4.21.9", "@uiw/react-codemirror": "^4.19.16", - "@vercel/analytics": "^1.0.1", + "@vercel/analytics": "^1.0.2", "autoprefixer": "10.4.14", "emoji-picker-react": "^4.4.9", "eslint": "8.41.0", From 812fd35bbf2bb3d4d788c8fe69f29fe478b6f449 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 21 Aug 2023 21:56:59 +0000 Subject: [PATCH 28/60] chore: bump tailwindcss from 3.3.2 to 3.3.3 Bumps [tailwindcss](https://github.com/tailwindlabs/tailwindcss) from 3.3.2 to 3.3.3. - [Release notes](https://github.com/tailwindlabs/tailwindcss/releases) - [Changelog](https://github.com/tailwindlabs/tailwindcss/blob/master/CHANGELOG.md) - [Commits](https://github.com/tailwindlabs/tailwindcss/compare/v3.3.2...v3.3.3) --- updated-dependencies: - dependency-name: tailwindcss dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] --- package-lock.json | 9 ++++----- package.json | 2 +- 2 files changed, 5 insertions(+), 6 deletions(-) diff --git a/package-lock.json b/package-lock.json index a1a6176..a50af81 100644 --- a/package-lock.json +++ b/package-lock.json @@ -40,7 +40,7 @@ "react-sparklines": "^1.7.0", "redux-persist": "^6.0.0", "sass": "^1.65.1", - "tailwindcss": "^3.3.2", + "tailwindcss": "^3.3.3", "tsx": "^3.12.7", "uuidjs": "^5.0.1" }, @@ -8269,9 +8269,9 @@ } }, "node_modules/tailwindcss": { - "version": "3.3.2", - "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.3.2.tgz", - "integrity": "sha512-9jPkMiIBXvPc2KywkraqsUfbfj+dHDb+JPWtSJa9MLFdrPyazI7q6WX2sUrm7R9eVR7qqv3Pas7EvQFzxKnI6w==", + "version": "3.3.3", + "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.3.3.tgz", + "integrity": "sha512-A0KgSkef7eE4Mf+nKJ83i75TMyq8HqY3qmFIJSWy8bNt0v1lG7jUcpGpoTFxAwYcWOphcTBLPPJg+bDfhDf52w==", "dependencies": { "@alloc/quick-lru": "^5.2.0", "arg": "^5.0.2", @@ -8293,7 +8293,6 @@ "postcss-load-config": "^4.0.1", "postcss-nested": "^6.0.1", "postcss-selector-parser": "^6.0.11", - "postcss-value-parser": "^4.2.0", "resolve": "^1.22.2", "sucrase": "^3.32.0" }, diff --git a/package.json b/package.json index 87f6866..a5e2dbb 100644 --- a/package.json +++ b/package.json @@ -43,7 +43,7 @@ "react-sparklines": "^1.7.0", "redux-persist": "^6.0.0", "sass": "^1.65.1", - "tailwindcss": "^3.3.2", + "tailwindcss": "^3.3.3", "tsx": "^3.12.7", "uuidjs": "^5.0.1" }, From 65e0cd22950f74991ddf422062f46926477f9f81 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Sun, 27 Aug 2023 23:20:06 +1200 Subject: [PATCH 29/60] feat: export notification bar (#187) --- package-lock.json | 221 +++++++++--------- package.json | 4 +- src/components/Exporter/src/ExportModal.tsx | 78 ++++++- src/components/Exporter/src/ExportPreview.tsx | 2 +- .../PreviewPanel/src/PreviewPanel.tsx | 2 +- .../Toolbar/src/components/NumOfRowInput.tsx | 10 +- src/constants/actions.ts | 1 + src/constants/config.ts | 2 +- src/locale/translations/en.ts | 4 +- src/locale/translations/zhCN.ts | 4 +- src/reducers/export/exportActions.ts | 10 +- src/reducers/export/exportReducer.ts | 12 +- src/reducers/export/exportSelectors.ts | 3 +- src/types/system.d.ts | 1 + 14 files changed, 207 insertions(+), 147 deletions(-) diff --git a/package-lock.json b/package-lock.json index 1ca91d0..b32fdfd 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,10 +9,10 @@ "version": "0.1.0", "dependencies": { "@douyinfe/semi-next": "^2.37.0", - "@douyinfe/semi-ui": "^2.36.0", + "@douyinfe/semi-ui": "^2.42.1", "@faker-js/faker": "^8.0.2", "@reduxjs/toolkit": "^1.9.5", - "@semi-bot/semi-theme-mockdatanz": "^1.1.5", + "@semi-bot/semi-theme-mockdatanz": "^1.1.6", "@types/node": "20.1.4", "@types/react": "18.2.6", "@types/react-dom": "18.2.5", @@ -243,18 +243,6 @@ "node": ">=6.9.0" } }, - "node_modules/@babel/runtime-corejs3": { - "version": "7.22.3", - "resolved": "https://registry.npmjs.org/@babel/runtime-corejs3/-/runtime-corejs3-7.22.3.tgz", - "integrity": "sha512-6bdmknScYKmt8I9VjsJuKKGr+TwUb555FTf6tT1P/ANlCjTHCiYLhiQ4X/O7J731w5NOqu8c1aYHEVuOwPz7jA==", - "dependencies": { - "core-js-pure": "^3.30.2", - "regenerator-runtime": "^0.13.11" - }, - "engines": { - "node": ">=6.9.0" - } - }, "node_modules/@babel/template": { "version": "7.20.7", "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.20.7.tgz", @@ -694,44 +682,84 @@ "ms": "^2.1.1" } }, - "node_modules/@douyinfe/semi-animation": { - "version": "2.36.0", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation/-/semi-animation-2.36.0.tgz", - "integrity": "sha512-+VgtnsT1//EnotjicQnecL0jLSZhbwX3uRIGfu+bXB3fH1B6wd24xsMGOe+sjawOYyh1leqSdzPnelMxZbg7KQ==", + "node_modules/@dnd-kit/accessibility": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/@dnd-kit/accessibility/-/accessibility-3.0.1.tgz", + "integrity": "sha512-HXRrwS9YUYQO9lFRc/49uO/VICbM+O+ZRpFDe9Pd1rwVv2PCNkRiTZRdxrDgng/UkvdC3Re9r2vwPpXXrWeFzg==", "dependencies": { - "bezier-easing": "^2.1.0" + "tslib": "^2.0.0" + }, + "peerDependencies": { + "react": ">=16.8.0" } }, - "node_modules/@douyinfe/semi-animation-react": { - "version": "2.36.0", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation-react/-/semi-animation-react-2.36.0.tgz", - "integrity": "sha512-W9wYVBx+B8N2dyT8A8tNXI2WbLaYzJcqbpViukiKQO+W5s+GsNzWOCssWo/Aqt1+WS/Y3I309+auClpVHTkI8A==", + "node_modules/@dnd-kit/core": { + "version": "6.0.8", + "resolved": "https://registry.npmjs.org/@dnd-kit/core/-/core-6.0.8.tgz", + "integrity": "sha512-lYaoP8yHTQSLlZe6Rr9qogouGUz9oRUj4AHhDQGQzq/hqaJRpFo65X+JKsdHf8oUFBzx5A+SJPUvxAwTF2OabA==", "dependencies": { - "@douyinfe/semi-animation": "2.12.0", - "@douyinfe/semi-animation-styled": "2.23.2", - "classnames": "^2.2.6" + "@dnd-kit/accessibility": "^3.0.0", + "@dnd-kit/utilities": "^3.2.1", + "tslib": "^2.0.0" + }, + "peerDependencies": { + "react": ">=16.8.0", + "react-dom": ">=16.8.0" } }, - "node_modules/@douyinfe/semi-animation-react/node_modules/@douyinfe/semi-animation": { - "version": "2.12.0", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation/-/semi-animation-2.12.0.tgz", - "integrity": "sha512-OAfL9Nk38ZPqfdKm9k4cvVXXzm16ALI4LxGNZ0qfe2RCLLnYGB/hNzTctoTDjYD35dFv0yroh3qsXtZuP2xNdg==", + "node_modules/@dnd-kit/sortable": { + "version": "7.0.2", + "resolved": "https://registry.npmjs.org/@dnd-kit/sortable/-/sortable-7.0.2.tgz", + "integrity": "sha512-wDkBHHf9iCi1veM834Gbk1429bd4lHX4RpAwT0y2cHLf246GAvU2sVw/oxWNpPKQNQRQaeGXhAVgrOl1IT+iyA==", + "dependencies": { + "@dnd-kit/utilities": "^3.2.0", + "tslib": "^2.0.0" + }, + "peerDependencies": { + "@dnd-kit/core": "^6.0.7", + "react": ">=16.8.0" + } + }, + "node_modules/@dnd-kit/utilities": { + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/@dnd-kit/utilities/-/utilities-3.2.1.tgz", + "integrity": "sha512-OOXqISfvBw/1REtkSK2N3Fi2EQiLMlWUlqnOK/UpOISqBZPWpE6TqL+jcPtMOkE8TqYGiURvRdPSI9hltNUjEA==", + "dependencies": { + "tslib": "^2.0.0" + }, + "peerDependencies": { + "react": ">=16.8.0" + } + }, + "node_modules/@douyinfe/semi-animation": { + "version": "2.42.1", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation/-/semi-animation-2.42.1.tgz", + "integrity": "sha512-7Ks/pvaz6m0u9AtYM8WnBKYKCvQKtHEgJdoBRoYnomyyNmLe9dK37do6GjJtHscWh+VbZWXj47lCHOuBwy9PIA==", "dependencies": { - "@babel/runtime-corejs3": "^7.15.4", "bezier-easing": "^2.1.0" } }, + "node_modules/@douyinfe/semi-animation-react": { + "version": "2.42.1", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation-react/-/semi-animation-react-2.42.1.tgz", + "integrity": "sha512-zu6+VOyjoF5dEVU/yxIZN8jYHgprjTFQaXvEdROYMXZobSU9iwW2V0NblO2ORqLPmDUSyjIIYfoSsVABlgehrw==", + "dependencies": { + "@douyinfe/semi-animation": "2.42.1", + "@douyinfe/semi-animation-styled": "2.42.1", + "classnames": "^2.2.6" + } + }, "node_modules/@douyinfe/semi-animation-styled": { - "version": "2.23.2", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation-styled/-/semi-animation-styled-2.23.2.tgz", - "integrity": "sha512-cKaA1yGHPF76Rx7EZDZicj+1oX1su2wnqb/UGFOTquAwqWmkTfgQ+EKxCd/N704WH+RtmGf4xbrJKpBvvcEdSQ==" + "version": "2.42.1", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation-styled/-/semi-animation-styled-2.42.1.tgz", + "integrity": "sha512-iFeog9TyN+ctzh44QNOg1YSLYHQqxnhw0S/DwtMPHTB4Yc2Vm+VZtjX/dwl5YuwfmGmoGg+aE0PHLeIAKsm+zQ==" }, "node_modules/@douyinfe/semi-foundation": { - "version": "2.36.0", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-foundation/-/semi-foundation-2.36.0.tgz", - "integrity": "sha512-lcDxviFlYdoq9KQTYQ0S+7x1ia8vWdu/uH3ACWAIZyUQ3W5Zd7pmDdmw9QsfQgdViJb9GnrejFrzgFEi4iEQjA==", + "version": "2.42.1", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-foundation/-/semi-foundation-2.42.1.tgz", + "integrity": "sha512-BFmAL/T6VavaFU9ncDJLOAE8YYG0ny45Lh0/OP9KBRWoYheCZa9coURjqo/kQFl7y2Lrrpfz62ak1Fh+Esstdw==", "dependencies": { - "@douyinfe/semi-animation": "2.12.0", + "@douyinfe/semi-animation": "2.42.1", "async-validator": "^3.5.0", "classnames": "^2.2.6", "date-fns": "^2.29.3", @@ -741,19 +769,10 @@ "scroll-into-view-if-needed": "^2.2.24" } }, - "node_modules/@douyinfe/semi-foundation/node_modules/@douyinfe/semi-animation": { - "version": "2.12.0", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation/-/semi-animation-2.12.0.tgz", - "integrity": "sha512-OAfL9Nk38ZPqfdKm9k4cvVXXzm16ALI4LxGNZ0qfe2RCLLnYGB/hNzTctoTDjYD35dFv0yroh3qsXtZuP2xNdg==", - "dependencies": { - "@babel/runtime-corejs3": "^7.15.4", - "bezier-easing": "^2.1.0" - } - }, "node_modules/@douyinfe/semi-icons": { - "version": "2.36.0", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-icons/-/semi-icons-2.36.0.tgz", - "integrity": "sha512-BGnbxCdZ9uhHqvIR73lhulF0jxDEWZU45PxxHDBvaAmx2zcvfMeDcdjJWIco0Pqeo5sfCwDEOYUHIWdq/9v7cw==", + "version": "2.42.1", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-icons/-/semi-icons-2.42.1.tgz", + "integrity": "sha512-vIo010+zF2pF9WXz7E+TLkiQrIZ38nilPzn+jsfgO0v32w0Dd1DXu1Nja7Aw4k9LHx5ViLPQCOS4bCCfiSF6TA==", "dependencies": { "classnames": "^2.2.6" }, @@ -762,9 +781,9 @@ } }, "node_modules/@douyinfe/semi-illustrations": { - "version": "2.36.0", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-illustrations/-/semi-illustrations-2.36.0.tgz", - "integrity": "sha512-JTeCejgvPb8KqS+8dlOU5n5SoMQLcLK4FHfkMPcRA14ysmqdgNhrESLT+0WMNyB2A5RvfpNOBY/3ZGgi/veu5g==", + "version": "2.42.1", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-illustrations/-/semi-illustrations-2.42.1.tgz", + "integrity": "sha512-rdHcGv0JxSd1M/WMrp/l7iQ5QoVafxwzdFPexzsmbjYlVY/nQhnvCGSKorDl5BwG1en5RsqSbyvZvJA0Xxrv5w==", "peerDependencies": { "react": "^16.8.0 || ^17.0.0 || ^18.0.0" } @@ -778,24 +797,27 @@ } }, "node_modules/@douyinfe/semi-theme-default": { - "version": "2.36.0", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-theme-default/-/semi-theme-default-2.36.0.tgz", - "integrity": "sha512-Z6U+Z9b0W3QJlFAFjR0dljLKl3/jFMXhwfefc9LHKiA/yaYJGzTEPgKiTDU7p98rTiCxjTvWkeZSb6/dI0kq3Q==", + "version": "2.42.1", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-theme-default/-/semi-theme-default-2.42.1.tgz", + "integrity": "sha512-HdAvzwLM1XAaeC2nzByzsib+9VF52HmnJPRWb8uC1MBXM42zFd/DtgwlSD+Rxtu3lvMHq87XLN54/VCWODocfg==", "dependencies": { "glob": "^7.1.6" } }, "node_modules/@douyinfe/semi-ui": { - "version": "2.36.0", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-ui/-/semi-ui-2.36.0.tgz", - "integrity": "sha512-6xGoQsy6Li1GZmEhRgZ5bSXSYEz3HrzpbfylSJbYb866zsMCl4VRzq4BkB4tebwJz/WmK8JSE6mfFauMYrLqYQ==", - "dependencies": { - "@douyinfe/semi-animation": "2.36.0", - "@douyinfe/semi-animation-react": "2.36.0", - "@douyinfe/semi-foundation": "2.36.0", - "@douyinfe/semi-icons": "2.36.0", - "@douyinfe/semi-illustrations": "2.36.0", - "@douyinfe/semi-theme-default": "2.36.0", + "version": "2.42.1", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-ui/-/semi-ui-2.42.1.tgz", + "integrity": "sha512-UUlnZNao9eUcPIUwdmahrCFxnCZQxogr1DmozPN2jEDHUaOjqFsAd3maugGMtWDksVt3SCBUJQJqqdETh7qJDw==", + "dependencies": { + "@dnd-kit/core": "^6.0.8", + "@dnd-kit/sortable": "^7.0.2", + "@dnd-kit/utilities": "^3.2.1", + "@douyinfe/semi-animation": "2.42.1", + "@douyinfe/semi-animation-react": "2.42.1", + "@douyinfe/semi-foundation": "2.42.1", + "@douyinfe/semi-icons": "2.42.1", + "@douyinfe/semi-illustrations": "2.42.1", + "@douyinfe/semi-theme-default": "2.42.1", "async-validator": "^3.5.0", "classnames": "^2.2.6", "copy-text-to-clipboard": "^2.1.1", @@ -803,8 +825,7 @@ "date-fns-tz": "^1.3.8", "lodash": "^4.17.21", "prop-types": "^15.7.2", - "react-resizable": "^1.8.0", - "react-sortable-hoc": "^2.0.0", + "react-resizable": "^3.0.5", "react-window": "^1.8.2", "resize-observer-polyfill": "^1.5.1", "scroll-into-view-if-needed": "^2.2.24", @@ -815,34 +836,6 @@ "react-dom": ">=16.0.0" } }, - "node_modules/@douyinfe/semi-ui/node_modules/react-resizable": { - "version": "1.11.1", - "resolved": "https://registry.npmjs.org/react-resizable/-/react-resizable-1.11.1.tgz", - "integrity": "sha512-S70gbLaAYqjuAd49utRHibtHLrHXInh7GuOR+6OO6RO6uleQfuBnWmZjRABfqNEx3C3Z6VPLg0/0uOYFrkfu9Q==", - "dependencies": { - "prop-types": "15.x", - "react-draggable": "^4.0.3" - }, - "peerDependencies": { - "react": "0.14.x || 15.x || 16.x || 17.x", - "react-dom": "0.14.x || 15.x || 16.x || 17.x" - } - }, - "node_modules/@douyinfe/semi-ui/node_modules/react-sortable-hoc": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/react-sortable-hoc/-/react-sortable-hoc-2.0.0.tgz", - "integrity": "sha512-JZUw7hBsAHXK7PTyErJyI7SopSBFRcFHDjWW5SWjcugY0i6iH7f+eJkY8cJmGMlZ1C9xz1J3Vjz0plFpavVeRg==", - "dependencies": { - "@babel/runtime": "^7.2.0", - "invariant": "^2.2.4", - "prop-types": "^15.5.7" - }, - "peerDependencies": { - "prop-types": "^15.5.7", - "react": "^16.3.0 || ^17.0.0", - "react-dom": "^16.3.0 || ^17.0.0" - } - }, "node_modules/@douyinfe/semi-webpack-plugin": { "version": "2.23.2", "resolved": "https://registry.npmjs.org/@douyinfe/semi-webpack-plugin/-/semi-webpack-plugin-2.23.2.tgz", @@ -1925,9 +1918,9 @@ "integrity": "sha512-sXo/qW2/pAcmT43VoRKOJbDOfV3cYpq3szSVfIThQXNt+E4DfKj361vaAt3c88U5tPUxzEswam7GW48PJqtKAg==" }, "node_modules/@semi-bot/semi-theme-mockdatanz": { - "version": "1.1.5", - "resolved": "https://registry.npmjs.org/@semi-bot/semi-theme-mockdatanz/-/semi-theme-mockdatanz-1.1.5.tgz", - "integrity": "sha512-u4JHNJlQ9yZWr45T6ZzGqjSIBSIP33oX3WpRsblDun5XuMtXN3/KJn2I2JmDTHf0N6Ix7l4KtLnvurUEFCNBpw==" + "version": "1.1.6", + "resolved": "https://registry.npmjs.org/@semi-bot/semi-theme-mockdatanz/-/semi-theme-mockdatanz-1.1.6.tgz", + "integrity": "sha512-8wr4tEOtJc76LJa9s8tpEPVf5s/E3sakEFb3kna2awihb7TySXhbTUkGYTuMnBxtFhfIM9qnUJ4N2lajDE/DAg==" }, "node_modules/@swc/helpers": { "version": "0.5.1", @@ -3344,16 +3337,6 @@ "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/core-js-pure": { - "version": "3.30.2", - "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.30.2.tgz", - "integrity": "sha512-p/npFUJXXBkCCTIlEGBdghofn00jWG6ZOtdoIXSJmAu2QBvN0IqpZXWweOytcwE6cfx8ZvVUy1vw8zxhe4Y2vg==", - "hasInstallScript": true, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/core-js" - } - }, "node_modules/core-util-is": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz", @@ -5307,14 +5290,6 @@ "tslib": "^2.4.0" } }, - "node_modules/invariant": { - "version": "2.2.4", - "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz", - "integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==", - "dependencies": { - "loose-envify": "^1.0.0" - } - }, "node_modules/is-arguments": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/is-arguments/-/is-arguments-1.1.1.tgz", @@ -7272,6 +7247,18 @@ "react": "^16.0.0 || ^17.0.0 || ^18.0.0" } }, + "node_modules/react-resizable": { + "version": "3.0.5", + "resolved": "https://registry.npmjs.org/react-resizable/-/react-resizable-3.0.5.tgz", + "integrity": "sha512-vKpeHhI5OZvYn82kXOs1bC8aOXktGU5AmKAgaZS4F5JPburCtbmDPqE7Pzp+1kN4+Wb81LlF33VpGwWwtXem+w==", + "dependencies": { + "prop-types": "15.x", + "react-draggable": "^4.0.3" + }, + "peerDependencies": { + "react": ">= 16.3" + } + }, "node_modules/react-sparklines": { "version": "1.7.0", "resolved": "https://registry.npmjs.org/react-sparklines/-/react-sparklines-1.7.0.tgz", diff --git a/package.json b/package.json index 703ef02..7b8fb9d 100644 --- a/package.json +++ b/package.json @@ -12,10 +12,10 @@ }, "dependencies": { "@douyinfe/semi-next": "^2.37.0", - "@douyinfe/semi-ui": "^2.36.0", + "@douyinfe/semi-ui": "^2.42.1", "@faker-js/faker": "^8.0.2", "@reduxjs/toolkit": "^1.9.5", - "@semi-bot/semi-theme-mockdatanz": "^1.1.5", + "@semi-bot/semi-theme-mockdatanz": "^1.1.6", "@types/node": "20.1.4", "@types/react": "18.2.6", "@types/react-dom": "18.2.5", diff --git a/src/components/Exporter/src/ExportModal.tsx b/src/components/Exporter/src/ExportModal.tsx index 1bd355d..79cabfe 100644 --- a/src/components/Exporter/src/ExportModal.tsx +++ b/src/components/Exporter/src/ExportModal.tsx @@ -1,5 +1,5 @@ import React, {useEffect, useState} from 'react'; -import {Button, Modal} from "@douyinfe/semi-ui"; +import {Button, Modal, Notification, Progress, Spin, Toast, Typography} from "@douyinfe/semi-ui"; import {useDispatch, useSelector} from "react-redux"; import { selectCurrentNumOfRowsGenerated, @@ -8,9 +8,14 @@ import { selectExportProcessStage, selectShowExportModal, selectSparkLineData, - selectTimeElapsed + selectExportNotificationId } from "@/reducers/export/exportSelectors"; -import {doOnBatchComplete, doSetExportProcessStage, doSetShowExportModal,} from "@/reducers/export/exportActions"; +import { + doOnBatchComplete, + doSetExportNotificationId, + doSetExportProcessStage, + doSetShowExportModal, +} from "@/reducers/export/exportActions"; import {FormattedMessage} from "@/locale"; import { selectDataFields, @@ -23,15 +28,19 @@ import {ExportProcessStage} from "@/constants/enums"; import {ExportDash} from "@/components/Exporter/src/ExportDash"; import {batchGenerateData} from "@/utils/generatorUtils"; import {GenerateDataBatchCompletedCallbackResponse} from "@/types/generator"; +import styles from "@/components/Exporter/src/ExportDash.module.scss"; +import {IconTickCircle} from "@douyinfe/semi-icons"; +import {getFileExtensionByFormat} from "@/utils/formatterUtils"; export const ExportModal: React.FunctionComponent = () => { const dispatch = useDispatch(); + const {Text} = Typography; // state const [totalTimerSeconds, setTotalTimerSeconds] = useState(0); // selectors - const visible = useSelector(selectShowExportModal); + const modalVisible = useSelector(selectShowExportModal); const estimatedSize = useSelector(selectEstimatedFileSize); const format = useSelector(selectExportFormat); const exportFileName = useSelector(selectExportFileName); @@ -42,9 +51,10 @@ export const ExportModal: React.FunctionComponent = () => { const sortableIdList = useSelector(selectDataFieldsSortableIdsList); const dataFields = useSelector(selectDataFields); const totalNumOfRowsGenerated = useSelector(selectCurrentNumOfRowsGenerated); - const timeElapsed = useSelector(selectTimeElapsed); - // effect + let percent = totalNumOfRowsGenerated / exportRows; + + // effects useEffect(() => { let interval = null; @@ -61,6 +71,43 @@ export const ExportModal: React.FunctionComponent = () => { }; }, [exportProcessStage]); + useEffect(() => { + if (!modalVisible) { + if (exportProcessStage == ExportProcessStage.GENERATING) { + Toast.info({ + id: 'exportNotification', + content: + + {exportFileName}.{getFileExtensionByFormat(format)} + 详情 + , + duration: 0, + showClose: false, + icon: + }) + } else if (exportProcessStage == ExportProcessStage.COMPLETED) { + Toast.success( + { + id: 'exportNotification', + content: + + {exportFileName}.{getFileExtensionByFormat(format)} + 详情 + , + icon: + }) + } else { + + } + } else { + Toast.close('exportNotification'); + } + }, [exportProcessStage, modalVisible, percent, exportFileName, format]); + // render const renderModalContent = () => { if (exportProcessStage == ExportProcessStage.PREVIEW) { @@ -81,6 +128,10 @@ export const ExportModal: React.FunctionComponent = () => { dispatch(doSetShowExportModal(false)); } + const onOpenModal = () => { + dispatch(doSetShowExportModal(true)); + } + // generate const onGenerate = async () => { dispatch(doSetExportProcessStage(ExportProcessStage.GENERATING)); @@ -107,10 +158,17 @@ export const ExportModal: React.FunctionComponent = () => { case ExportProcessStage.GENERATING: return <> - + + + case ExportProcessStage.COMPLETED: + return <> + } @@ -121,7 +179,7 @@ export const ExportModal: React.FunctionComponent = () => { } onCancel={onCloseModal} footer={renderModalFooter()} diff --git a/src/components/Exporter/src/ExportPreview.tsx b/src/components/Exporter/src/ExportPreview.tsx index c4e758b..9ed35b3 100644 --- a/src/components/Exporter/src/ExportPreview.tsx +++ b/src/components/Exporter/src/ExportPreview.tsx @@ -60,7 +60,7 @@ export const ExportPreview: React.FunctionComponent = ({...p
- +
diff --git a/src/components/PreviewPanel/src/PreviewPanel.tsx b/src/components/PreviewPanel/src/PreviewPanel.tsx index 3f92186..554ccfd 100644 --- a/src/components/PreviewPanel/src/PreviewPanel.tsx +++ b/src/components/PreviewPanel/src/PreviewPanel.tsx @@ -41,7 +41,7 @@ export const PreviewPanel: React.FunctionComponent = () => { }, [containerRef]); return ( -
+
{previewType === PreviewType.RAW ? diff --git a/src/components/Toolbar/src/components/NumOfRowInput.tsx b/src/components/Toolbar/src/components/NumOfRowInput.tsx index de32cba..70d0e1c 100644 --- a/src/components/Toolbar/src/components/NumOfRowInput.tsx +++ b/src/components/Toolbar/src/components/NumOfRowInput.tsx @@ -4,19 +4,17 @@ import {useIntl} from "@/locale"; import {useDispatch, useSelector} from "react-redux"; import {doSetNumberOfExportRows} from "@/reducers/workspace/workspaceActions"; import {MAX_NUMBER_EXPORT_ROWS, MIN_NUMBER_EXPORT_ROWS} from "@/constants/config"; -import {ComponentSize} from "@/constants/enums"; import {selectNumberOfExportRows} from "@/reducers/workspace/workspaceSelectors"; import {ErrorTooltip} from "@/components/Utils"; import {isNullOrWhiteSpace} from "@/utils/stringUtils"; export type NumbOfRowInputProps = { - size: ComponentSize, errorMessage?: string, } export const NumbOfRowInput: React.FC = ({...props}) => { - const {size, errorMessage} = props; + const {errorMessage} = props; const intl = useIntl(); const dispatch = useDispatch(); @@ -36,12 +34,10 @@ export const NumbOfRowInput: React.FC = ({...props}) => { value={numOfExportRows} validateStatus={isNullOrWhiteSpace(errorMessage) ? 'default' : 'error'} onChange={handleInputNumberChange} - suffix={size === 'large' ? intl.formatMessage({id: 'toolbar.numOfRowInput.suffix'}) : null} + suffix={intl.formatMessage({id: 'toolbar.numOfRowInput.suffix'})} defaultValue={1} - placeholder={size === 'small' ? intl.formatMessage({id: 'toolbar.numOfRowInput.suffix'}) : null} style={{ - width: size === 'large' ? - '150px' : '100px', marginRight: '9px' + width: '200px', marginRight: '9px' }} /> diff --git a/src/constants/actions.ts b/src/constants/actions.ts index fe4d010..1c0e93b 100644 --- a/src/constants/actions.ts +++ b/src/constants/actions.ts @@ -28,6 +28,7 @@ export const GENERATE_SPECIFIC_FIELD_PREVIEW_DATA = 'GENERATE_SPECIFIC_FIELD_PRE export const FORMAT_PREVIEW_DATA = 'FORMAT_DATA'; export const UPDATE_DATA_FIELD_NAME = 'UPDATE_DATA_FIELD_NAME'; export const ON_BATCH_GENERATE_COMPLETE = 'ON_BATCH_GENERATE_COMPLETE'; +export const SET_EXPORT_NOTIFICATION_ID = 'SET_EXPORT_NOTIFICATION_ID'; // preview export const SET_PREVIEW_TYPE = 'SET_PREVIEW_TYPE'; diff --git a/src/constants/config.ts b/src/constants/config.ts index e14ba11..0261ec4 100644 --- a/src/constants/config.ts +++ b/src/constants/config.ts @@ -6,7 +6,7 @@ export const DEFAULT_COLOR_MODE = ColorMode.DARK; // exporter export const DEFAULT_NUMBER_EXPORT_ROWS = 100; -export const MAX_NUMBER_EXPORT_ROWS = 999999; +export const MAX_NUMBER_EXPORT_ROWS = 999999999; export const MIN_NUMBER_EXPORT_ROWS = 1; export const DEFAULT_EXPORT_FILE_NAME = 'data-export'; diff --git a/src/locale/translations/en.ts b/src/locale/translations/en.ts index 1838fe8..322ceb1 100644 --- a/src/locale/translations/en.ts +++ b/src/locale/translations/en.ts @@ -14,7 +14,7 @@ export const en = { "export.configurator.config.empty": "Configuration of this export format is currently not available.", // export modal - "export.modal.title": "Generate", + "export.modal.title": "Batch Generate", "export.modal.exportNumOfRows.label": "Rows to generate", "export.modal.exportNumOfRows.empty": "Rows to generate cannot be empty", "export.modal.exportFormat.label": "Export format", @@ -24,6 +24,8 @@ export const en = { "export.modal.exportFileName.empty": "File name cannot be empty", "export.modal.cancel.button.text": "Cancel", "export.modal.generate.button.text": "Generate", + "export.modal.hide.button.text": "Hide", + "export.modal.terminate.button.text": "Terminate", "export.modal.generating.rows.text": "Rows", "export.modal.generating.time.text": "Time", diff --git a/src/locale/translations/zhCN.ts b/src/locale/translations/zhCN.ts index 03fb8da..12add06 100644 --- a/src/locale/translations/zhCN.ts +++ b/src/locale/translations/zhCN.ts @@ -13,7 +13,7 @@ export const zhCN = { "export.configurator.config.empty": "该输出格式的配置暂时还不可用", // export modal - "export.modal.title": "生成数据", + "export.modal.title": "批量生成数据", "export.modal.exportNumOfRows.label": "生成数据行数", "export.modal.exportNumOfRows.empty": "生成数据行数不能为空", "export.modal.exportFormat.label": "生成格式", @@ -23,6 +23,8 @@ export const zhCN = { "export.modal.exportFileName.empty": "文件名不能为空", "export.modal.cancel.button.text": "取消", "export.modal.generate.button.text": "生成", + "export.modal.hide.button.text": "隐藏", + "export.modal.terminate.button.text": "终止", "export.modal.generating.rows.text": "行数", "export.modal.generating.time.text": "时间", diff --git a/src/reducers/export/exportActions.ts b/src/reducers/export/exportActions.ts index f3fd723..d404d25 100644 --- a/src/reducers/export/exportActions.ts +++ b/src/reducers/export/exportActions.ts @@ -1,6 +1,6 @@ import { ON_BATCH_GENERATE_COMPLETE, - SET_EXPORT_FILE_NAME, + SET_EXPORT_FILE_NAME, SET_EXPORT_NOTIFICATION_ID, SET_EXPORT_PROCESS_STAGE, SET_SHOW_EXPORT_MODAL } from "@/constants/actions"; @@ -29,4 +29,10 @@ export const doSetExportProcessStage = (stage: ExportProcessStage): any => export const doOnBatchComplete = (response: GenerateDataBatchCompletedCallbackResponse): any => async dispatch => { dispatch({type: ON_BATCH_GENERATE_COMPLETE, payload: response}); - }; \ No newline at end of file + }; + +// set export notification id +export const doSetExportNotificationId = (id: string): any => + async dispatch => { + dispatch({type: SET_EXPORT_NOTIFICATION_ID, payload: id}) + } \ No newline at end of file diff --git a/src/reducers/export/exportReducer.ts b/src/reducers/export/exportReducer.ts index b761aaf..6542b3e 100644 --- a/src/reducers/export/exportReducer.ts +++ b/src/reducers/export/exportReducer.ts @@ -1,7 +1,7 @@ import {Action, ExportReducerState} from "@/types/system"; import { ON_BATCH_GENERATE_COMPLETE, - SET_EXPORT_FILE_NAME, + SET_EXPORT_FILE_NAME, SET_EXPORT_NOTIFICATION_ID, SET_EXPORT_PROCESS_STAGE, SET_SHOW_EXPORT_MODAL } from "@/constants/actions"; @@ -16,7 +16,8 @@ export const initStates: ExportReducerState = { currentNumOfRowsGenerated: 0, sparkLineData: [0, 0, 0, 0, 0, 0, 0], formattedExportData: "", - timeElapsed: 0 + timeElapsed: 0, + exportNotificationId: null } const exportReducer = (state: ExportReducerState = initStates, action: Action) => { @@ -35,7 +36,7 @@ const exportReducer = (state: ExportReducerState = initStates, action: Action) = return { ...state, exportProcessStage: action.payload - } + }; case ON_BATCH_GENERATE_COMPLETE: const newSparkLineData = [...state.sparkLineData, action.payload.batchTimeElapsed]; // 创建新的数组副本，包含新值 return { @@ -44,6 +45,11 @@ const exportReducer = (state: ExportReducerState = initStates, action: Action) = timeElapsed: action.payload.totalTimeElapsed, sparkLineData: newSparkLineData }; + case SET_EXPORT_NOTIFICATION_ID: + return { + ...state, + exportNotificationId: action.payload + }; default: return state; } diff --git a/src/reducers/export/exportSelectors.ts b/src/reducers/export/exportSelectors.ts index ce58331..36591be 100644 --- a/src/reducers/export/exportSelectors.ts +++ b/src/reducers/export/exportSelectors.ts @@ -17,6 +17,7 @@ export const selectCurrentNumOfRowsGenerated = (state: RootState) => state.expor export const selectSparkLineData = (state: RootState) => state.export.sparkLineData; export const selectFormattedExportData = (state: RootState) => state.export.formattedExportData; export const selectTimeElapsed = (state: RootState) => state.export.timeElapsed; +export const selectExportNotificationId = (state: RootState) => state.export.exportNotificationId; export const selectEstimatedFileSize = createSelector( selectPreviewFormattedData, @@ -42,7 +43,7 @@ export const selectPreviewEstimatedTime = createSelector( const endTime = performance.now(); const executionTime = endTime - startTime; const averageTime = executionTime / 20; - console.log(averageTime*numberOfExportRows); + console.log(averageTime * numberOfExportRows); return averageTime * numberOfExportRows; } ); diff --git a/src/types/system.d.ts b/src/types/system.d.ts index 97e3192..e0af483 100644 --- a/src/types/system.d.ts +++ b/src/types/system.d.ts @@ -61,6 +61,7 @@ export interface ExportReducerState { sparkLineData: number[]; formattedExportData: string; timeElapsed: number; + exportNotificationId: string } // locales From dc3bfc34128e1e66479d8c787834cb5febfd85b5 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Mon, 28 Aug 2023 00:08:36 +1200 Subject: [PATCH 30/60] feat: optimiz spark line charts (#193) --- .../Exporter/src/ExportDash.module.scss | 1 + src/components/Exporter/src/ExportDash.tsx | 54 ++++++++----- src/components/Exporter/src/ExportModal.tsx | 81 ++++++++++--------- src/constants/actions.ts | 1 - src/locale/translations/en.ts | 3 + src/locale/translations/zhCN.ts | 3 + src/reducers/export/exportReducer.ts | 9 +-- src/reducers/export/exportSelectors.ts | 6 +- src/types/system.d.ts | 2 - 9 files changed, 84 insertions(+), 76 deletions(-) diff --git a/src/components/Exporter/src/ExportDash.module.scss b/src/components/Exporter/src/ExportDash.module.scss index efa04e6..ae60a07 100644 --- a/src/components/Exporter/src/ExportDash.module.scss +++ b/src/components/Exporter/src/ExportDash.module.scss @@ -15,6 +15,7 @@ .exportDescription { margin: 9px; + width: 100%; .exportDescription__sparkline { margin-top: 15px; diff --git a/src/components/Exporter/src/ExportDash.tsx b/src/components/Exporter/src/ExportDash.tsx index ece572a..b6fc74e 100644 --- a/src/components/Exporter/src/ExportDash.tsx +++ b/src/components/Exporter/src/ExportDash.tsx @@ -4,11 +4,12 @@ import styles from './ExportDash.module.scss'; import {Sparklines, SparklinesLine} from 'react-sparklines'; import {useSelector} from "react-redux"; import {selectColorMode} from "@/reducers/app/appSelectors"; -import {ColorMode} from "@/constants/enums"; +import {ColorMode, ExportProcessStage} from "@/constants/enums"; import {FormattedMessage} from "@/locale"; import {parseTCH, parseTimeCount} from "@/utils/stringUtils"; export interface ExportProgressDashProps { + exportStage: ExportProcessStage; exportRows: number; currentExportedRows: number; sparkLineData: number[]; @@ -16,7 +17,7 @@ export interface ExportProgressDashProps { } export const ExportDash: React.FunctionComponent = ({...props}) => { - const {exportRows, currentExportedRows, sparkLineData, timeElapsed} = props; + const {exportStage, exportRows, currentExportedRows, sparkLineData, timeElapsed} = props; const {Numeral} = Typography; // percent @@ -27,38 +28,49 @@ export const ExportDash: React.FunctionComponent = ({.. return (
- - {percent} - } + format={per => { + return percent === 1 ? +
+ +
: + + {percent} + + }} />
- - }> - - {currentExportedRows} - - - - }> - - {timeElapsed} - - - +
+ + }> + + {currentExportedRows} + + + }> + + {timeElapsed} + + + +
- +
diff --git a/src/components/Exporter/src/ExportModal.tsx b/src/components/Exporter/src/ExportModal.tsx index 79cabfe..e7045f9 100644 --- a/src/components/Exporter/src/ExportModal.tsx +++ b/src/components/Exporter/src/ExportModal.tsx @@ -1,5 +1,5 @@ import React, {useEffect, useState} from 'react'; -import {Button, Modal, Notification, Progress, Spin, Toast, Typography} from "@douyinfe/semi-ui"; +import {Button, Modal, Progress, Toast, Typography} from "@douyinfe/semi-ui"; import {useDispatch, useSelector} from "react-redux"; import { selectCurrentNumOfRowsGenerated, @@ -8,15 +8,12 @@ import { selectExportProcessStage, selectShowExportModal, selectSparkLineData, - selectExportNotificationId } from "@/reducers/export/exportSelectors"; import { doOnBatchComplete, - doSetExportNotificationId, doSetExportProcessStage, doSetShowExportModal, } from "@/reducers/export/exportActions"; -import {FormattedMessage} from "@/locale"; import { selectDataFields, selectDataFieldsSortableIdsList, @@ -28,9 +25,9 @@ import {ExportProcessStage} from "@/constants/enums"; import {ExportDash} from "@/components/Exporter/src/ExportDash"; import {batchGenerateData} from "@/utils/generatorUtils"; import {GenerateDataBatchCompletedCallbackResponse} from "@/types/generator"; -import styles from "@/components/Exporter/src/ExportDash.module.scss"; -import {IconTickCircle} from "@douyinfe/semi-icons"; +import {IconExpand, IconTickCircle} from "@douyinfe/semi-icons"; import {getFileExtensionByFormat} from "@/utils/formatterUtils"; +import {FormattedMessage} from "@/locale"; export const ExportModal: React.FunctionComponent = () => { const dispatch = useDispatch(); @@ -44,15 +41,14 @@ export const ExportModal: React.FunctionComponent = () => { const estimatedSize = useSelector(selectEstimatedFileSize); const format = useSelector(selectExportFormat); const exportFileName = useSelector(selectExportFileName); - const exportNumOfRows = useSelector(selectNumberOfExportRows); + const numOfExportRows = useSelector(selectNumberOfExportRows); const exportProcessStage = useSelector(selectExportProcessStage); - const exportRows = useSelector(selectNumberOfExportRows); const sparkLineData = useSelector(selectSparkLineData); const sortableIdList = useSelector(selectDataFieldsSortableIdsList); const dataFields = useSelector(selectDataFields); const totalNumOfRowsGenerated = useSelector(selectCurrentNumOfRowsGenerated); - let percent = totalNumOfRowsGenerated / exportRows; + let percent = totalNumOfRowsGenerated / numOfExportRows; // effects useEffect(() => { @@ -72,52 +68,59 @@ export const ExportModal: React.FunctionComponent = () => { }, [exportProcessStage]); useEffect(() => { + const generateExportToast = () => ( + + {exportFileName}.{getFileExtensionByFormat(format)} + + + + + ); + + const EXPORT_TOAST_ID = 'EXPORT_TOAST'; + if (!modalVisible) { - if (exportProcessStage == ExportProcessStage.GENERATING) { + if (exportProcessStage === ExportProcessStage.GENERATING) { Toast.info({ - id: 'exportNotification', - content: - - {exportFileName}.{getFileExtensionByFormat(format)} - 详情 - , + id: EXPORT_TOAST_ID, + content: generateExportToast(), duration: 0, showClose: false, - icon: - }) - } else if (exportProcessStage == ExportProcessStage.COMPLETED) { - Toast.success( - { - id: 'exportNotification', - content: - - {exportFileName}.{getFileExtensionByFormat(format)} - 详情 - , - icon: - }) + icon: ( + + ), + }); + } else if (exportProcessStage === ExportProcessStage.COMPLETED) { + Toast.success({ + id: EXPORT_TOAST_ID, + content: generateExportToast(), + icon: , + }); } else { - + // Handle other cases if needed } } else { - Toast.close('exportNotification'); + Toast.close(EXPORT_TOAST_ID); } }, [exportProcessStage, modalVisible, percent, exportFileName, format]); // render const renderModalContent = () => { if (exportProcessStage == ExportProcessStage.PREVIEW) { - return } else { - return } @@ -135,7 +138,7 @@ export const ExportModal: React.FunctionComponent = () => { // generate const onGenerate = async () => { dispatch(doSetExportProcessStage(ExportProcessStage.GENERATING)); - await batchGenerateData(dataFields, sortableIdList, exportRows, onBatchCompleteCallback); + await batchGenerateData(dataFields, sortableIdList, numOfExportRows, onBatchCompleteCallback); dispatch(doSetExportProcessStage(ExportProcessStage.COMPLETED)); } diff --git a/src/constants/actions.ts b/src/constants/actions.ts index 1c0e93b..fe4d010 100644 --- a/src/constants/actions.ts +++ b/src/constants/actions.ts @@ -28,7 +28,6 @@ export const GENERATE_SPECIFIC_FIELD_PREVIEW_DATA = 'GENERATE_SPECIFIC_FIELD_PRE export const FORMAT_PREVIEW_DATA = 'FORMAT_DATA'; export const UPDATE_DATA_FIELD_NAME = 'UPDATE_DATA_FIELD_NAME'; export const ON_BATCH_GENERATE_COMPLETE = 'ON_BATCH_GENERATE_COMPLETE'; -export const SET_EXPORT_NOTIFICATION_ID = 'SET_EXPORT_NOTIFICATION_ID'; // preview export const SET_PREVIEW_TYPE = 'SET_PREVIEW_TYPE'; diff --git a/src/locale/translations/en.ts b/src/locale/translations/en.ts index 322ceb1..958b321 100644 --- a/src/locale/translations/en.ts +++ b/src/locale/translations/en.ts @@ -28,6 +28,9 @@ export const en = { "export.modal.terminate.button.text": "Terminate", "export.modal.generating.rows.text": "Rows", "export.modal.generating.time.text": "Time", + "export.modal.generating.done.text": "Done", + "export.modal.toast.details.button.text": "Details", + "export.modal.toast.download.button.text": "Download", // csv "export.configurator.csv.delimiter": "Delimiter", diff --git a/src/locale/translations/zhCN.ts b/src/locale/translations/zhCN.ts index 12add06..ccdf7e2 100644 --- a/src/locale/translations/zhCN.ts +++ b/src/locale/translations/zhCN.ts @@ -27,6 +27,9 @@ export const zhCN = { "export.modal.terminate.button.text": "终止", "export.modal.generating.rows.text": "行数", "export.modal.generating.time.text": "时间", + "export.modal.generating.done.text": "完成", + "export.modal.toast.details.button.text": "详情", + "export.modal.toast.download.button.text": "下载", // csv "export.configurator.csv.delimiter": "分隔符", diff --git a/src/reducers/export/exportReducer.ts b/src/reducers/export/exportReducer.ts index 6542b3e..c9d7ccd 100644 --- a/src/reducers/export/exportReducer.ts +++ b/src/reducers/export/exportReducer.ts @@ -1,7 +1,7 @@ import {Action, ExportReducerState} from "@/types/system"; import { ON_BATCH_GENERATE_COMPLETE, - SET_EXPORT_FILE_NAME, SET_EXPORT_NOTIFICATION_ID, + SET_EXPORT_FILE_NAME, SET_EXPORT_PROCESS_STAGE, SET_SHOW_EXPORT_MODAL } from "@/constants/actions"; @@ -16,8 +16,6 @@ export const initStates: ExportReducerState = { currentNumOfRowsGenerated: 0, sparkLineData: [0, 0, 0, 0, 0, 0, 0], formattedExportData: "", - timeElapsed: 0, - exportNotificationId: null } const exportReducer = (state: ExportReducerState = initStates, action: Action) => { @@ -45,11 +43,6 @@ const exportReducer = (state: ExportReducerState = initStates, action: Action) = timeElapsed: action.payload.totalTimeElapsed, sparkLineData: newSparkLineData }; - case SET_EXPORT_NOTIFICATION_ID: - return { - ...state, - exportNotificationId: action.payload - }; default: return state; } diff --git a/src/reducers/export/exportSelectors.ts b/src/reducers/export/exportSelectors.ts index 36591be..082bff2 100644 --- a/src/reducers/export/exportSelectors.ts +++ b/src/reducers/export/exportSelectors.ts @@ -2,12 +2,11 @@ import {RootState} from "@/types/system"; import {createSelector} from "reselect"; import { selectDataFields, selectDataFieldsSortableIdsList, selectExportFormat, selectFormatterConfig, - selectNumberOfExportRows, selectPreviewData, + selectNumberOfExportRows, selectPreviewFormattedData } from "@/reducers/workspace/workspaceSelectors"; import {calculateByteSize} from "@/utils/typeUtils"; import {generateData} from "@/utils/generatorUtils"; -import {formatData} from "@/utils/formatterUtils"; export const selectShowExportModal = (state: RootState) => state.export.showExportModal; export const selectExportFileName = (state: RootState) => state.export.exportFileName; @@ -16,9 +15,6 @@ export const selectIsCanceled = (state: RootState) => state.export.isCanceled; export const selectCurrentNumOfRowsGenerated = (state: RootState) => state.export.currentNumOfRowsGenerated; export const selectSparkLineData = (state: RootState) => state.export.sparkLineData; export const selectFormattedExportData = (state: RootState) => state.export.formattedExportData; -export const selectTimeElapsed = (state: RootState) => state.export.timeElapsed; -export const selectExportNotificationId = (state: RootState) => state.export.exportNotificationId; - export const selectEstimatedFileSize = createSelector( selectPreviewFormattedData, selectNumberOfExportRows, diff --git a/src/types/system.d.ts b/src/types/system.d.ts index e0af483..aac6381 100644 --- a/src/types/system.d.ts +++ b/src/types/system.d.ts @@ -60,8 +60,6 @@ export interface ExportReducerState { currentNumOfRowsGenerated: number; sparkLineData: number[]; formattedExportData: string; - timeElapsed: number; - exportNotificationId: string } // locales From 0640c4193d6e03ca1123f674fe927901c78bdc4f Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Mon, 28 Aug 2023 00:09:45 +1200 Subject: [PATCH 31/60] fix: remove SET_EXPORT_NOTIFICATION_ID action --- src/reducers/export/exportActions.ts | 8 +------- 1 file changed, 1 insertion(+), 7 deletions(-) diff --git a/src/reducers/export/exportActions.ts b/src/reducers/export/exportActions.ts index d404d25..e6f970e 100644 --- a/src/reducers/export/exportActions.ts +++ b/src/reducers/export/exportActions.ts @@ -1,6 +1,6 @@ import { ON_BATCH_GENERATE_COMPLETE, - SET_EXPORT_FILE_NAME, SET_EXPORT_NOTIFICATION_ID, + SET_EXPORT_FILE_NAME, SET_EXPORT_PROCESS_STAGE, SET_SHOW_EXPORT_MODAL } from "@/constants/actions"; @@ -30,9 +30,3 @@ export const doOnBatchComplete = (response: GenerateDataBatchCompletedCallbackRe async dispatch => { dispatch({type: ON_BATCH_GENERATE_COMPLETE, payload: response}); }; - -// set export notification id -export const doSetExportNotificationId = (id: string): any => - async dispatch => { - dispatch({type: SET_EXPORT_NOTIFICATION_ID, payload: id}) - } \ No newline at end of file From 2525d64c0dde627aa6c83fb5e776d2300698195a Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 25 Sep 2023 21:22:52 +0000 Subject: [PATCH 32/60] chore: bump emoji-picker-react from 4.4.9 to 4.5.2 Bumps [emoji-picker-react](https://github.com/ealush/emoji-picker-react) from 4.4.9 to 4.5.2. - [Release notes](https://github.com/ealush/emoji-picker-react/releases) - [Commits](https://github.com/ealush/emoji-picker-react/commits) --- updated-dependencies: - dependency-name: emoji-picker-react dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] --- package-lock.json | 8 ++++---- package.json | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package-lock.json b/package-lock.json index ca49600..0c49c4d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21,7 +21,7 @@ "@uiw/react-codemirror": "^4.19.16", "@vercel/analytics": "^1.0.2", "autoprefixer": "10.4.14", - "emoji-picker-react": "^4.4.9", + "emoji-picker-react": "^4.5.2", "eslint": "8.47.0", "eslint-config-next": "13.4.6", "hamburger-react": "^2.5.0", @@ -3919,9 +3919,9 @@ "integrity": "sha512-BQyvFauIMzCJqILViJNs0kIBEAlx1bYLS5CRLyJtlun1KAnZlhNSgyfyWifPWagQ5s8KYPY6BpNHZsEMkxZAQQ==" }, "node_modules/emoji-picker-react": { - "version": "4.4.9", - "resolved": "https://registry.npmjs.org/emoji-picker-react/-/emoji-picker-react-4.4.9.tgz", - "integrity": "sha512-ef9MfzSJy5xrzihLLv0e1zZmiNtcekubctTBQVfIpvKfsfu4iLBBzcHCmOC2IaUVBCZuUw+GM24BAPj1MdCQXQ==", + "version": "4.5.2", + "resolved": "https://registry.npmjs.org/emoji-picker-react/-/emoji-picker-react-4.5.2.tgz", + "integrity": "sha512-08v+yyFizoR9rEtLjuodTdlYQbkk0QWeKm6er0RQjks+b6Bfpw1UX9XheLcXreEAve7VVE7Tcu/kSAIm54V4zA==", "dependencies": { "clsx": "^1.2.1" }, diff --git a/package.json b/package.json index 9aedd84..dea438d 100644 --- a/package.json +++ b/package.json @@ -24,7 +24,7 @@ "@uiw/react-codemirror": "^4.19.16", "@vercel/analytics": "^1.0.2", "autoprefixer": "10.4.14", - "emoji-picker-react": "^4.4.9", + "emoji-picker-react": "^4.5.2", "eslint": "8.47.0", "eslint-config-next": "13.4.6", "hamburger-react": "^2.5.0", From 7e17141f3cfa86d747901c2b714c974409e2ff76 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 2 Oct 2023 21:09:46 +0000 Subject: [PATCH 33/60] chore: bump react-redux from 8.0.5 to 8.1.3 Bumps [react-redux](https://github.com/reduxjs/react-redux) from 8.0.5 to 8.1.3. - [Release notes](https://github.com/reduxjs/react-redux/releases) - [Changelog](https://github.com/reduxjs/react-redux/blob/master/CHANGELOG.md) - [Commits](https://github.com/reduxjs/react-redux/compare/v8.0.5...v8.1.3) --- updated-dependencies: - dependency-name: react-redux dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] --- package-lock.json | 10 +++++----- package.json | 2 +- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/package-lock.json b/package-lock.json index ca49600..33b2872 100644 --- a/package-lock.json +++ b/package-lock.json @@ -35,7 +35,7 @@ "react-beautiful-dnd": "^13.1.1", "react-dom": "18.2.0", "react-intl": "^6.4.4", - "react-redux": "^8.0.5", + "react-redux": "^8.1.3", "react-reflex": "^4.1.0", "react-sparklines": "^1.7.0", "redux-persist": "^6.0.0", @@ -7276,9 +7276,9 @@ } }, "node_modules/react-redux": { - "version": "8.0.5", - "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-8.0.5.tgz", - "integrity": "sha512-Q2f6fCKxPFpkXt1qNRZdEDLlScsDWyrgSj0mliK59qU6W5gvBiKkdMEG2lJzhd1rCctf0hb6EtePPLZ2e0m1uw==", + "version": "8.1.3", + "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-8.1.3.tgz", + "integrity": "sha512-n0ZrutD7DaX/j9VscF+uTALI3oUPa/pO4Z3soOBIjuRn/FzVu6aehhysxZCLi6y7duMf52WNZGMl7CtuK5EnRw==", "dependencies": { "@babel/runtime": "^7.12.1", "@types/hoist-non-react-statics": "^3.3.1", @@ -7293,7 +7293,7 @@ "react": "^16.8 || ^17.0 || ^18.0", "react-dom": "^16.8 || ^17.0 || ^18.0", "react-native": ">=0.59", - "redux": "^4" + "redux": "^4 || ^5.0.0-beta.0" }, "peerDependenciesMeta": { "@types/react": { diff --git a/package.json b/package.json index 9aedd84..dcfae2e 100644 --- a/package.json +++ b/package.json @@ -38,7 +38,7 @@ "react-beautiful-dnd": "^13.1.1", "react-dom": "18.2.0", "react-intl": "^6.4.4", - "react-redux": "^8.0.5", + "react-redux": "^8.1.3", "react-reflex": "^4.1.0", "react-sparklines": "^1.7.0", "redux-persist": "^6.0.0", From 6405f3d68fcab59a94df4db5a523c2e331dfbe89 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 16 Oct 2023 22:05:49 +0000 Subject: [PATCH 34/60] chore: bump @uiw/react-codemirror from 4.19.16 to 4.21.20 Bumps [@uiw/react-codemirror](https://github.com/uiwjs/react-codemirror) from 4.19.16 to 4.21.20. - [Release notes](https://github.com/uiwjs/react-codemirror/releases) - [Commits](https://github.com/uiwjs/react-codemirror/compare/v4.19.16...v4.21.20) --- updated-dependencies: - dependency-name: "@uiw/react-codemirror" dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] --- package-lock.json | 16 ++++++++-------- package.json | 2 +- 2 files changed, 9 insertions(+), 9 deletions(-) diff --git a/package-lock.json b/package-lock.json index ca49600..8f5f9f3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -18,7 +18,7 @@ "@types/react-dom": "18.2.7", "@uiw/codemirror-extensions-langs": "^4.21.9", "@uiw/codemirror-themes": "^4.21.9", - "@uiw/react-codemirror": "^4.19.16", + "@uiw/react-codemirror": "^4.21.20", "@vercel/analytics": "^1.0.2", "autoprefixer": "10.4.14", "emoji-picker-react": "^4.4.9", @@ -2210,9 +2210,9 @@ } }, "node_modules/@uiw/codemirror-extensions-basic-setup": { - "version": "4.19.16", - "resolved": "https://registry.npmjs.org/@uiw/codemirror-extensions-basic-setup/-/codemirror-extensions-basic-setup-4.19.16.tgz", - "integrity": "sha512-Xm0RDpyYVZ/8hWqaBs3+wZwi4uLwZUBwp/uCt89X80FeR6mr3BFuC+a+gcDO4dBu3l+WQE3jJdhjKjB2TCY/PQ==", + "version": "4.21.20", + "resolved": "https://registry.npmjs.org/@uiw/codemirror-extensions-basic-setup/-/codemirror-extensions-basic-setup-4.21.20.tgz", + "integrity": "sha512-Wyi9q4uw0xGYd/tJ6bULG7tkCLqcUsQT0AQBfCDtnkV3LdiLU0LceTrzJoHJyIKSHsKDJxFQxa1qg3QLt4gIUA==", "dependencies": { "@codemirror/autocomplete": "^6.0.0", "@codemirror/commands": "^6.0.0", @@ -2285,15 +2285,15 @@ } }, "node_modules/@uiw/react-codemirror": { - "version": "4.19.16", - "resolved": "https://registry.npmjs.org/@uiw/react-codemirror/-/react-codemirror-4.19.16.tgz", - "integrity": "sha512-uElraR7Mvwz2oZKrmtF5hmIB8dAlIiU65nfg484e/V9k4PV6/5KtPUQL3JPO4clH2pcd+TQqRTQrFFkP/D25ew==", + "version": "4.21.20", + "resolved": "https://registry.npmjs.org/@uiw/react-codemirror/-/react-codemirror-4.21.20.tgz", + "integrity": "sha512-PdyewPvNXnvT3JHj888yjpbWsAGw5qlxW6w1sMdsqJ0R6vPV++ob1iZXCGrM1FVpbqPK0DNfpXvjzp2gIr3lYw==", "dependencies": { "@babel/runtime": "^7.18.6", "@codemirror/commands": "^6.1.0", "@codemirror/state": "^6.1.1", "@codemirror/theme-one-dark": "^6.0.0", - "@uiw/codemirror-extensions-basic-setup": "4.19.16", + "@uiw/codemirror-extensions-basic-setup": "4.21.20", "codemirror": "^6.0.0" }, "peerDependencies": { diff --git a/package.json b/package.json index 9aedd84..48e98fa 100644 --- a/package.json +++ b/package.json @@ -21,7 +21,7 @@ "@types/react-dom": "18.2.7", "@uiw/codemirror-extensions-langs": "^4.21.9", "@uiw/codemirror-themes": "^4.21.9", - "@uiw/react-codemirror": "^4.19.16", + "@uiw/react-codemirror": "^4.21.20", "@vercel/analytics": "^1.0.2", "autoprefixer": "10.4.14", "emoji-picker-react": "^4.4.9", From b9508fa6abc0729c6e8f9f297e6f97b4bdf2c07d Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 16 Oct 2023 22:07:56 +0000 Subject: [PATCH 35/60] chore: bump sass from 1.65.1 to 1.69.3 Bumps [sass](https://github.com/sass/dart-sass) from 1.65.1 to 1.69.3. - [Release notes](https://github.com/sass/dart-sass/releases) - [Changelog](https://github.com/sass/dart-sass/blob/main/CHANGELOG.md) - [Commits](https://github.com/sass/dart-sass/compare/1.65.1...1.69.3) --- updated-dependencies: - dependency-name: sass dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] --- package-lock.json | 8 ++++---- package.json | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package-lock.json b/package-lock.json index ca49600..adbfcfb 100644 --- a/package-lock.json +++ b/package-lock.json @@ -39,7 +39,7 @@ "react-reflex": "^4.1.0", "react-sparklines": "^1.7.0", "redux-persist": "^6.0.0", - "sass": "^1.65.1", + "sass": "^1.69.3", "tailwindcss": "^3.3.3", "tsx": "^3.12.7", "uuidjs": "^5.0.1" @@ -7726,9 +7726,9 @@ "dev": true }, "node_modules/sass": { - "version": "1.65.1", - "resolved": "https://registry.npmjs.org/sass/-/sass-1.65.1.tgz", - "integrity": "sha512-9DINwtHmA41SEd36eVPQ9BJKpn7eKDQmUHmpI0y5Zv2Rcorrh0zS+cFrt050hdNbmmCNKTW3hV5mWfuegNRsEA==", + "version": "1.69.3", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.69.3.tgz", + "integrity": "sha512-X99+a2iGdXkdWn1akFPs0ZmelUzyAQfvqYc2P/MPTrJRuIRoTffGzT9W9nFqG00S+c8hXzVmgxhUuHFdrwxkhQ==", "dependencies": { "chokidar": ">=3.0.0 <4.0.0", "immutable": "^4.0.0", diff --git a/package.json b/package.json index 9aedd84..dc9d5bc 100644 --- a/package.json +++ b/package.json @@ -42,7 +42,7 @@ "react-reflex": "^4.1.0", "react-sparklines": "^1.7.0", "redux-persist": "^6.0.0", - "sass": "^1.65.1", + "sass": "^1.69.3", "tailwindcss": "^3.3.3", "tsx": "^3.12.7", "uuidjs": "^5.0.1" From e2b5310843f0280547e038af8c36837340441382 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 16 Oct 2023 22:16:11 +0000 Subject: [PATCH 36/60] chore: bump eslint-config-next from 13.4.6 to 13.5.5 Bumps [eslint-config-next](https://github.com/vercel/next.js/tree/HEAD/packages/eslint-config-next) from 13.4.6 to 13.5.5. - [Release notes](https://github.com/vercel/next.js/releases) - [Changelog](https://github.com/vercel/next.js/blob/canary/release.js) - [Commits](https://github.com/vercel/next.js/commits/v13.5.5/packages/eslint-config-next) --- updated-dependencies: - dependency-name: eslint-config-next dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] --- package-lock.json | 502 +++++++++++++++++++++++++++++++++++----------- package.json | 2 +- 2 files changed, 387 insertions(+), 117 deletions(-) diff --git a/package-lock.json b/package-lock.json index ca49600..f681d3b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -23,7 +23,7 @@ "autoprefixer": "10.4.14", "emoji-picker-react": "^4.4.9", "eslint": "8.47.0", - "eslint-config-next": "13.4.6", + "eslint-config-next": "13.5.5", "hamburger-react": "^2.5.0", "loadash": "^1.0.0", "next": "13.4.13", @@ -1684,9 +1684,9 @@ "integrity": "sha512-fwz2QgVg08v7ZL7KmbQBLF2PubR/6zQdKBgmHEl3BCyWTEDsAQEijjw2gbFhI1tcKfLdOOJUXntz5vZ4S0Polg==" }, "node_modules/@next/eslint-plugin-next": { - "version": "13.4.6", - "resolved": "https://registry.npmjs.org/@next/eslint-plugin-next/-/eslint-plugin-next-13.4.6.tgz", - "integrity": "sha512-bPigeu0RI7bgy1ucBA2Yqcfg539y0Lzo38P2hIkrRB1GNvFSbYg6RTu8n6tGqPVrH3TTlPTNKLXG01wc+5NuwQ==", + "version": "13.5.5", + "resolved": "https://registry.npmjs.org/@next/eslint-plugin-next/-/eslint-plugin-next-13.5.5.tgz", + "integrity": "sha512-S/32s4S+SCOpW58lHKdmILAAPRdnsSei7Y3L1oZSoe5Eh0QSlzbG1nYyIpnpwWgz3T7qe3imdq7cJ6Hf29epRA==", "dependencies": { "glob": "7.1.7" } @@ -1972,9 +1972,9 @@ } }, "node_modules/@rushstack/eslint-patch": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/@rushstack/eslint-patch/-/eslint-patch-1.2.0.tgz", - "integrity": "sha512-sXo/qW2/pAcmT43VoRKOJbDOfV3cYpq3szSVfIThQXNt+E4DfKj361vaAt3c88U5tPUxzEswam7GW48PJqtKAg==" + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@rushstack/eslint-patch/-/eslint-patch-1.5.1.tgz", + "integrity": "sha512-6i/8UoL0P5y4leBIGzvkZdS85RDMG9y1ihZzmTZQ5LdHUYmZ7pKFoj8X0236s3lusPs1Fa5HTQUpwI+UfTcmeA==" }, "node_modules/@semi-bot/semi-theme-mockdatanz": { "version": "1.1.5", @@ -2705,6 +2705,24 @@ "node": ">=8" } }, + "node_modules/array.prototype.findlastindex": { + "version": "1.2.3", + "resolved": "https://registry.npmjs.org/array.prototype.findlastindex/-/array.prototype.findlastindex-1.2.3.tgz", + "integrity": "sha512-LzLoiOMAxvy+Gd3BAq3B7VeIgPdo+Q8hthvKtXybMvRV0jrXfJM/t8mw7nNlpEcVlVUnCnM2KSX4XU5HmpodOA==", + "dependencies": { + "call-bind": "^1.0.2", + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1", + "es-shim-unscopables": "^1.0.0", + "get-intrinsic": "^1.2.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/array.prototype.flat": { "version": "1.3.1", "resolved": "https://registry.npmjs.org/array.prototype.flat/-/array.prototype.flat-1.3.1.tgz", @@ -2740,15 +2758,35 @@ } }, "node_modules/array.prototype.tosorted": { - "version": "1.1.1", - "resolved": "https://registry.npmjs.org/array.prototype.tosorted/-/array.prototype.tosorted-1.1.1.tgz", - "integrity": "sha512-pZYPXPRl2PqWcsUs6LOMn+1f1532nEoPTYowBtqLwAW+W8vSVhkIGnmOX1t/UQjD6YGI0vcD2B1U7ZFGQH9jnQ==", + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/array.prototype.tosorted/-/array.prototype.tosorted-1.1.2.tgz", + "integrity": "sha512-HuQCHOlk1Weat5jzStICBCd83NxiIMwqDg/dHEsoefabn/hJRj5pVdWcPUSpRrwhwxZOsQassMpgN/xRYFBMIg==", "dependencies": { "call-bind": "^1.0.2", - "define-properties": "^1.1.4", - "es-abstract": "^1.20.4", + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1", "es-shim-unscopables": "^1.0.0", - "get-intrinsic": "^1.1.3" + "get-intrinsic": "^1.2.1" + } + }, + "node_modules/arraybuffer.prototype.slice": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.2.tgz", + "integrity": "sha512-yMBKppFur/fbHu9/6USUe03bZ4knMYiwFBcyiaXB8Go0qNehwX6inYPzK9U0NeQvGxKthcmHcaR8P5MStSRBAw==", + "dependencies": { + "array-buffer-byte-length": "^1.0.0", + "call-bind": "^1.0.2", + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1", + "get-intrinsic": "^1.2.1", + "is-array-buffer": "^3.0.2", + "is-shared-array-buffer": "^1.0.2" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" } }, "node_modules/asn1": { @@ -2794,6 +2832,14 @@ "resolved": "https://registry.npmjs.org/async-validator/-/async-validator-3.5.2.tgz", "integrity": "sha512-8eLCg00W9pIRZSB781UUX/H6Oskmm8xloZfr09lz5bikRpBVDlJ3hRVuxxP1SxcwsEYfJ4IU8Q19Y8/893r3rQ==" }, + "node_modules/asynciterator.prototype": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/asynciterator.prototype/-/asynciterator.prototype-1.0.0.tgz", + "integrity": "sha512-wwHYEIS0Q80f5mosx3L/dfG5t5rjEa9Ft51GTaNt862EnpyGHpgz2RkZvLPp1oF5TnAiTohkEKVEu8pQPJI7Vg==", + "dependencies": { + "has-symbols": "^1.0.3" + } + }, "node_modules/asynckit": { "version": "0.4.0", "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz", @@ -3836,6 +3882,19 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/define-data-property": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.1.tgz", + "integrity": "sha512-E7uGkTzkk1d0ByLeSc6ZsFS79Axg+m1P/VsgYsxHgiuc3tFSj+MjMIwe90FC4lOAZzNBdY7kkO2P2wKdsQ1vgQ==", + "dependencies": { + "get-intrinsic": "^1.2.1", + "gopd": "^1.0.1", + "has-property-descriptors": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + } + }, "node_modules/define-lazy-prop": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/define-lazy-prop/-/define-lazy-prop-3.0.0.tgz", @@ -3848,10 +3907,11 @@ } }, "node_modules/define-properties": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.2.0.tgz", - "integrity": "sha512-xvqAVKGfT1+UAvPwKTVw/njhdQ8ZhXK4lI0bCIuCMrp2up9nPnaDftrLtmpTazqd1o+UY4zgzU+avtMbDP+ldA==", + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.2.1.tgz", + "integrity": "sha512-8QmQKqEASLd5nx0U1B1okLElbUuuttJ/AnYmRXbbbGDWh6uS208EjD4Xqq/I9wK7u0v6O08XhTWnt5XtEbR6Dg==", "dependencies": { + "define-data-property": "^1.0.1", "has-property-descriptors": "^1.0.0", "object-keys": "^1.1.1" }, @@ -3979,17 +4039,18 @@ } }, "node_modules/es-abstract": { - "version": "1.21.2", - "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.21.2.tgz", - "integrity": "sha512-y/B5POM2iBnIxCiernH1G7rC9qQoM77lLIMQLuob0zhp8C56Po81+2Nj0WFKnd0pNReDTnkYryc+zhOzpEIROg==", + "version": "1.22.2", + "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.22.2.tgz", + "integrity": "sha512-YoxfFcDmhjOgWPWsV13+2RNjq1F6UQnfs+8TftwNqtzlmFzEXvlUwdrNrYeaizfjQzRMxkZ6ElWMOJIFKdVqwA==", "dependencies": { "array-buffer-byte-length": "^1.0.0", + "arraybuffer.prototype.slice": "^1.0.2", "available-typed-arrays": "^1.0.5", "call-bind": "^1.0.2", "es-set-tostringtag": "^2.0.1", "es-to-primitive": "^1.2.1", - "function.prototype.name": "^1.1.5", - "get-intrinsic": "^1.2.0", + "function.prototype.name": "^1.1.6", + "get-intrinsic": "^1.2.1", "get-symbol-description": "^1.0.0", "globalthis": "^1.0.3", "gopd": "^1.0.1", @@ -4004,19 +4065,23 @@ "is-regex": "^1.1.4", "is-shared-array-buffer": "^1.0.2", "is-string": "^1.0.7", - "is-typed-array": "^1.1.10", + "is-typed-array": "^1.1.12", "is-weakref": "^1.0.2", "object-inspect": "^1.12.3", "object-keys": "^1.1.1", "object.assign": "^4.1.4", - "regexp.prototype.flags": "^1.4.3", + "regexp.prototype.flags": "^1.5.1", + "safe-array-concat": "^1.0.1", "safe-regex-test": "^1.0.0", - "string.prototype.trim": "^1.2.7", - "string.prototype.trimend": "^1.0.6", - "string.prototype.trimstart": "^1.0.6", + "string.prototype.trim": "^1.2.8", + "string.prototype.trimend": "^1.0.7", + "string.prototype.trimstart": "^1.0.7", + "typed-array-buffer": "^1.0.0", + "typed-array-byte-length": "^1.0.0", + "typed-array-byte-offset": "^1.0.0", "typed-array-length": "^1.0.4", "unbox-primitive": "^1.0.2", - "which-typed-array": "^1.1.9" + "which-typed-array": "^1.1.11" }, "engines": { "node": ">= 0.4" @@ -4044,6 +4109,27 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/es-iterator-helpers": { + "version": "1.0.15", + "resolved": "https://registry.npmjs.org/es-iterator-helpers/-/es-iterator-helpers-1.0.15.tgz", + "integrity": "sha512-GhoY8uYqd6iwUl2kgjTm4CZAf6oo5mHK7BPqx3rKgx893YSsy0LGHV6gfqqQvZt/8xM8xeOnfXBCfqclMKkJ5g==", + "dependencies": { + "asynciterator.prototype": "^1.0.0", + "call-bind": "^1.0.2", + "define-properties": "^1.2.1", + "es-abstract": "^1.22.1", + "es-set-tostringtag": "^2.0.1", + "function-bind": "^1.1.1", + "get-intrinsic": "^1.2.1", + "globalthis": "^1.0.3", + "has-property-descriptors": "^1.0.0", + "has-proto": "^1.0.1", + "has-symbols": "^1.0.3", + "internal-slot": "^1.0.5", + "iterator.prototype": "^1.1.2", + "safe-array-concat": "^1.0.1" + } + }, "node_modules/es-module-lexer": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.2.1.tgz", @@ -4195,19 +4281,19 @@ } }, "node_modules/eslint-config-next": { - "version": "13.4.6", - "resolved": "https://registry.npmjs.org/eslint-config-next/-/eslint-config-next-13.4.6.tgz", - "integrity": "sha512-nlv4FYish1RYYHILbQwM5/rD37cOvEqtMfDjtQCYbXdE2O3MggqHu2q6IDeLE2Z6u8ZJyNPgWOA6OimWcxj3qw==", + "version": "13.5.5", + "resolved": "https://registry.npmjs.org/eslint-config-next/-/eslint-config-next-13.5.5.tgz", + "integrity": "sha512-kQr/eevFyzeVt0yCKTchQp3MTIx8ZmBsAKLW+7bzmAXHcf2vvxIqAt2N/afb9SZpuXXhSb/8yrKQGVUVpYmafQ==", "dependencies": { - "@next/eslint-plugin-next": "13.4.6", - "@rushstack/eslint-patch": "^1.1.3", - "@typescript-eslint/parser": "^5.42.0", + "@next/eslint-plugin-next": "13.5.5", + "@rushstack/eslint-patch": "^1.3.3", + "@typescript-eslint/parser": "^5.4.2 || ^6.0.0", "eslint-import-resolver-node": "^0.3.6", "eslint-import-resolver-typescript": "^3.5.2", - "eslint-plugin-import": "^2.26.0", - "eslint-plugin-jsx-a11y": "^6.5.1", - "eslint-plugin-react": "^7.31.7", - "eslint-plugin-react-hooks": "^4.5.0" + "eslint-plugin-import": "^2.28.1", + "eslint-plugin-jsx-a11y": "^6.7.1", + "eslint-plugin-react": "^7.33.2", + "eslint-plugin-react-hooks": "^4.5.0 || 5.0.0-canary-7118f5dd7-20230705" }, "peerDependencies": { "eslint": "^7.23.0 || ^8.0.0", @@ -4316,25 +4402,27 @@ } }, "node_modules/eslint-plugin-import": { - "version": "2.27.5", - "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.27.5.tgz", - "integrity": "sha512-LmEt3GVofgiGuiE+ORpnvP+kAm3h6MLZJ4Q5HCyHADofsb4VzXFsRiWj3c0OFiV+3DWFh0qg3v9gcPlfc3zRow==", + "version": "2.28.1", + "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.28.1.tgz", + "integrity": "sha512-9I9hFlITvOV55alzoKBI+K9q74kv0iKMeY6av5+umsNwayt59fz692daGyjR+oStBQgx6nwR9rXldDev3Clw+A==", "dependencies": { "array-includes": "^3.1.6", + "array.prototype.findlastindex": "^1.2.2", "array.prototype.flat": "^1.3.1", "array.prototype.flatmap": "^1.3.1", "debug": "^3.2.7", "doctrine": "^2.1.0", "eslint-import-resolver-node": "^0.3.7", - "eslint-module-utils": "^2.7.4", + "eslint-module-utils": "^2.8.0", "has": "^1.0.3", - "is-core-module": "^2.11.0", + "is-core-module": "^2.13.0", "is-glob": "^4.0.3", "minimatch": "^3.1.2", + "object.fromentries": "^2.0.6", + "object.groupby": "^1.0.0", "object.values": "^1.1.6", - "resolve": "^1.22.1", - "semver": "^6.3.0", - "tsconfig-paths": "^3.14.1" + "semver": "^6.3.1", + "tsconfig-paths": "^3.14.2" }, "engines": { "node": ">=4" @@ -4363,9 +4451,9 @@ } }, "node_modules/eslint-plugin-import/node_modules/semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", "bin": { "semver": "bin/semver.js" } @@ -4408,14 +4496,15 @@ } }, "node_modules/eslint-plugin-react": { - "version": "7.32.2", - "resolved": "https://registry.npmjs.org/eslint-plugin-react/-/eslint-plugin-react-7.32.2.tgz", - "integrity": "sha512-t2fBMa+XzonrrNkyVirzKlvn5RXzzPwRHtMvLAtVZrt8oxgnTQaYbU6SXTOO1mwQgp1y5+toMSKInnzGr0Knqg==", + "version": "7.33.2", + "resolved": "https://registry.npmjs.org/eslint-plugin-react/-/eslint-plugin-react-7.33.2.tgz", + "integrity": "sha512-73QQMKALArI8/7xGLNI/3LylrEYrlKZSb5C9+q3OtOewTnMQi5cT+aE9E41sLCmli3I9PGGmD1yiZydyo4FEPw==", "dependencies": { "array-includes": "^3.1.6", "array.prototype.flatmap": "^1.3.1", "array.prototype.tosorted": "^1.1.1", "doctrine": "^2.1.0", + "es-iterator-helpers": "^1.0.12", "estraverse": "^5.3.0", "jsx-ast-utils": "^2.4.1 || ^3.0.0", "minimatch": "^3.1.2", @@ -4425,7 +4514,7 @@ "object.values": "^1.1.6", "prop-types": "^15.8.1", "resolve": "^2.0.0-next.4", - "semver": "^6.3.0", + "semver": "^6.3.1", "string.prototype.matchall": "^4.0.8" }, "engines": { @@ -4458,11 +4547,11 @@ } }, "node_modules/eslint-plugin-react/node_modules/resolve": { - "version": "2.0.0-next.4", - "resolved": "https://registry.npmjs.org/resolve/-/resolve-2.0.0-next.4.tgz", - "integrity": "sha512-iMDbmAWtfU+MHpxt/I5iWI7cY6YVEZUQ3MBgPQ++XD1PELuJHIl82xBmObyP2KyQmkNB2dsqF7seoQQiAn5yDQ==", + "version": "2.0.0-next.5", + "resolved": "https://registry.npmjs.org/resolve/-/resolve-2.0.0-next.5.tgz", + "integrity": "sha512-U7WjGVG9sH8tvjW5SmGbQuui75FiyjAX72HX15DwBBwF9dNiQZRQAg9nnPhYy+TUnE0+VcrttuvNI8oSxZcocA==", "dependencies": { - "is-core-module": "^2.9.0", + "is-core-module": "^2.13.0", "path-parse": "^1.0.7", "supports-preserve-symlinks-flag": "^1.0.0" }, @@ -4474,9 +4563,9 @@ } }, "node_modules/eslint-plugin-react/node_modules/semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", "bin": { "semver": "bin/semver.js" } @@ -4877,14 +4966,14 @@ "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==" }, "node_modules/function.prototype.name": { - "version": "1.1.5", - "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.1.5.tgz", - "integrity": "sha512-uN7m/BzVKQnCUF/iW8jYea67v++2u7m5UgENbHRtdDVclOUP+FMPlCNdmk0h/ysGyo2tavMJEDqJAkJdRa1vMA==", + "version": "1.1.6", + "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.1.6.tgz", + "integrity": "sha512-Z5kx79swU5P27WEayXM1tBi5Ze/lbIyiNgU3qyXUOf9b2rgXYyF9Dy9Cx+IQv/Lc8WCG6L82zwUPpSS9hGehIg==", "dependencies": { "call-bind": "^1.0.2", - "define-properties": "^1.1.3", - "es-abstract": "^1.19.0", - "functions-have-names": "^1.2.2" + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1", + "functions-have-names": "^1.2.3" }, "engines": { "node": ">= 0.4" @@ -4902,12 +4991,13 @@ } }, "node_modules/get-intrinsic": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.0.tgz", - "integrity": "sha512-L049y6nFOuom5wGyRc3/gdTLO94dySVKRACj1RmJZBQXlbTMhtNIgkWkUHq+jYmZvKf14EW1EoJnnjbmoHij0Q==", + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.1.tgz", + "integrity": "sha512-2DcsyfABl+gVHEfCOaTrWgyt+tb6MSEGmKq+kI5HwLbIYgjgmMcV8KQ41uaKz1xxUcn9tJtgFbQUEVcEbd0FYw==", "dependencies": { "function-bind": "^1.1.1", "has": "^1.0.3", + "has-proto": "^1.0.1", "has-symbols": "^1.0.3" }, "funding": { @@ -5382,6 +5472,20 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/is-async-function": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/is-async-function/-/is-async-function-2.0.0.tgz", + "integrity": "sha512-Y1JXKrfykRJGdlDwdKlLpLyMIiWqWvuSd17TvZk68PLAOGOoF4Xyav1z0Xhoi+gCYjZVeC5SI+hYFOfvXmGRCA==", + "dependencies": { + "has-tostringtag": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/is-bigint": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.0.4.tgz", @@ -5443,9 +5547,9 @@ } }, "node_modules/is-core-module": { - "version": "2.12.0", - "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.12.0.tgz", - "integrity": "sha512-RECHCBCd/viahWmwj6enj19sKbHfJrddi/6cBDsNTKbNq0f7VeaUkBo60BqzvPqo/W54ChS62Z5qyun7cfOMqQ==", + "version": "2.13.0", + "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.13.0.tgz", + "integrity": "sha512-Z7dk6Qo8pOCp3l4tsX2C5ZVas4V+UxwQodwZhLopL91TX8UyyHEXafPcyoeeWuLrwzHcr3igO78wNLwHJHsMCQ==", "dependencies": { "has": "^1.0.3" }, @@ -5489,6 +5593,17 @@ "node": ">=0.10.0" } }, + "node_modules/is-finalizationregistry": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/is-finalizationregistry/-/is-finalizationregistry-1.0.2.tgz", + "integrity": "sha512-0by5vtUJs8iFQb5TYUHHPudOR+qXYIMKtiUzvLIZITZUjknFmziyBJuLhVRc+Ds0dREFlskDNJKYIdIzu/9pfw==", + "dependencies": { + "call-bind": "^1.0.2" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/is-fullwidth-code-point": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz", @@ -5498,6 +5613,20 @@ "node": ">=8" } }, + "node_modules/is-generator-function": { + "version": "1.0.10", + "resolved": "https://registry.npmjs.org/is-generator-function/-/is-generator-function-1.0.10.tgz", + "integrity": "sha512-jsEjy9l3yiXEQ+PsXdmBwEPcOxaXWLspKdplFUVI9vq1iZgIekeC0L167qeu86czQaxed3q/Uzuw0swL0irL8A==", + "dependencies": { + "has-tostringtag": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/is-glob": { "version": "4.0.3", "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz", @@ -5665,15 +5794,11 @@ } }, "node_modules/is-typed-array": { - "version": "1.1.10", - "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.10.tgz", - "integrity": "sha512-PJqgEHiWZvMpaFZ3uTc8kHPM4+4ADTlDniuQL7cU/UDA0Ql7F70yGfHph3cLNe+c9toaigv+DFzTJKhc2CtO6A==", + "version": "1.1.12", + "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.12.tgz", + "integrity": "sha512-Z14TF2JNG8Lss5/HMqt0//T9JeHXttXy5pH/DBU4vi98ozO2btxzq9MwYDZYnKwU8nRsz/+GVFVRDq3DkVuSPg==", "dependencies": { - "available-typed-arrays": "^1.0.5", - "call-bind": "^1.0.2", - "for-each": "^0.3.3", - "gopd": "^1.0.1", - "has-tostringtag": "^1.0.0" + "which-typed-array": "^1.1.11" }, "engines": { "node": ">= 0.4" @@ -5772,6 +5897,18 @@ "integrity": "sha512-Yljz7ffyPbrLpLngrMtZ7NduUgVvi6wG9RJ9IUcyCd59YQ911PBJphODUcbOVbqYfxe1wuYf/LJ8PauMRwsM/g==", "dev": true }, + "node_modules/iterator.prototype": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/iterator.prototype/-/iterator.prototype-1.1.2.tgz", + "integrity": "sha512-DR33HMMr8EzwuRL8Y9D3u2BMj8+RqSE850jfGu59kS7tbmPLzGkZmVSfyCFSDxuZiEY6Rzt3T2NA/qU+NwVj1w==", + "dependencies": { + "define-properties": "^1.2.1", + "get-intrinsic": "^1.2.1", + "has-symbols": "^1.0.3", + "reflect.getprototypeof": "^1.0.4", + "set-function-name": "^2.0.1" + } + }, "node_modules/jest-worker": { "version": "27.5.1", "resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-27.5.1.tgz", @@ -6546,13 +6683,24 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/object.groupby": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/object.groupby/-/object.groupby-1.0.1.tgz", + "integrity": "sha512-HqaQtqLnp/8Bn4GL16cj+CUYbnpe1bh0TtEaWvybszDG4tgxCJuRpV8VGuvNaI1fAnI4lUJzDG55MXcOH4JZcQ==", + "dependencies": { + "call-bind": "^1.0.2", + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1", + "get-intrinsic": "^1.2.1" + } + }, "node_modules/object.hasown": { - "version": "1.1.2", - "resolved": "https://registry.npmjs.org/object.hasown/-/object.hasown-1.1.2.tgz", - "integrity": "sha512-B5UIT3J1W+WuWIU55h0mjlwaqxiE5vYENJXIXZ4VFe05pNYrkKuK0U/6aFcb0pKywYJh7IhfoqUfKVmrJJHZHw==", + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/object.hasown/-/object.hasown-1.1.3.tgz", + "integrity": "sha512-fFI4VcYpRHvSLXxP7yiZOMAd331cPfd2p7PFDVbgUsYOfCT3tICVqXWngbjr4m49OvsBwUBQ6O2uQoJvy3RexA==", "dependencies": { - "define-properties": "^1.1.4", - "es-abstract": "^1.20.4" + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1" }, "funding": { "url": "https://github.com/sponsors/ljharb" @@ -7415,19 +7563,38 @@ "redux": "^4" } }, + "node_modules/reflect.getprototypeof": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/reflect.getprototypeof/-/reflect.getprototypeof-1.0.4.tgz", + "integrity": "sha512-ECkTw8TmJwW60lOTR+ZkODISW6RQ8+2CL3COqtiJKLd6MmB45hN51HprHFziKLGkAuTGQhBb91V8cy+KHlaCjw==", + "dependencies": { + "call-bind": "^1.0.2", + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1", + "get-intrinsic": "^1.2.1", + "globalthis": "^1.0.3", + "which-builtin-type": "^1.1.3" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/regenerator-runtime": { "version": "0.13.11", "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz", "integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==" }, "node_modules/regexp.prototype.flags": { - "version": "1.5.0", - "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.0.tgz", - "integrity": "sha512-0SutC3pNudRKgquxGoRGIz946MZVHqbNfPjBdxeOhBrdgDKlRoXmYLQN9xRbrR09ZXWeGAdPuif7egofn6v5LA==", + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.1.tgz", + "integrity": "sha512-sy6TXMN+hnP/wMy+ISxg3krXx7BAtWVO4UouuCN/ziM9UEne0euamVNafDfvC83bRNr95y0V5iijeDQFUNpvrg==", "dependencies": { "call-bind": "^1.0.2", "define-properties": "^1.2.0", - "functions-have-names": "^1.2.3" + "set-function-name": "^2.0.0" }, "engines": { "node": ">= 0.4" @@ -7687,6 +7854,23 @@ "tslib": "^2.1.0" } }, + "node_modules/safe-array-concat": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.0.1.tgz", + "integrity": "sha512-6XbUAseYE2KtOuGueyeobCySj9L4+66Tn6KQMOPQJrAJEowYKW/YR/MGJZl7FdydUdaFu4LYyDZjxf4/Nmo23Q==", + "dependencies": { + "call-bind": "^1.0.2", + "get-intrinsic": "^1.2.1", + "has-symbols": "^1.0.3", + "isarray": "^2.0.5" + }, + "engines": { + "node": ">=0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/safe-buffer": { "version": "5.2.1", "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz", @@ -7885,6 +8069,19 @@ "randombytes": "^2.1.0" } }, + "node_modules/set-function-name": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.1.tgz", + "integrity": "sha512-tMNCiqYVkXIZgc2Hnoy2IvC/f8ezc5koaRFkCjrpWzGpCd3qbZXPzVy9MAZzK1ch/X0jvSkojys3oqJN0qCmdA==", + "dependencies": { + "define-data-property": "^1.0.1", + "functions-have-names": "^1.2.3", + "has-property-descriptors": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + } + }, "node_modules/shebang-command": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz", @@ -8034,17 +8231,18 @@ "dev": true }, "node_modules/string.prototype.matchall": { - "version": "4.0.8", - "resolved": "https://registry.npmjs.org/string.prototype.matchall/-/string.prototype.matchall-4.0.8.tgz", - "integrity": "sha512-6zOCOcJ+RJAQshcTvXPHoxoQGONa3e/Lqx90wUA+wEzX78sg5Bo+1tQo4N0pohS0erG9qtCqJDjNCQBjeWVxyg==", + "version": "4.0.10", + "resolved": "https://registry.npmjs.org/string.prototype.matchall/-/string.prototype.matchall-4.0.10.tgz", + "integrity": "sha512-rGXbGmOEosIQi6Qva94HUjgPs9vKW+dkG7Y8Q5O2OYkWL6wFaTRZO8zM4mhP94uX55wgyrXzfS2aGtGzUL7EJQ==", "dependencies": { "call-bind": "^1.0.2", - "define-properties": "^1.1.4", - "es-abstract": "^1.20.4", - "get-intrinsic": "^1.1.3", + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1", + "get-intrinsic": "^1.2.1", "has-symbols": "^1.0.3", - "internal-slot": "^1.0.3", - "regexp.prototype.flags": "^1.4.3", + "internal-slot": "^1.0.5", + "regexp.prototype.flags": "^1.5.0", + "set-function-name": "^2.0.0", "side-channel": "^1.0.4" }, "funding": { @@ -8052,13 +8250,13 @@ } }, "node_modules/string.prototype.trim": { - "version": "1.2.7", - "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.7.tgz", - "integrity": "sha512-p6TmeT1T3411M8Cgg9wBTMRtY2q9+PNy9EV1i2lIXUN/btt763oIfxwN3RR8VU6wHX8j/1CFy0L+YuThm6bgOg==", + "version": "1.2.8", + "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.8.tgz", + "integrity": "sha512-lfjY4HcixfQXOfaqCvcBuOIapyaroTXhbkfJN3gcB1OtyupngWK4sEET9Knd0cXd28kTUqu/kHoV4HKSJdnjiQ==", "dependencies": { "call-bind": "^1.0.2", - "define-properties": "^1.1.4", - "es-abstract": "^1.20.4" + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1" }, "engines": { "node": ">= 0.4" @@ -8068,26 +8266,26 @@ } }, "node_modules/string.prototype.trimend": { - "version": "1.0.6", - "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.6.tgz", - "integrity": "sha512-JySq+4mrPf9EsDBEDYMOb/lM7XQLulwg5R/m1r0PXEFqrV0qHvl58sdTilSXtKOflCsK2E8jxf+GKC0T07RWwQ==", + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.7.tgz", + "integrity": "sha512-Ni79DqeB72ZFq1uH/L6zJ+DKZTkOtPIHovb3YZHQViE+HDouuU4mBrLOLDn5Dde3RF8qw5qVETEjhu9locMLvA==", "dependencies": { "call-bind": "^1.0.2", - "define-properties": "^1.1.4", - "es-abstract": "^1.20.4" + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1" }, "funding": { "url": "https://github.com/sponsors/ljharb" } }, "node_modules/string.prototype.trimstart": { - "version": "1.0.6", - "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.6.tgz", - "integrity": "sha512-omqjMDaY92pbn5HOX7f9IccLA+U1tA9GvtU4JrodiXFfYB7jPzzHpRzpglLAjtUV6bB557zwClJezTqnAiYnQA==", + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.7.tgz", + "integrity": "sha512-NGhtDFu3jCEm7B4Fy0DpLewdJQOZcQ0rGbwQ/+stjnrp2i+rlKeCvos9hOIeCmqwratM47OBxY7uFZzjxHXmrg==", "dependencies": { "call-bind": "^1.0.2", - "define-properties": "^1.1.4", - "es-abstract": "^1.20.4" + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1" }, "funding": { "url": "https://github.com/sponsors/ljharb" @@ -8593,6 +8791,54 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/typed-array-buffer": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.0.tgz", + "integrity": "sha512-Y8KTSIglk9OZEr8zywiIHG/kmQ7KWyjseXs1CbSo8vC42w7hg2HgYTxSWwP0+is7bWDc1H+Fo026CpHFwm8tkw==", + "dependencies": { + "call-bind": "^1.0.2", + "get-intrinsic": "^1.2.1", + "is-typed-array": "^1.1.10" + }, + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/typed-array-byte-length": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.0.tgz", + "integrity": "sha512-Or/+kvLxNpeQ9DtSydonMxCx+9ZXOswtwJn17SNLvhptaXYDJvkFFP5zbfU/uLmvnBJlI4yrnXRxpdWH/M5tNA==", + "dependencies": { + "call-bind": "^1.0.2", + "for-each": "^0.3.3", + "has-proto": "^1.0.1", + "is-typed-array": "^1.1.10" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/typed-array-byte-offset": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.0.tgz", + "integrity": "sha512-RD97prjEt9EL8YgAgpOkf3O4IF9lhJFr9g0htQkm0rchFp/Vx7LW5Q8fSXXub7BXAODyUQohRMyOc3faCPd0hg==", + "dependencies": { + "available-typed-arrays": "^1.0.5", + "call-bind": "^1.0.2", + "for-each": "^0.3.3", + "has-proto": "^1.0.1", + "is-typed-array": "^1.1.10" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/typed-array-length": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.4.tgz", @@ -8893,6 +9139,31 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/which-builtin-type": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/which-builtin-type/-/which-builtin-type-1.1.3.tgz", + "integrity": "sha512-YmjsSMDBYsM1CaFiayOVT06+KJeXf0o5M/CAd4o1lTadFAtacTUM49zoYxr/oroopFDfhvN6iEcBxUyc3gvKmw==", + "dependencies": { + "function.prototype.name": "^1.1.5", + "has-tostringtag": "^1.0.0", + "is-async-function": "^2.0.0", + "is-date-object": "^1.0.5", + "is-finalizationregistry": "^1.0.2", + "is-generator-function": "^1.0.10", + "is-regex": "^1.1.4", + "is-weakref": "^1.0.2", + "isarray": "^2.0.5", + "which-boxed-primitive": "^1.0.2", + "which-collection": "^1.0.1", + "which-typed-array": "^1.1.9" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/which-collection": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/which-collection/-/which-collection-1.0.1.tgz", @@ -8908,16 +9179,15 @@ } }, "node_modules/which-typed-array": { - "version": "1.1.9", - "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.9.tgz", - "integrity": "sha512-w9c4xkx6mPidwp7180ckYWfMmvxpjlZuIudNtDf4N/tTAUB8VJbX25qZoAsrtGuYNnGw3pa0AXgbGKRB8/EceA==", + "version": "1.1.11", + "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.11.tgz", + "integrity": "sha512-qe9UWWpkeG5yzZ0tNYxDmd7vo58HDBc39mZ0xWWpolAGADdFOzkfamWLDxkOWcvHQKVmdTyQdLD4NOfjLWTKew==", "dependencies": { "available-typed-arrays": "^1.0.5", "call-bind": "^1.0.2", "for-each": "^0.3.3", "gopd": "^1.0.1", - "has-tostringtag": "^1.0.0", - "is-typed-array": "^1.1.10" + "has-tostringtag": "^1.0.0" }, "engines": { "node": ">= 0.4" diff --git a/package.json b/package.json index 9aedd84..2da002c 100644 --- a/package.json +++ b/package.json @@ -26,7 +26,7 @@ "autoprefixer": "10.4.14", "emoji-picker-react": "^4.4.9", "eslint": "8.47.0", - "eslint-config-next": "13.4.6", + "eslint-config-next": "13.5.5", "hamburger-react": "^2.5.0", "loadash": "^1.0.0", "next": "13.4.13", From 436b5ab9e2499b835f082557895279756db19385 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Sun, 22 Oct 2023 09:08:07 +0000 Subject: [PATCH 37/60] chore: bump emoji-picker-react from 4.4.9 to 4.5.3 Bumps [emoji-picker-react](https://github.com/ealush/emoji-picker-react) from 4.4.9 to 4.5.3. - [Release notes](https://github.com/ealush/emoji-picker-react/releases) - [Commits](https://github.com/ealush/emoji-picker-react/commits) --- updated-dependencies: - dependency-name: emoji-picker-react dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] --- package-lock.json | 8 ++++---- package.json | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package-lock.json b/package-lock.json index bcb72fb..704df25 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21,7 +21,7 @@ "@uiw/react-codemirror": "^4.21.20", "@vercel/analytics": "^1.0.2", "autoprefixer": "10.4.14", - "emoji-picker-react": "^4.5.2", + "emoji-picker-react": "^4.5.3", "eslint": "8.47.0", "eslint-config-next": "13.5.5", "hamburger-react": "^2.5.0", @@ -3979,9 +3979,9 @@ "integrity": "sha512-BQyvFauIMzCJqILViJNs0kIBEAlx1bYLS5CRLyJtlun1KAnZlhNSgyfyWifPWagQ5s8KYPY6BpNHZsEMkxZAQQ==" }, "node_modules/emoji-picker-react": { - "version": "4.5.2", - "resolved": "https://registry.npmjs.org/emoji-picker-react/-/emoji-picker-react-4.5.2.tgz", - "integrity": "sha512-08v+yyFizoR9rEtLjuodTdlYQbkk0QWeKm6er0RQjks+b6Bfpw1UX9XheLcXreEAve7VVE7Tcu/kSAIm54V4zA==", + "version": "4.5.3", + "resolved": "https://registry.npmjs.org/emoji-picker-react/-/emoji-picker-react-4.5.3.tgz", + "integrity": "sha512-sF3ALUvfB2AjgxgYMK0c1CG3a6zDZV9EpwPWCJsu8+H6tO5XQW4Fbz2TqDKhu5Nk+/EiBg+g7ZuR41KYtIRnIA==", "dependencies": { "clsx": "^1.2.1" }, diff --git a/package.json b/package.json index 2394d0a..9163066 100644 --- a/package.json +++ b/package.json @@ -24,7 +24,7 @@ "@uiw/react-codemirror": "^4.21.20", "@vercel/analytics": "^1.0.2", "autoprefixer": "10.4.14", - "emoji-picker-react": "^4.5.2", + "emoji-picker-react": "^4.5.3", "eslint": "8.47.0", "eslint-config-next": "13.5.5", "hamburger-react": "^2.5.0", From 4cab4c2ad0c790691efe74025b11f6b505b6962a Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 23 Oct 2023 21:26:26 +0000 Subject: [PATCH 38/60] chore: bump autoprefixer from 10.4.14 to 10.4.16 Bumps [autoprefixer](https://github.com/postcss/autoprefixer) from 10.4.14 to 10.4.16. - [Release notes](https://github.com/postcss/autoprefixer/releases) - [Changelog](https://github.com/postcss/autoprefixer/blob/main/CHANGELOG.md) - [Commits](https://github.com/postcss/autoprefixer/compare/10.4.14...10.4.16) --- updated-dependencies: - dependency-name: autoprefixer dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] --- package-lock.json | 68 ++++++++++++++++++++++++++--------------------- package.json | 2 +- 2 files changed, 39 insertions(+), 31 deletions(-) diff --git a/package-lock.json b/package-lock.json index 704df25..61848d6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -20,7 +20,7 @@ "@uiw/codemirror-themes": "^4.21.9", "@uiw/react-codemirror": "^4.21.20", "@vercel/analytics": "^1.0.2", - "autoprefixer": "10.4.14", + "autoprefixer": "10.4.16", "emoji-picker-react": "^4.5.3", "eslint": "8.47.0", "eslint-config-next": "13.5.5", @@ -2856,9 +2856,9 @@ } }, "node_modules/autoprefixer": { - "version": "10.4.14", - "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.14.tgz", - "integrity": "sha512-FQzyfOsTlwVzjHxKEqRIAdJx9niO6VCBCoEwax/VLSoQF29ggECcPuBqUMZ+u8jCZOPSy8b8/8KnuFbp0SaFZQ==", + "version": "10.4.16", + "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.16.tgz", + "integrity": "sha512-7vd3UC6xKp0HLfua5IjZlcXvGAGy7cBAXTg2lyQ/8WpNhd6SiZ8Be+xm3FyBSYJx5GKcpRCzBh7RH4/0dnY+uQ==", "funding": [ { "type": "opencollective", @@ -2867,12 +2867,16 @@ { "type": "tidelift", "url": "https://tidelift.com/funding/github/npm/autoprefixer" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" } ], "dependencies": { - "browserslist": "^4.21.5", - "caniuse-lite": "^1.0.30001464", - "fraction.js": "^4.2.0", + "browserslist": "^4.21.10", + "caniuse-lite": "^1.0.30001538", + "fraction.js": "^4.3.6", "normalize-range": "^0.1.2", "picocolors": "^1.0.0", "postcss-value-parser": "^4.2.0" @@ -3036,9 +3040,9 @@ } }, "node_modules/browserslist": { - "version": "4.21.5", - "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.21.5.tgz", - "integrity": "sha512-tUkiguQGW7S3IhB7N+c2MV/HZPSCPAAiYBZXLsBhFB/PCy6ZKKsZrmBayHV9fdGV/ARIfJ14NkxKzRDjvp7L6w==", + "version": "4.22.1", + "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.22.1.tgz", + "integrity": "sha512-FEVc202+2iuClEhZhrWy6ZiAcRLvNMyYcxZ8raemul1DYVOVdFsbqckWLdsixQZCpJlwe77Z3UTalE7jsjnKfQ==", "funding": [ { "type": "opencollective", @@ -3047,13 +3051,17 @@ { "type": "tidelift", "url": "https://tidelift.com/funding/github/npm/browserslist" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" } ], "dependencies": { - "caniuse-lite": "^1.0.30001449", - "electron-to-chromium": "^1.4.284", - "node-releases": "^2.0.8", - "update-browserslist-db": "^1.0.10" + "caniuse-lite": "^1.0.30001541", + "electron-to-chromium": "^1.4.535", + "node-releases": "^2.0.13", + "update-browserslist-db": "^1.0.13" }, "bin": { "browserslist": "cli.js" @@ -3174,9 +3182,9 @@ } }, "node_modules/caniuse-lite": { - "version": "1.0.30001482", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001482.tgz", - "integrity": "sha512-F1ZInsg53cegyjroxLNW9DmrEQ1SuGRTO1QlpA0o2/6OpQ0gFeDRoq1yFmnr8Sakn9qwwt9DmbxHB6w167OSuQ==", + "version": "1.0.30001553", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001553.tgz", + "integrity": "sha512-N0ttd6TrFfuqKNi+pMgWJTb9qrdJu4JSpgPFLe/lrD19ugC6fZgF0pUewRowDwzdDnb9V41mFcdlYgl/PyKf4A==", "funding": [ { "type": "opencollective", @@ -3974,9 +3982,9 @@ } }, "node_modules/electron-to-chromium": { - "version": "1.4.383", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.383.tgz", - "integrity": "sha512-BQyvFauIMzCJqILViJNs0kIBEAlx1bYLS5CRLyJtlun1KAnZlhNSgyfyWifPWagQ5s8KYPY6BpNHZsEMkxZAQQ==" + "version": "1.4.564", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.564.tgz", + "integrity": "sha512-bGAx9+teIzL5I4esQwCMtiXtb78Ysc8xOKTPOvmafbJZ4SQ40kDO1ym3yRcGSkfaBtV81fGgHOgPoe6DsmpmkA==" }, "node_modules/emoji-picker-react": { "version": "4.5.3", @@ -4916,15 +4924,15 @@ } }, "node_modules/fraction.js": { - "version": "4.2.0", - "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.2.0.tgz", - "integrity": "sha512-MhLuK+2gUcnZe8ZHlaaINnQLl0xRIGRfcGk2yl8xoQAfHrSsL3rYu6FCmBdkdbhc9EPlwyGHewaRsvwRMJtAlA==", + "version": "4.3.7", + "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.3.7.tgz", + "integrity": "sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==", "engines": { "node": "*" }, "funding": { "type": "patreon", - "url": "https://www.patreon.com/infusion" + "url": "https://github.com/sponsors/rawify" } }, "node_modules/fs-extra": { @@ -6540,9 +6548,9 @@ } }, "node_modules/node-releases": { - "version": "2.0.10", - "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.10.tgz", - "integrity": "sha512-5GFldHPXVG/YZmFzJvKK2zDSzPKhEp0+ZR5SVaoSag9fsL5YgHbUHDfnG5494ISANDcK4KwPXAx2xqVEydmd7w==" + "version": "2.0.13", + "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.13.tgz", + "integrity": "sha512-uYr7J37ae/ORWdZeQ1xxMJe3NtdmqMC/JZK+geofDrkLUApKRHPd18/TxtBOJ4A0/+uUIliorNrfYV6s1b02eQ==" }, "node_modules/normalize-path": { "version": "3.0.0", @@ -8896,9 +8904,9 @@ } }, "node_modules/update-browserslist-db": { - "version": "1.0.11", - "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.11.tgz", - "integrity": "sha512-dCwEFf0/oT85M1fHBg4F0jtLwJrutGoHSQXCh7u4o2t1drG+c0a9Flnqww6XUKSfQMPpJBRjU8d4RXB09qtvaA==", + "version": "1.0.13", + "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.13.tgz", + "integrity": "sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg==", "funding": [ { "type": "opencollective", diff --git a/package.json b/package.json index 9163066..bbb4d8e 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,7 @@ "@uiw/codemirror-themes": "^4.21.9", "@uiw/react-codemirror": "^4.21.20", "@vercel/analytics": "^1.0.2", - "autoprefixer": "10.4.14", + "autoprefixer": "10.4.16", "emoji-picker-react": "^4.5.3", "eslint": "8.47.0", "eslint-config-next": "13.5.5", From d2bee5fd4eb742be0c27e37f6c29a627249a2a34 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 20 Nov 2023 21:27:41 +0000 Subject: [PATCH 39/60] chore: bump react-intl from 6.4.4 to 6.5.5 Bumps [react-intl](https://github.com/formatjs/formatjs) from 6.4.4 to 6.5.5. - [Release notes](https://github.com/formatjs/formatjs/releases) - [Commits](https://github.com/formatjs/formatjs/compare/react-intl@6.4.4...react-intl@6.5.5) --- updated-dependencies: - dependency-name: react-intl dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] --- package-lock.json | 106 +++++++++++++++++++++++----------------------- package.json | 2 +- 2 files changed, 54 insertions(+), 54 deletions(-) diff --git a/package-lock.json b/package-lock.json index fece77a..bda5054 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,8 +8,8 @@ "name": "dummyi", "version": "0.1.0", "dependencies": { - "@douyinfe/semi-ui": "^2.42.1", "@douyinfe/semi-next": "^2.41.2", + "@douyinfe/semi-ui": "^2.42.1", "@faker-js/faker": "^8.0.2", "@reduxjs/toolkit": "^1.9.5", "@semi-bot/semi-theme-mockdatanz": "^1.1.6", @@ -34,7 +34,7 @@ "react": "18.2.0", "react-beautiful-dnd": "^13.1.1", "react-dom": "18.2.0", - "react-intl": "^6.4.4", + "react-intl": "^6.5.5", "react-redux": "^8.1.3", "react-reflex": "^4.1.0", "react-sparklines": "^1.7.0", @@ -1367,11 +1367,11 @@ } }, "node_modules/@formatjs/ecma402-abstract": { - "version": "1.17.0", - "resolved": "https://registry.npmjs.org/@formatjs/ecma402-abstract/-/ecma402-abstract-1.17.0.tgz", - "integrity": "sha512-6ueQTeJZtwKjmh23bdkq/DMqH4l4bmfvtQH98blOSbiXv/OUiyijSW6jU22IT8BNM1ujCaEvJfTtyCYVH38EMQ==", + "version": "1.18.0", + "resolved": "https://registry.npmjs.org/@formatjs/ecma402-abstract/-/ecma402-abstract-1.18.0.tgz", + "integrity": "sha512-PEVLoa3zBevWSCZzPIM/lvPCi8P5l4G+NXQMc/CjEiaCWgyHieUoo0nM7Bs0n/NbuQ6JpXEolivQ9pKSBHaDlA==", "dependencies": { - "@formatjs/intl-localematcher": "0.4.0", + "@formatjs/intl-localematcher": "0.5.2", "tslib": "^2.4.0" } }, @@ -1384,39 +1384,39 @@ } }, "node_modules/@formatjs/icu-messageformat-parser": { - "version": "2.6.0", - "resolved": "https://registry.npmjs.org/@formatjs/icu-messageformat-parser/-/icu-messageformat-parser-2.6.0.tgz", - "integrity": "sha512-yT6at0qc0DANw9qM/TU8RZaCtfDXtj4pZM/IC2WnVU80yAcliS3KVDiuUt4jSQAeFL9JS5bc2hARnFmjPdA6qw==", + "version": "2.7.3", + "resolved": "https://registry.npmjs.org/@formatjs/icu-messageformat-parser/-/icu-messageformat-parser-2.7.3.tgz", + "integrity": "sha512-X/jy10V9S/vW+qlplqhMUxR8wErQ0mmIYSq4mrjpjDl9mbuGcCILcI1SUYkL5nlM4PJqpc0KOS0bFkkJNPxYRw==", "dependencies": { - "@formatjs/ecma402-abstract": "1.17.0", - "@formatjs/icu-skeleton-parser": "1.6.0", + "@formatjs/ecma402-abstract": "1.18.0", + "@formatjs/icu-skeleton-parser": "1.7.0", "tslib": "^2.4.0" } }, "node_modules/@formatjs/icu-skeleton-parser": { - "version": "1.6.0", - "resolved": "https://registry.npmjs.org/@formatjs/icu-skeleton-parser/-/icu-skeleton-parser-1.6.0.tgz", - "integrity": "sha512-eMmxNpoX/J1IPUjPGSZwo0Wh+7CEvdEMddP2Jxg1gQJXfGfht/FdW2D5XDFj3VMbOTUQlDIdZJY7uC6O6gjPoA==", + "version": "1.7.0", + "resolved": "https://registry.npmjs.org/@formatjs/icu-skeleton-parser/-/icu-skeleton-parser-1.7.0.tgz", + "integrity": "sha512-Cfdo/fgbZzpN/jlN/ptQVe0lRHora+8ezrEeg2RfrNjyp+YStwBy7cqDY8k5/z2LzXg6O0AdzAV91XS0zIWv+A==", "dependencies": { - "@formatjs/ecma402-abstract": "1.17.0", + "@formatjs/ecma402-abstract": "1.18.0", "tslib": "^2.4.0" } }, "node_modules/@formatjs/intl": { - "version": "2.9.0", - "resolved": "https://registry.npmjs.org/@formatjs/intl/-/intl-2.9.0.tgz", - "integrity": "sha512-Ym0trUoC/VO6wQu4YHa0H1VR2tEixFRmwZgADkDLm7nD+vv1Ob+/88mUAoT0pwvirFqYKgUKEwp1tFepqyqvVA==", + "version": "2.9.9", + "resolved": "https://registry.npmjs.org/@formatjs/intl/-/intl-2.9.9.tgz", + "integrity": "sha512-JI3CNgL2Zdg5lv9ncT2sYKqbAj2RGrCbdzaCckIxMPxn4QuHuOVvYUGmBAXVusBmfG/0sxLmMrnwnBioz+QKdA==", "dependencies": { - "@formatjs/ecma402-abstract": "1.17.0", + "@formatjs/ecma402-abstract": "1.18.0", "@formatjs/fast-memoize": "2.2.0", - "@formatjs/icu-messageformat-parser": "2.6.0", - "@formatjs/intl-displaynames": "6.5.0", - "@formatjs/intl-listformat": "7.4.0", - "intl-messageformat": "10.5.0", + "@formatjs/icu-messageformat-parser": "2.7.3", + "@formatjs/intl-displaynames": "6.6.4", + "@formatjs/intl-listformat": "7.5.3", + "intl-messageformat": "10.5.8", "tslib": "^2.4.0" }, "peerDependencies": { - "typescript": "^4.7 || 5" + "typescript": "5" }, "peerDependenciesMeta": { "typescript": { @@ -1425,29 +1425,29 @@ } }, "node_modules/@formatjs/intl-displaynames": { - "version": "6.5.0", - "resolved": "https://registry.npmjs.org/@formatjs/intl-displaynames/-/intl-displaynames-6.5.0.tgz", - "integrity": "sha512-sg/nR8ILEdUl+2sWu6jc1nQ5s04yucGlH1RVfatW8TSJ5uG3Yy3vgigi8NNC/BuhcncUNPWqSpTCSI1hA+rhiw==", + "version": "6.6.4", + "resolved": "https://registry.npmjs.org/@formatjs/intl-displaynames/-/intl-displaynames-6.6.4.tgz", + "integrity": "sha512-ET8KQ+L9Q0K8x1SnJQa4DNssUcbATlMopWqYvGGR8yAvw5qwAQc1fv+DshCoZNIE9pbcue0IGC4kWNAkWqlFag==", "dependencies": { - "@formatjs/ecma402-abstract": "1.17.0", - "@formatjs/intl-localematcher": "0.4.0", + "@formatjs/ecma402-abstract": "1.18.0", + "@formatjs/intl-localematcher": "0.5.2", "tslib": "^2.4.0" } }, "node_modules/@formatjs/intl-listformat": { - "version": "7.4.0", - "resolved": "https://registry.npmjs.org/@formatjs/intl-listformat/-/intl-listformat-7.4.0.tgz", - "integrity": "sha512-ifupb+balZUAF/Oh3QyGRqPRWGSKwWoMPR0cYZEG7r61SimD+m38oFQqVx/3Fp7LfQFF11m7IS+MlxOo2sKINA==", + "version": "7.5.3", + "resolved": "https://registry.npmjs.org/@formatjs/intl-listformat/-/intl-listformat-7.5.3.tgz", + "integrity": "sha512-l7EOr0Yh1m8KagytukB90yw81uyzrM7amKFrgxXqphz4KeSIL0KPa68lPsdtZ+JmQB73GaDQRwLOwUKFZ1VZPQ==", "dependencies": { - "@formatjs/ecma402-abstract": "1.17.0", - "@formatjs/intl-localematcher": "0.4.0", + "@formatjs/ecma402-abstract": "1.18.0", + "@formatjs/intl-localematcher": "0.5.2", "tslib": "^2.4.0" } }, "node_modules/@formatjs/intl-localematcher": { - "version": "0.4.0", - "resolved": "https://registry.npmjs.org/@formatjs/intl-localematcher/-/intl-localematcher-0.4.0.tgz", - "integrity": "sha512-bRTd+rKomvfdS4QDlVJ6TA/Jx1F2h/TBVO5LjvhQ7QPPHp19oPNMIum7W2CMEReq/zPxpmCeB31F9+5gl/qtvw==", + "version": "0.5.2", + "resolved": "https://registry.npmjs.org/@formatjs/intl-localematcher/-/intl-localematcher-0.5.2.tgz", + "integrity": "sha512-txaaE2fiBMagLrR4jYhxzFO6wEdEG4TPMqrzBAcbr4HFUYzH/YC+lg6OIzKCHm8WgDdyQevxbAAV1OgcXctuGw==", "dependencies": { "tslib": "^2.4.0" } @@ -5434,13 +5434,13 @@ } }, "node_modules/intl-messageformat": { - "version": "10.5.0", - "resolved": "https://registry.npmjs.org/intl-messageformat/-/intl-messageformat-10.5.0.tgz", - "integrity": "sha512-AvojYuOaRb6r2veOKfTVpxH9TrmjSdc5iR9R5RgBwrDZYSmAAFVT+QLbW3C4V7Qsg0OguMp67Q/EoUkxZzXRGw==", + "version": "10.5.8", + "resolved": "https://registry.npmjs.org/intl-messageformat/-/intl-messageformat-10.5.8.tgz", + "integrity": "sha512-NRf0jpBWV0vd671G5b06wNofAN8tp7WWDogMZyaU8GUAsmbouyvgwmFJI7zLjfAMpm3zK+vSwRP3jzaoIcMbaA==", "dependencies": { - "@formatjs/ecma402-abstract": "1.17.0", + "@formatjs/ecma402-abstract": "1.18.0", "@formatjs/fast-memoize": "2.2.0", - "@formatjs/icu-messageformat-parser": "2.6.0", + "@formatjs/icu-messageformat-parser": "2.7.3", "tslib": "^2.4.0" } }, @@ -7378,24 +7378,24 @@ } }, "node_modules/react-intl": { - "version": "6.4.4", - "resolved": "https://registry.npmjs.org/react-intl/-/react-intl-6.4.4.tgz", - "integrity": "sha512-/C9Sl/5//ohfkNG6AWlJuf4BhTXsbzyk93K62A4zRhSPANyOGpKZ+fWhN+TLfFd5YjDUHy+exU/09y0w1bO4Xw==", - "dependencies": { - "@formatjs/ecma402-abstract": "1.17.0", - "@formatjs/icu-messageformat-parser": "2.6.0", - "@formatjs/intl": "2.9.0", - "@formatjs/intl-displaynames": "6.5.0", - "@formatjs/intl-listformat": "7.4.0", + "version": "6.5.5", + "resolved": "https://registry.npmjs.org/react-intl/-/react-intl-6.5.5.tgz", + "integrity": "sha512-cI5UKvBh4tc1zxLIziHBYGMX3dhYWDEFlvUDVN6NfT2i96zTXz/zH2AmM8+2waqgOhwkFUzd+7kK1G9q7fiC2g==", + "dependencies": { + "@formatjs/ecma402-abstract": "1.18.0", + "@formatjs/icu-messageformat-parser": "2.7.3", + "@formatjs/intl": "2.9.9", + "@formatjs/intl-displaynames": "6.6.4", + "@formatjs/intl-listformat": "7.5.3", "@types/hoist-non-react-statics": "^3.3.1", "@types/react": "16 || 17 || 18", "hoist-non-react-statics": "^3.3.2", - "intl-messageformat": "10.5.0", + "intl-messageformat": "10.5.8", "tslib": "^2.4.0" }, "peerDependencies": { "react": "^16.6.0 || 17 || 18", - "typescript": "^4.7 || 5" + "typescript": "5" }, "peerDependenciesMeta": { "typescript": { diff --git a/package.json b/package.json index b581c03..e9c41e8 100644 --- a/package.json +++ b/package.json @@ -37,7 +37,7 @@ "react": "18.2.0", "react-beautiful-dnd": "^13.1.1", "react-dom": "18.2.0", - "react-intl": "^6.4.4", + "react-intl": "^6.5.5", "react-redux": "^8.1.3", "react-reflex": "^4.1.0", "react-sparklines": "^1.7.0", From 841f310c70d632c136e9e9a9bfdbd8b4bbc39ad4 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 11 Dec 2023 21:30:05 +0000 Subject: [PATCH 40/60] chore: bump next from 13.4.13 to 14.0.4 Bumps [next](https://github.com/vercel/next.js) from 13.4.13 to 14.0.4. - [Release notes](https://github.com/vercel/next.js/releases) - [Changelog](https://github.com/vercel/next.js/blob/canary/release.js) - [Commits](https://github.com/vercel/next.js/compare/v13.4.13...v14.0.4) --- updated-dependencies: - dependency-name: next dependency-type: direct:production update-type: version-update:semver-major ... Signed-off-by: dependabot[bot] --- package-lock.json | 126 ++++++++++++++++++++++------------------------ package.json | 2 +- 2 files changed, 62 insertions(+), 66 deletions(-) diff --git a/package-lock.json b/package-lock.json index fece77a..1645501 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,8 +8,8 @@ "name": "dummyi", "version": "0.1.0", "dependencies": { - "@douyinfe/semi-ui": "^2.42.1", "@douyinfe/semi-next": "^2.41.2", + "@douyinfe/semi-ui": "^2.42.1", "@faker-js/faker": "^8.0.2", "@reduxjs/toolkit": "^1.9.5", "@semi-bot/semi-theme-mockdatanz": "^1.1.6", @@ -26,7 +26,7 @@ "eslint-config-next": "13.5.5", "hamburger-react": "^2.5.0", "loadash": "^1.0.0", - "next": "13.4.13", + "next": "14.0.4", "next-redux-wrapper": "^8.1.0", "next-seo": "^6.1.0", "nextjs-progressbar": "^0.0.16", @@ -1679,9 +1679,9 @@ } }, "node_modules/@next/env": { - "version": "13.4.13", - "resolved": "https://registry.npmjs.org/@next/env/-/env-13.4.13.tgz", - "integrity": "sha512-fwz2QgVg08v7ZL7KmbQBLF2PubR/6zQdKBgmHEl3BCyWTEDsAQEijjw2gbFhI1tcKfLdOOJUXntz5vZ4S0Polg==" + "version": "14.0.4", + "resolved": "https://registry.npmjs.org/@next/env/-/env-14.0.4.tgz", + "integrity": "sha512-irQnbMLbUNQpP1wcE5NstJtbuA/69kRfzBrpAD7Gsn8zm/CY6YQYc3HQBz8QPxwISG26tIm5afvvVbu508oBeQ==" }, "node_modules/@next/eslint-plugin-next": { "version": "13.5.5", @@ -1692,9 +1692,9 @@ } }, "node_modules/@next/swc-darwin-arm64": { - "version": "13.4.13", - "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-13.4.13.tgz", - "integrity": "sha512-ZptVhHjzUuivnXMNCJ6lER33HN7lC+rZ01z+PM10Ows21NHFYMvGhi5iXkGtBDk6VmtzsbqnAjnx4Oz5um0FjA==", + "version": "14.0.4", + "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-14.0.4.tgz", + "integrity": "sha512-mF05E/5uPthWzyYDyptcwHptucf/jj09i2SXBPwNzbgBNc+XnwzrL0U6BmPjQeOL+FiB+iG1gwBeq7mlDjSRPg==", "cpu": [ "arm64" ], @@ -1707,9 +1707,9 @@ } }, "node_modules/@next/swc-darwin-x64": { - "version": "13.4.13", - "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-13.4.13.tgz", - "integrity": "sha512-t9nTiWCLApw8W4G1kqJyYP7y6/7lyal3PftmRturIxAIBlZss9wrtVN8nci50StDHmIlIDxfguYIEGVr9DbFTg==", + "version": "14.0.4", + "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-14.0.4.tgz", + "integrity": "sha512-IZQ3C7Bx0k2rYtrZZxKKiusMTM9WWcK5ajyhOZkYYTCc8xytmwSzR1skU7qLgVT/EY9xtXDG0WhY6fyujnI3rw==", "cpu": [ "x64" ], @@ -1722,9 +1722,9 @@ } }, "node_modules/@next/swc-linux-arm64-gnu": { - "version": "13.4.13", - "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-13.4.13.tgz", - "integrity": "sha512-xEHUqC8eqR5DHe8SOmMnDU1K3ggrJ28uIKltrQAwqFSSSmzjnN/XMocZkcVhuncuxYrpbri0iMQstRyRVdQVWg==", + "version": "14.0.4", + "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-14.0.4.tgz", + "integrity": "sha512-VwwZKrBQo/MGb1VOrxJ6LrKvbpo7UbROuyMRvQKTFKhNaXjUmKTu7wxVkIuCARAfiI8JpaWAnKR+D6tzpCcM4w==", "cpu": [ "arm64" ], @@ -1737,9 +1737,9 @@ } }, "node_modules/@next/swc-linux-arm64-musl": { - "version": "13.4.13", - "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-13.4.13.tgz", - "integrity": "sha512-sNf3MnLAm8rquSSAoeD9nVcdaDeRYOeey4stOWOyWIgbBDtP+C93amSgH/LPTDoUV7gNiU6f+ghepTjTjRgIUQ==", + "version": "14.0.4", + "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-14.0.4.tgz", + "integrity": "sha512-8QftwPEW37XxXoAwsn+nXlodKWHfpMaSvt81W43Wh8dv0gkheD+30ezWMcFGHLI71KiWmHK5PSQbTQGUiidvLQ==", "cpu": [ "arm64" ], @@ -1752,9 +1752,9 @@ } }, "node_modules/@next/swc-linux-x64-gnu": { - "version": "13.4.13", - "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-13.4.13.tgz", - "integrity": "sha512-WhcRaJJSHyx9OWmKjjz+OWHumiPZWRqmM/09Bt7Up4UqUJFFhGExeztR4trtv3rflvULatu9IH/nTV8fUUgaMA==", + "version": "14.0.4", + "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-14.0.4.tgz", + "integrity": "sha512-/s/Pme3VKfZAfISlYVq2hzFS8AcAIOTnoKupc/j4WlvF6GQ0VouS2Q2KEgPuO1eMBwakWPB1aYFIA4VNVh667A==", "cpu": [ "x64" ], @@ -1767,9 +1767,9 @@ } }, "node_modules/@next/swc-linux-x64-musl": { - "version": "13.4.13", - "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-13.4.13.tgz", - "integrity": "sha512-+Y4LLhOWWZQIDKVwr2R17lq2KSN0F1c30QVgGIWfnjjHpH8nrIWHEndhqYU+iFuW8It78CiJjQKTw4f51HD7jA==", + "version": "14.0.4", + "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-14.0.4.tgz", + "integrity": "sha512-m8z/6Fyal4L9Bnlxde5g2Mfa1Z7dasMQyhEhskDATpqr+Y0mjOBZcXQ7G5U+vgL22cI4T7MfvgtrM2jdopqWaw==", "cpu": [ "x64" ], @@ -1782,9 +1782,9 @@ } }, "node_modules/@next/swc-win32-arm64-msvc": { - "version": "13.4.13", - "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-13.4.13.tgz", - "integrity": "sha512-rWurdOR20uxjfqd1X9vDAgv0Jb26KjyL8akF9CBeFqX8rVaBAnW/Wf6A2gYEwyYY4Bai3T7p1kro6DFrsvBAAw==", + "version": "14.0.4", + "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-14.0.4.tgz", + "integrity": "sha512-7Wv4PRiWIAWbm5XrGz3D8HUkCVDMMz9igffZG4NB1p4u1KoItwx9qjATHz88kwCEal/HXmbShucaslXCQXUM5w==", "cpu": [ "arm64" ], @@ -1797,9 +1797,9 @@ } }, "node_modules/@next/swc-win32-ia32-msvc": { - "version": "13.4.13", - "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-13.4.13.tgz", - "integrity": "sha512-E8bSPwRuY5ibJ3CzLQmJEt8qaWrPYuUTwnrwygPUEWoLzD5YRx9SD37oXRdU81TgGwDzCxpl7z5Nqlfk50xAog==", + "version": "14.0.4", + "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-14.0.4.tgz", + "integrity": "sha512-zLeNEAPULsl0phfGb4kdzF/cAVIfaC7hY+kt0/d+y9mzcZHsMS3hAS829WbJ31DkSlVKQeHEjZHIdhN+Pg7Gyg==", "cpu": [ "ia32" ], @@ -1812,9 +1812,9 @@ } }, "node_modules/@next/swc-win32-x64-msvc": { - "version": "13.4.13", - "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-13.4.13.tgz", - "integrity": "sha512-4KlyC6jWRubPnppgfYsNTPeWfGCxtWLh5vaOAW/kdzAk9widqho8Qb5S4K2vHmal1tsURi7Onk2MMCV1phvyqA==", + "version": "14.0.4", + "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-14.0.4.tgz", + "integrity": "sha512-yEh2+R8qDlDCjxVpzOTEpBLQTEFAcP2A8fUFLaWNap9GitYKkKv1//y2S6XY6zsR4rCOPRpU7plYDR+az2n30A==", "cpu": [ "x64" ], @@ -1982,9 +1982,9 @@ "integrity": "sha512-8wr4tEOtJc76LJa9s8tpEPVf5s/E3sakEFb3kna2awihb7TySXhbTUkGYTuMnBxtFhfIM9qnUJ4N2lajDE/DAg==" }, "node_modules/@swc/helpers": { - "version": "0.5.1", - "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.1.tgz", - "integrity": "sha512-sJ902EfIzn1Fa+qYmjdQqh8tPsoxyBz+8yBKC2HKUxyezKJFwPGOn7pv4WY6QuQW//ySQi5lJjA/ZT9sNWWNTg==", + "version": "0.5.2", + "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.2.tgz", + "integrity": "sha512-E4KcWTpoLHqwPHLxidpOqQbcrZVgi0rsmmZXUle1jXmJfuIf/UWpczUJ7MZZ5tlxytgJXyp0w4PGkkeLiuIdZw==", "dependencies": { "tslib": "^2.4.0" } @@ -6437,35 +6437,35 @@ "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==" }, "node_modules/next": { - "version": "13.4.13", - "resolved": "https://registry.npmjs.org/next/-/next-13.4.13.tgz", - "integrity": "sha512-A3YVbVDNeXLhWsZ8Nf6IkxmNlmTNz0yVg186NJ97tGZqPDdPzTrHotJ+A1cuJm2XfuWPrKOUZILl5iBQkIf8Jw==", + "version": "14.0.4", + "resolved": "https://registry.npmjs.org/next/-/next-14.0.4.tgz", + "integrity": "sha512-qbwypnM7327SadwFtxXnQdGiKpkuhaRLE2uq62/nRul9cj9KhQ5LhHmlziTNqUidZotw/Q1I9OjirBROdUJNgA==", "dependencies": { - "@next/env": "13.4.13", - "@swc/helpers": "0.5.1", + "@next/env": "14.0.4", + "@swc/helpers": "0.5.2", "busboy": "1.6.0", "caniuse-lite": "^1.0.30001406", - "postcss": "8.4.14", + "graceful-fs": "^4.2.11", + "postcss": "8.4.31", "styled-jsx": "5.1.1", - "watchpack": "2.4.0", - "zod": "3.21.4" + "watchpack": "2.4.0" }, "bin": { "next": "dist/bin/next" }, "engines": { - "node": ">=16.8.0" + "node": ">=18.17.0" }, "optionalDependencies": { - "@next/swc-darwin-arm64": "13.4.13", - "@next/swc-darwin-x64": "13.4.13", - "@next/swc-linux-arm64-gnu": "13.4.13", - "@next/swc-linux-arm64-musl": "13.4.13", - "@next/swc-linux-x64-gnu": "13.4.13", - "@next/swc-linux-x64-musl": "13.4.13", - "@next/swc-win32-arm64-msvc": "13.4.13", - "@next/swc-win32-ia32-msvc": "13.4.13", - "@next/swc-win32-x64-msvc": "13.4.13" + "@next/swc-darwin-arm64": "14.0.4", + "@next/swc-darwin-x64": "14.0.4", + "@next/swc-linux-arm64-gnu": "14.0.4", + "@next/swc-linux-arm64-musl": "14.0.4", + "@next/swc-linux-x64-gnu": "14.0.4", + "@next/swc-linux-x64-musl": "14.0.4", + "@next/swc-win32-arm64-msvc": "14.0.4", + "@next/swc-win32-ia32-msvc": "14.0.4", + "@next/swc-win32-x64-msvc": "14.0.4" }, "peerDependencies": { "@opentelemetry/api": "^1.1.0", @@ -6503,9 +6503,9 @@ } }, "node_modules/next/node_modules/postcss": { - "version": "8.4.14", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.14.tgz", - "integrity": "sha512-E398TUmfAYFPBSdzgeieK2Y1+1cpdxJx8yXbK/m57nRhKSmk1GB2tO4lbLBtlkfPQTDKfe4Xqv1ASWPpayPEig==", + "version": "8.4.31", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.31.tgz", + "integrity": "sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ==", "funding": [ { "type": "opencollective", @@ -6514,10 +6514,14 @@ { "type": "tidelift", "url": "https://tidelift.com/funding/github/npm/postcss" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" } ], "dependencies": { - "nanoid": "^3.3.4", + "nanoid": "^3.3.6", "picocolors": "^1.0.0", "source-map-js": "^1.0.2" }, @@ -9251,14 +9255,6 @@ "funding": { "url": "https://github.com/sponsors/sindresorhus" } - }, - "node_modules/zod": { - "version": "3.21.4", - "resolved": "https://registry.npmjs.org/zod/-/zod-3.21.4.tgz", - "integrity": "sha512-m46AKbrzKVzOzs/DZgVnG5H55N1sv1M8qZU3A8RIKbs3mrACDNeIOeilDymVb2HdmP8uwshOCF4uJ8uM9rCqJw==", - "funding": { - "url": "https://github.com/sponsors/colinhacks" - } } } } diff --git a/package.json b/package.json index b581c03..fcc74f3 100644 --- a/package.json +++ b/package.json @@ -29,7 +29,7 @@ "eslint-config-next": "13.5.5", "hamburger-react": "^2.5.0", "loadash": "^1.0.0", - "next": "13.4.13", + "next": "14.0.4", "next-redux-wrapper": "^8.1.0", "next-seo": "^6.1.0", "nextjs-progressbar": "^0.0.16", From 38f56e71174633d48ea1f2c7909ebebb002b4231 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 15 Jan 2024 21:58:53 +0000 Subject: [PATCH 41/60] chore: bump @douyinfe/semi-ui from 2.42.1 to 2.51.0 Bumps [@douyinfe/semi-ui](https://github.com/DouyinFE/semi-design) from 2.42.1 to 2.51.0. - [Release notes](https://github.com/DouyinFE/semi-design/releases) - [Commits](https://github.com/DouyinFE/semi-design/compare/v2.42.1...v2.51.0) --- updated-dependencies: - dependency-name: "@douyinfe/semi-ui" dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] --- package-lock.json | 74 +++++++++++++++++++++++------------------------ package.json | 2 +- 2 files changed, 38 insertions(+), 38 deletions(-) diff --git a/package-lock.json b/package-lock.json index fece77a..16524fa 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,8 +8,8 @@ "name": "dummyi", "version": "0.1.0", "dependencies": { - "@douyinfe/semi-ui": "^2.42.1", "@douyinfe/semi-next": "^2.41.2", + "@douyinfe/semi-ui": "^2.51.0", "@faker-js/faker": "^8.0.2", "@reduxjs/toolkit": "^1.9.5", "@semi-bot/semi-theme-mockdatanz": "^1.1.6", @@ -807,34 +807,34 @@ } }, "node_modules/@douyinfe/semi-animation": { - "version": "2.42.1", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation/-/semi-animation-2.42.1.tgz", - "integrity": "sha512-7Ks/pvaz6m0u9AtYM8WnBKYKCvQKtHEgJdoBRoYnomyyNmLe9dK37do6GjJtHscWh+VbZWXj47lCHOuBwy9PIA==", + "version": "2.51.0", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation/-/semi-animation-2.51.0.tgz", + "integrity": "sha512-Fmy/eU+7mBBw/50v/62GChOAXGFo/UugODX/ySK1aJXsjkVKKIQSX3Sdu0mAtqZj00URHo1hoXFaU59fgmeVaw==", "dependencies": { "bezier-easing": "^2.1.0" } }, "node_modules/@douyinfe/semi-animation-react": { - "version": "2.42.1", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation-react/-/semi-animation-react-2.42.1.tgz", - "integrity": "sha512-zu6+VOyjoF5dEVU/yxIZN8jYHgprjTFQaXvEdROYMXZobSU9iwW2V0NblO2ORqLPmDUSyjIIYfoSsVABlgehrw==", + "version": "2.51.0", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation-react/-/semi-animation-react-2.51.0.tgz", + "integrity": "sha512-Mt5VcK2UGIzRlEq2A/+vDfHLoWJ/H80ApBxPxtPkCEyZgdxQ6qZoegnHxH/iPIdhFRsBIJaaDTj1BFCjCN1kLQ==", "dependencies": { - "@douyinfe/semi-animation": "2.42.1", - "@douyinfe/semi-animation-styled": "2.42.1", + "@douyinfe/semi-animation": "2.51.0", + "@douyinfe/semi-animation-styled": "2.51.0", "classnames": "^2.2.6" } }, "node_modules/@douyinfe/semi-animation-styled": { - "version": "2.42.1", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation-styled/-/semi-animation-styled-2.42.1.tgz", - "integrity": "sha512-iFeog9TyN+ctzh44QNOg1YSLYHQqxnhw0S/DwtMPHTB4Yc2Vm+VZtjX/dwl5YuwfmGmoGg+aE0PHLeIAKsm+zQ==" + "version": "2.51.0", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-animation-styled/-/semi-animation-styled-2.51.0.tgz", + "integrity": "sha512-JascXmOsZiOXRlbnkF67ymNSNyo6m4BFQ9FeiQoFRtuRHVGey3fO59DfisMgOTGQQ7EoAhyKRe/vjQn7s2F5Rg==" }, "node_modules/@douyinfe/semi-foundation": { - "version": "2.42.1", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-foundation/-/semi-foundation-2.42.1.tgz", - "integrity": "sha512-BFmAL/T6VavaFU9ncDJLOAE8YYG0ny45Lh0/OP9KBRWoYheCZa9coURjqo/kQFl7y2Lrrpfz62ak1Fh+Esstdw==", + "version": "2.51.0", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-foundation/-/semi-foundation-2.51.0.tgz", + "integrity": "sha512-9KUa8lYFNvRsMmd0JZ40KQCI3tZe+hPGN3V+lhTJ2+lDh4jaerESI8mmPRNn5L010t4yWGugBOBUbPegFvkKvA==", "dependencies": { - "@douyinfe/semi-animation": "2.42.1", + "@douyinfe/semi-animation": "2.51.0", "async-validator": "^3.5.0", "classnames": "^2.2.6", "date-fns": "^2.29.3", @@ -845,9 +845,9 @@ } }, "node_modules/@douyinfe/semi-icons": { - "version": "2.42.1", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-icons/-/semi-icons-2.42.1.tgz", - "integrity": "sha512-vIo010+zF2pF9WXz7E+TLkiQrIZ38nilPzn+jsfgO0v32w0Dd1DXu1Nja7Aw4k9LHx5ViLPQCOS4bCCfiSF6TA==", + "version": "2.51.0", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-icons/-/semi-icons-2.51.0.tgz", + "integrity": "sha512-GMT+SF2P2yLJoldsJsiwN/moY3JV8Ejl4lkPRkZkVPGtIl/VvdVV0mV/7si+IpClCttW9HiawYizTRE9PkLSWA==", "dependencies": { "classnames": "^2.2.6" }, @@ -856,9 +856,9 @@ } }, "node_modules/@douyinfe/semi-illustrations": { - "version": "2.42.1", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-illustrations/-/semi-illustrations-2.42.1.tgz", - "integrity": "sha512-rdHcGv0JxSd1M/WMrp/l7iQ5QoVafxwzdFPexzsmbjYlVY/nQhnvCGSKorDl5BwG1en5RsqSbyvZvJA0Xxrv5w==", + "version": "2.51.0", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-illustrations/-/semi-illustrations-2.51.0.tgz", + "integrity": "sha512-URY/NvelzSSITABBLq/teIDCygii9gVpmYiDJQdVSjbS4xG2+6qkQUpYLJTrs3h0OfndIv6kZSq2w0+7Z1JkSw==", "peerDependencies": { "react": "^16.8.0 || ^17.0.0 || ^18.0.0" } @@ -872,27 +872,27 @@ } }, "node_modules/@douyinfe/semi-theme-default": { - "version": "2.42.1", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-theme-default/-/semi-theme-default-2.42.1.tgz", - "integrity": "sha512-HdAvzwLM1XAaeC2nzByzsib+9VF52HmnJPRWb8uC1MBXM42zFd/DtgwlSD+Rxtu3lvMHq87XLN54/VCWODocfg==", + "version": "2.51.0", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-theme-default/-/semi-theme-default-2.51.0.tgz", + "integrity": "sha512-Kwyzlpii90oiJ2zPxBdPp3RurcvRTjJ4U64+uj0+rIfYr3aEzLakvrGYweWE4ny17zQqctMiG84zJsx662C8GA==", "dependencies": { "glob": "^7.1.6" } }, "node_modules/@douyinfe/semi-ui": { - "version": "2.42.1", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-ui/-/semi-ui-2.42.1.tgz", - "integrity": "sha512-UUlnZNao9eUcPIUwdmahrCFxnCZQxogr1DmozPN2jEDHUaOjqFsAd3maugGMtWDksVt3SCBUJQJqqdETh7qJDw==", + "version": "2.51.0", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-ui/-/semi-ui-2.51.0.tgz", + "integrity": "sha512-0UTxUELZ6z4FOH9EKjbJLlmoD+wvPPWJs+lNmHKQ6zqNYSzx2d6MIm4U7biNY6yXKwcJWhFOw5QY5BwgjHdGnA==", "dependencies": { "@dnd-kit/core": "^6.0.8", "@dnd-kit/sortable": "^7.0.2", "@dnd-kit/utilities": "^3.2.1", - "@douyinfe/semi-animation": "2.42.1", - "@douyinfe/semi-animation-react": "2.42.1", - "@douyinfe/semi-foundation": "2.42.1", - "@douyinfe/semi-icons": "2.42.1", - "@douyinfe/semi-illustrations": "2.42.1", - "@douyinfe/semi-theme-default": "2.42.1", + "@douyinfe/semi-animation": "2.51.0", + "@douyinfe/semi-animation-react": "2.51.0", + "@douyinfe/semi-foundation": "2.51.0", + "@douyinfe/semi-icons": "2.51.0", + "@douyinfe/semi-illustrations": "2.51.0", + "@douyinfe/semi-theme-default": "2.51.0", "async-validator": "^3.5.0", "classnames": "^2.2.6", "copy-text-to-clipboard": "^2.1.1", @@ -3283,9 +3283,9 @@ } }, "node_modules/classnames": { - "version": "2.3.2", - "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.2.tgz", - "integrity": "sha512-CSbhY4cFEJRe6/GQzIk5qXZ4Jeg5pcsP7b5peFSDpffpe1cqjASH/n9UTjBwOp6XpMSTwQ8Za2K5V02ueA7Tmw==" + "version": "2.5.1", + "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.5.1.tgz", + "integrity": "sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow==" }, "node_modules/clean-stack": { "version": "2.2.0", diff --git a/package.json b/package.json index b581c03..68dbdfe 100644 --- a/package.json +++ b/package.json @@ -11,7 +11,7 @@ "add:generator": "tsx ./scripts/addNewGenerator.ts" }, "dependencies": { - "@douyinfe/semi-ui": "^2.42.1", + "@douyinfe/semi-ui": "^2.51.0", "@douyinfe/semi-next": "^2.41.2", "@faker-js/faker": "^8.0.2", "@reduxjs/toolkit": "^1.9.5", From 3a0d7326bfd94763f9f113c4b28b77934f3bd1fa Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 15 Jan 2024 22:08:55 +0000 Subject: [PATCH 42/60] chore: bump @douyinfe/semi-next from 2.41.2 to 2.51.0 Bumps [@douyinfe/semi-next]() from 2.41.2 to 2.51.0. --- updated-dependencies: - dependency-name: "@douyinfe/semi-next" dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] --- package-lock.json | 126 +++++++++++++++++++++++----------------------- package.json | 2 +- 2 files changed, 64 insertions(+), 64 deletions(-) diff --git a/package-lock.json b/package-lock.json index fece77a..8c2724e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,8 +8,8 @@ "name": "dummyi", "version": "0.1.0", "dependencies": { + "@douyinfe/semi-next": "^2.51.0", "@douyinfe/semi-ui": "^2.42.1", - "@douyinfe/semi-next": "^2.41.2", "@faker-js/faker": "^8.0.2", "@reduxjs/toolkit": "^1.9.5", "@semi-bot/semi-theme-mockdatanz": "^1.1.6", @@ -72,11 +72,11 @@ } }, "node_modules/@babel/code-frame": { - "version": "7.22.10", - "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.22.10.tgz", - "integrity": "sha512-/KKIMG4UEL35WmI9OlvMhurwtytjvXoFcGNrOvyG9zIzA8YmPjVtIZUf7b05+TPO7G7/GEmLHDaoCgACHl9hhA==", + "version": "7.23.5", + "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.23.5.tgz", + "integrity": "sha512-CgH3s1a96LipHCmSUmYFPwY7MNx8C3avkq7i4Wl3cfa662ldtUe4VM1TPXX70pfmrlWTb6jLqTYrZyT2ZTJBgA==", "dependencies": { - "@babel/highlight": "^7.22.10", + "@babel/highlight": "^7.23.4", "chalk": "^2.4.2" }, "engines": { @@ -148,11 +148,11 @@ } }, "node_modules/@babel/generator": { - "version": "7.22.10", - "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.22.10.tgz", - "integrity": "sha512-79KIf7YiWjjdZ81JnLujDRApWtl7BxTqWD88+FFdQEIOG8LJ0etDOM7CXuIgGJa55sGOwZVwuEsaLEm0PJ5/+A==", + "version": "7.23.6", + "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.23.6.tgz", + "integrity": "sha512-qrSfCYxYQB5owCmGLbl8XRpX1ytXlpueOb0N0UmQwA073KZxejgQTzAmJezxvpwQD9uGtK2shHdi55QT+MbjIw==", "dependencies": { - "@babel/types": "^7.22.10", + "@babel/types": "^7.23.6", "@jridgewell/gen-mapping": "^0.3.2", "@jridgewell/trace-mapping": "^0.3.17", "jsesc": "^2.5.1" @@ -162,20 +162,20 @@ } }, "node_modules/@babel/helper-environment-visitor": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/helper-environment-visitor/-/helper-environment-visitor-7.22.5.tgz", - "integrity": "sha512-XGmhECfVA/5sAt+H+xpSg0mfrHq6FzNr9Oxh7PSEBBRUb/mL7Kz3NICXb194rCqAEdxkhPT1a88teizAFyvk8Q==", + "version": "7.22.20", + "resolved": "https://registry.npmjs.org/@babel/helper-environment-visitor/-/helper-environment-visitor-7.22.20.tgz", + "integrity": "sha512-zfedSIzFhat/gFhWfHtgWvlec0nqB9YEIVrpuwjruLlXfUSnA8cJB0miHKwqDnQ7d32aKo2xt88/xZptwxbfhA==", "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/helper-function-name": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.22.5.tgz", - "integrity": "sha512-wtHSq6jMRE3uF2otvfuD3DIvVhOsSNshQl0Qrd7qC9oQJzHvOL4qQXlQn2916+CXGywIjpGuIkoyZRRxHPiNQQ==", + "version": "7.23.0", + "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.23.0.tgz", + "integrity": "sha512-OErEqsrxjZTJciZ4Oo+eoZqeW9UIiOcuYKRJA4ZAgV9myA+pOXhhmpfNCKjEH/auVfEYVFJ6y1Tc4r0eIApqiw==", "dependencies": { - "@babel/template": "^7.22.5", - "@babel/types": "^7.22.5" + "@babel/template": "^7.22.15", + "@babel/types": "^7.23.0" }, "engines": { "node": ">=6.9.0" @@ -204,27 +204,27 @@ } }, "node_modules/@babel/helper-string-parser": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.22.5.tgz", - "integrity": "sha512-mM4COjgZox8U+JcXQwPijIZLElkgEpO5rsERVDJTc2qfCDfERyob6k5WegS14SX18IIjv+XD+GrqNumY5JRCDw==", + "version": "7.23.4", + "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.23.4.tgz", + "integrity": "sha512-803gmbQdqwdf4olxrX4AJyFBV/RTr3rSmOj0rKwesmzlfhYNDEs+/iOcznzpNWlJlIlTJC2QfPFcHB6DlzdVLQ==", "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/helper-validator-identifier": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.22.5.tgz", - "integrity": "sha512-aJXu+6lErq8ltp+JhkJUfk1MTGyuA4v7f3pA+BJ5HLfNC6nAQ0Cpi9uOquUj8Hehg0aUiHzWQbOVJGao6ztBAQ==", + "version": "7.22.20", + "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.22.20.tgz", + "integrity": "sha512-Y4OZ+ytlatR8AI+8KZfKuL5urKp7qey08ha31L8b3BwewJAoJamTzyvxPR/5D+KkdJCGPq/+8TukHBlY10FX9A==", "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/highlight": { - "version": "7.22.10", - "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.22.10.tgz", - "integrity": "sha512-78aUtVcT7MUscr0K5mIEnkwxPE0MaxkR5RxRwuHaQ+JuU5AmTPhY+do2mdzVTnIJJpyBglql2pehuBIWHug+WQ==", + "version": "7.23.4", + "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.23.4.tgz", + "integrity": "sha512-acGdbYSfp2WheJoJm/EBBBLh/ID8KDc64ISZ9DYtBmC8/Q204PZJLHyzeB5qMzJ5trcOkybd78M4x2KWsUq++A==", "dependencies": { - "@babel/helper-validator-identifier": "^7.22.5", + "@babel/helper-validator-identifier": "^7.22.20", "chalk": "^2.4.2", "js-tokens": "^4.0.0" }, @@ -297,9 +297,9 @@ } }, "node_modules/@babel/parser": { - "version": "7.22.10", - "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.22.10.tgz", - "integrity": "sha512-lNbdGsQb9ekfsnjFGhEiF4hfFqGgfOP3H3d27re3n+CGhNuTSUEQdfWk556sTLNTloczcdM5TYF2LhzmDQKyvQ==", + "version": "7.23.6", + "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.23.6.tgz", + "integrity": "sha512-Z2uID7YJ7oNvAI20O9X0bblw7Qqs8Q2hFy0R9tAfnfLkp5MW0UH9eUvnDSnFwKZ0AvgS1ucqR4KzvVHgnke1VQ==", "bin": { "parser": "bin/babel-parser.js" }, @@ -319,32 +319,32 @@ } }, "node_modules/@babel/template": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.22.5.tgz", - "integrity": "sha512-X7yV7eiwAxdj9k94NEylvbVHLiVG1nvzCV2EAowhxLTwODV1jl9UzZ48leOC0sH7OnuHrIkllaBgneUykIcZaw==", + "version": "7.22.15", + "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.22.15.tgz", + "integrity": "sha512-QPErUVm4uyJa60rkI73qneDacvdvzxshT3kksGqlGWYdOTIUOwJ7RDUL8sGqslY1uXWSL6xMFKEXDS3ox2uF0w==", "dependencies": { - "@babel/code-frame": "^7.22.5", - "@babel/parser": "^7.22.5", - "@babel/types": "^7.22.5" + "@babel/code-frame": "^7.22.13", + "@babel/parser": "^7.22.15", + "@babel/types": "^7.22.15" }, "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/traverse": { - "version": "7.22.10", - "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.22.10.tgz", - "integrity": "sha512-Q/urqV4pRByiNNpb/f5OSv28ZlGJiFiiTh+GAHktbIrkPhPbl90+uW6SmpoLyZqutrg9AEaEf3Q/ZBRHBXgxig==", - "dependencies": { - "@babel/code-frame": "^7.22.10", - "@babel/generator": "^7.22.10", - "@babel/helper-environment-visitor": "^7.22.5", - "@babel/helper-function-name": "^7.22.5", + "version": "7.23.7", + "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.23.7.tgz", + "integrity": "sha512-tY3mM8rH9jM0YHFGyfC0/xf+SB5eKUu7HPj7/k3fpi9dAlsMc5YbQvDi0Sh2QTPXqMhyaAtzAr807TIyfQrmyg==", + "dependencies": { + "@babel/code-frame": "^7.23.5", + "@babel/generator": "^7.23.6", + "@babel/helper-environment-visitor": "^7.22.20", + "@babel/helper-function-name": "^7.23.0", "@babel/helper-hoist-variables": "^7.22.5", "@babel/helper-split-export-declaration": "^7.22.6", - "@babel/parser": "^7.22.10", - "@babel/types": "^7.22.10", - "debug": "^4.1.0", + "@babel/parser": "^7.23.6", + "@babel/types": "^7.23.6", + "debug": "^4.3.1", "globals": "^11.1.0" }, "engines": { @@ -360,12 +360,12 @@ } }, "node_modules/@babel/types": { - "version": "7.22.10", - "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.22.10.tgz", - "integrity": "sha512-obaoigiLrlDZ7TUQln/8m4mSqIW2QFeOrCQc9r+xsaHGNoplVNYlRVpsfE8Vj35GEm2ZH4ZhrNYogs/3fj85kg==", + "version": "7.23.6", + "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.23.6.tgz", + "integrity": "sha512-+uarb83brBzPKN38NX1MkB6vb6+mwvR6amUulqAE7ccQw1pEl+bCia9TbdG1lsnFP7lZySvUn37CHyXQdfTwzg==", "dependencies": { - "@babel/helper-string-parser": "^7.22.5", - "@babel/helper-validator-identifier": "^7.22.5", + "@babel/helper-string-parser": "^7.23.4", + "@babel/helper-validator-identifier": "^7.22.20", "to-fast-properties": "^2.0.0" }, "engines": { @@ -864,11 +864,11 @@ } }, "node_modules/@douyinfe/semi-next": { - "version": "2.41.2", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-next/-/semi-next-2.41.2.tgz", - "integrity": "sha512-Eyky4df2tdCuEe3HFshw9xfYj/2Szq80+QaSX6dA7PI76hLd0k8+996LEMNztqApzUY6rZVXDgzNs00P4AhptQ==", + "version": "2.51.0", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-next/-/semi-next-2.51.0.tgz", + "integrity": "sha512-9OQlelfnRqDerpkU2w7kyJsS9Dd0GxrFMwe3gIk295HQ1AZSbRSctG/uVFFwtq0vKlM9sS1YSHtSvIz/vLr9kQ==", "dependencies": { - "@douyinfe/semi-webpack-plugin": "2.41.2" + "@douyinfe/semi-webpack-plugin": "2.51.0" } }, "node_modules/@douyinfe/semi-theme-default": { @@ -912,9 +912,9 @@ } }, "node_modules/@douyinfe/semi-webpack-plugin": { - "version": "2.41.2", - "resolved": "https://registry.npmjs.org/@douyinfe/semi-webpack-plugin/-/semi-webpack-plugin-2.41.2.tgz", - "integrity": "sha512-96/pQaahAoDe8+WO0fTCxntRtxcs1gCuoEVmSzcvqptUMJxzFebIM3BpVfBnIjyTpQ3yzgZSoVv5l8gqKk5heg==", + "version": "2.51.0", + "resolved": "https://registry.npmjs.org/@douyinfe/semi-webpack-plugin/-/semi-webpack-plugin-2.51.0.tgz", + "integrity": "sha512-UVkAe75zMe/iJBJztqzEdD2dUPfk/Mj85d0/7xtxIHqpj7+gy8TfJEvGoZgaEiB70KIkRvx27JSDyB+W6OUrzg==", "dependencies": { "@babel/generator": "^7.15.8", "@babel/parser": "^7.15.8", @@ -7926,9 +7926,9 @@ } }, "node_modules/sass-loader": { - "version": "10.4.1", - "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-10.4.1.tgz", - "integrity": "sha512-aX/iJZTTpNUNx/OSYzo2KsjIUQHqvWsAhhUijFjAPdZTEhstjZI9zTNvkTTwsx+uNUJqUwOw5gacxQMx4hJxGQ==", + "version": "10.5.2", + "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-10.5.2.tgz", + "integrity": "sha512-vMUoSNOUKJILHpcNCCyD23X34gve1TS7Rjd9uXHeKqhvBG39x6XbswFDtpbTElj6XdMFezoWhkh5vtKudf2cgQ==", "dependencies": { "klona": "^2.0.4", "loader-utils": "^2.0.0", @@ -7945,7 +7945,7 @@ }, "peerDependencies": { "fibers": ">= 3.1.0", - "node-sass": "^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0", + "node-sass": "^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0", "sass": "^1.3.0", "webpack": "^4.36.0 || ^5.0.0" }, diff --git a/package.json b/package.json index b581c03..0f9d3af 100644 --- a/package.json +++ b/package.json @@ -12,7 +12,7 @@ }, "dependencies": { "@douyinfe/semi-ui": "^2.42.1", - "@douyinfe/semi-next": "^2.41.2", + "@douyinfe/semi-next": "^2.51.0", "@faker-js/faker": "^8.0.2", "@reduxjs/toolkit": "^1.9.5", "@semi-bot/semi-theme-mockdatanz": "^1.1.6", From 9f0954b85ed890542c2ba4cb41378fe86911810e Mon Sep 17 00:00:00 2001 From: Hong Weng Date: Fri, 1 Mar 2024 19:30:11 +1300 Subject: [PATCH 43/60] feat: add color generator --- src/constants/enums.ts | 1 + src/core/generators/Color/Color.tsx | 204 ++++++++++++++++++++++++++++ src/core/generators/Color/index.ts | 13 ++ src/core/generators/index.ts | 2 + src/locale/translations/en.ts | 5 + src/locale/translations/jaJP.ts | 4 + src/locale/translations/zhCN.ts | 4 + 7 files changed, 233 insertions(+) create mode 100644 src/core/generators/Color/Color.tsx create mode 100644 src/core/generators/Color/index.ts diff --git a/src/constants/enums.ts b/src/constants/enums.ts index efaa3db..28112ec 100644 --- a/src/constants/enums.ts +++ b/src/constants/enums.ts @@ -30,6 +30,7 @@ export enum DataTypeCategory { } export enum DataType { + COLOR = "color", PERSONTITLE = "persontitle", MIDDLENAME = "middlename", LASTNAME = "lastname", diff --git a/src/core/generators/Color/Color.tsx b/src/core/generators/Color/Color.tsx new file mode 100644 index 0000000..4ffe74f --- /dev/null +++ b/src/core/generators/Color/Color.tsx @@ -0,0 +1,204 @@ +import React from "react"; +import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; +import {ExportValueType} from "@/constants/enums"; +import {faker} from "@faker-js/faker"; +import {OptionsNumberInput, OptionsSelect, SelectOption} from "@/components/Utils"; +import {FormattedMessage, useIntl} from "@/locale"; + + +export enum ColorGeneratorFormat { + BINARY_COLOR = "BINARY_COLOR", + CSS_COLOR = "CSS_COLOR", + DECIMAL_COLOR = "DECIMAL_COLOR", +} + +export enum ColorGeneratorKind { + HUMAN = "HUMAN", + RGB = "RGB", + HSL = "HSL", +} +export interface ColorGeneratorOptions { + kind: ColorGeneratorKind; + format: ColorGeneratorFormat; + // precision:number; + // min:number; + // max:number; +} + +export const ColorGeneratorDefaultOptions: ColorGeneratorOptions = { + kind: ColorGeneratorKind.HUMAN, + format: ColorGeneratorFormat.CSS_COLOR, + // precision: 0.1, + // min: 0, + // max: 9999, + + +}; + + +export const generate = (options): GenerateResult =>{ + const { format,kind} = options; + const fakerOptions = { format:ColorGeneratorFormat.CSS_COLOR }; + let result: any; + + switch (kind) { + case ColorGeneratorKind.HSL: + result = faker.color.hsl(); + break; + case ColorGeneratorKind.HUMAN: + result = faker.color.human(); + break; + case ColorGeneratorKind.RGB: + result = faker.color.rgb(); + break; + + } + return { + value:result, + stringValue:result.toString(), + type:kind === ColorGeneratorKind.HSL || ColorGeneratorKind.HUMAN || ColorGeneratorKind.RGB ? ExportValueType.STRING : ExportValueType.NULL + } + +} + +export const ColorGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { + const {options, onOptionsChange} = props; + const colorOptions: ColorGeneratorOptions = options; + const intl = useIntl(); + + const handleOptionsChange = (changedFieldName: string, value: any) => { + let newOptions = {...colorOptions, [changedFieldName]: value}; + onOptionsChange(newOptions); + } + + // error validation + // const [errorMessages, setErrorMessages] = React.useState({ + // min: '', + // max: '', + // }); + + // React.useEffect(() => { + // const newErrorMessages = {...errorMessages}; + // // min + // if (isNullOrWhiteSpace(numberOptions.min.toString())) { + // newErrorMessages.min = intl.formatMessage({id: 'dataType.number.min.errorMessage.empty'}) + // } else if (numberOptions.min > numberOptions.max) { + // newErrorMessages.min = intl.formatMessage({id: 'dataType.number.min.errorMessage.greaterThanMax'}) + // } else { + // newErrorMessages.min = ''; + // } + + // // max + // if (isNullOrWhiteSpace(numberOptions.max.toString())) { + // newErrorMessages.max = intl.formatMessage({id: 'dataType.number.max.errorMessage.empty'}) + // } else if (numberOptions.max < numberOptions.min) { + // newErrorMessages.max = intl.formatMessage({id: 'dataType.number.max.errorMessage.lessThanMin'}) + // } else { + // newErrorMessages.max = ''; + // } + + // setErrorMessages(newErrorMessages); + // }, [numberOptions.min, numberOptions.max]); + + return ( + <> + } + selectOptions={kindSelectOptions} + value={colorOptions.kind} + onChange={(v) => handleOptionsChange('kind', v)} + style={{width: '100px'}} + /> + + + {/* {numberOptions.kind === NumberGeneratorKind.FLOAT && } + selectOptions={precisionSelectOptions} + value={numberOptions.precision} + onChange={(v) => handleOptionsChange('precision', v)} + />} */} + + {/*
+ } + value={numberOptions.min} + onChange={(v) => handleOptionsChange('min', v)} + style={{width: '120px'}} + errorMessage={errorMessages.min} + /> + } + value={numberOptions.max} + onChange={(v) => handleOptionsChange('max', v)} + style={{width: '120px'}} + errorMessage={errorMessages.max} + /> +
*/} + + ) +}; +// const kindSelectOptions: SelectOption[] = Object.values(NumberGeneratorKind).map((kind) => ({ +// value: kind, +// label: kind, +// })); + +// export const generate = (options:any):GenerateResult =>{ +// const value = faker.color.rgb(); +// return { +// value:value, +// stringValue:value, +// type:ExportValueType.STRING +// } +// } +// ------------------------------------------------------------------------------------------------------------- +// types +// rgb #ff0000 human 'red' +// export enum ColorGeneratorKind { +// HUMAN = "HUMAN", + +// } + +// export interface ColorGeneratorOptions { +// // TODO: add your own options type here +// } + +// // ------------------------------------------------------------------------------------------------------------- +// // default options +// export const ColorGeneratorDefaultOptions:ColorGeneratorOptions = { +// // TODO: add your own default options here +// } + +// // ------------------------------------------------------------------------------------------------------------- +// // generate method +// export const generate = (options: any): GenerateResult => { +// // TODO: implement your own generate method here + +// return { +// value: 'NOT IMPLEMENTED', +// stringValue: 'NOT IMPLEMENTED', +// type: ExportValueType.STRING +// }; +// } + +// // ------------------------------------------------------------------------------------------------------------- +// // options component +// export const ColorGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { +// const {options, onOptionsChange} = props; + +// const handleOptionsChange = (changedFieldName: string, value: any) => { +// let newOptions = {...options, [changedFieldName]: value}; +// onOptionsChange(newOptions); +// }; + +// // TODO: implement your own options component here +// return ( +//
+// dasdaskjldabsj +//
+// ); +// } + +const kindSelectOptions: SelectOption[] = Object.values(ColorGeneratorKind).map((kind) => ({ + value: kind, + label: kind, +})); \ No newline at end of file diff --git a/src/core/generators/Color/index.ts b/src/core/generators/Color/index.ts new file mode 100644 index 0000000..4a10a14 --- /dev/null +++ b/src/core/generators/Color/index.ts @@ -0,0 +1,13 @@ +import {Generator} from "@/types/generator"; +import {DataType, DataTypeCategory} from "@/constants/enums"; + +import {ColorGeneratorOptionsComponent, ColorGeneratorDefaultOptions, generate} from "@/core/generators/Color/Color"; +export const ColorGenerator: Generator = { + type: DataType.COLOR, + category: DataTypeCategory.BASIC, + generate: generate, + optionsComponent: ColorGeneratorOptionsComponent, + defaultOptions: ColorGeneratorDefaultOptions, + exampleLines: ["red", "#ff0000", "8-32 bits x 3"] +} + \ No newline at end of file diff --git a/src/core/generators/index.ts b/src/core/generators/index.ts index a1b2522..5bfe048 100644 --- a/src/core/generators/index.ts +++ b/src/core/generators/index.ts @@ -1,3 +1,4 @@ +import {ColorGenerator} from "@/core/generators/Color"; import {PersonTitleGenerator} from "@/core/generators/PersonTitle"; import {MiddleNameGenerator} from "@/core/generators/MiddleName"; import {LastNameGenerator} from "@/core/generators/LastName"; @@ -11,6 +12,7 @@ import {CompanyNameGenerator} from "@/core/generators/CompanyName"; import {DataType} from "@/constants/enums"; export const generators = { + [DataType.COLOR]: ColorGenerator, [DataType.PERSONTITLE]: PersonTitleGenerator, [DataType.MIDDLENAME]: MiddleNameGenerator, [DataType.LASTNAME]: LastNameGenerator, diff --git a/src/locale/translations/en.ts b/src/locale/translations/en.ts index 0a181be..304d091 100644 --- a/src/locale/translations/en.ts +++ b/src/locale/translations/en.ts @@ -36,6 +36,11 @@ export const en = { + + // color + "dataType.color": "Color", + + // persontitle "dataType.persontitle": "Person Title", diff --git a/src/locale/translations/jaJP.ts b/src/locale/translations/jaJP.ts index 944b7f9..e884849 100644 --- a/src/locale/translations/jaJP.ts +++ b/src/locale/translations/jaJP.ts @@ -27,6 +27,10 @@ export const jaJP = { + + // color + "dataType.color": "Color", + // persontitle "dataType.persontitle": "PersonTitle", diff --git a/src/locale/translations/zhCN.ts b/src/locale/translations/zhCN.ts index be6d88b..3cd5676 100644 --- a/src/locale/translations/zhCN.ts +++ b/src/locale/translations/zhCN.ts @@ -35,6 +35,10 @@ export const zhCN = { + + // color + "dataType.color": "颜色", + // persontitle "dataType.persontitle": "人物称谓", From c8c8c9ddcc6ed83dd75d5b72634c17c447cfe9e1 Mon Sep 17 00:00:00 2001 From: Hong Weng Date: Fri, 1 Mar 2024 21:50:27 +1300 Subject: [PATCH 44/60] Update Color.tsx --- src/core/generators/Color/Color.tsx | 120 +--------------------------- 1 file changed, 4 insertions(+), 116 deletions(-) diff --git a/src/core/generators/Color/Color.tsx b/src/core/generators/Color/Color.tsx index 4ffe74f..58ff252 100644 --- a/src/core/generators/Color/Color.tsx +++ b/src/core/generators/Color/Color.tsx @@ -20,17 +20,13 @@ export enum ColorGeneratorKind { export interface ColorGeneratorOptions { kind: ColorGeneratorKind; format: ColorGeneratorFormat; - // precision:number; - // min:number; - // max:number; + } export const ColorGeneratorDefaultOptions: ColorGeneratorOptions = { kind: ColorGeneratorKind.HUMAN, format: ColorGeneratorFormat.CSS_COLOR, - // precision: 0.1, - // min: 0, - // max: 9999, + }; @@ -71,34 +67,7 @@ export const ColorGeneratorOptionsComponent: React.FunctionComponent { - // const newErrorMessages = {...errorMessages}; - // // min - // if (isNullOrWhiteSpace(numberOptions.min.toString())) { - // newErrorMessages.min = intl.formatMessage({id: 'dataType.number.min.errorMessage.empty'}) - // } else if (numberOptions.min > numberOptions.max) { - // newErrorMessages.min = intl.formatMessage({id: 'dataType.number.min.errorMessage.greaterThanMax'}) - // } else { - // newErrorMessages.min = ''; - // } - - // // max - // if (isNullOrWhiteSpace(numberOptions.max.toString())) { - // newErrorMessages.max = intl.formatMessage({id: 'dataType.number.max.errorMessage.empty'}) - // } else if (numberOptions.max < numberOptions.min) { - // newErrorMessages.max = intl.formatMessage({id: 'dataType.number.max.errorMessage.lessThanMin'}) - // } else { - // newErrorMessages.max = ''; - // } - - // setErrorMessages(newErrorMessages); - // }, [numberOptions.min, numberOptions.max]); + return ( <> @@ -111,92 +80,11 @@ export const ColorGeneratorOptionsComponent: React.FunctionComponent - {/* {numberOptions.kind === NumberGeneratorKind.FLOAT && } - selectOptions={precisionSelectOptions} - value={numberOptions.precision} - onChange={(v) => handleOptionsChange('precision', v)} - />} */} - - {/*
- } - value={numberOptions.min} - onChange={(v) => handleOptionsChange('min', v)} - style={{width: '120px'}} - errorMessage={errorMessages.min} - /> - } - value={numberOptions.max} - onChange={(v) => handleOptionsChange('max', v)} - style={{width: '120px'}} - errorMessage={errorMessages.max} - /> -
*/} + ) }; -// const kindSelectOptions: SelectOption[] = Object.values(NumberGeneratorKind).map((kind) => ({ -// value: kind, -// label: kind, -// })); -// export const generate = (options:any):GenerateResult =>{ -// const value = faker.color.rgb(); -// return { -// value:value, -// stringValue:value, -// type:ExportValueType.STRING -// } -// } -// ------------------------------------------------------------------------------------------------------------- -// types -// rgb #ff0000 human 'red' -// export enum ColorGeneratorKind { -// HUMAN = "HUMAN", - -// } - -// export interface ColorGeneratorOptions { -// // TODO: add your own options type here -// } - -// // ------------------------------------------------------------------------------------------------------------- -// // default options -// export const ColorGeneratorDefaultOptions:ColorGeneratorOptions = { -// // TODO: add your own default options here -// } - -// // ------------------------------------------------------------------------------------------------------------- -// // generate method -// export const generate = (options: any): GenerateResult => { -// // TODO: implement your own generate method here - -// return { -// value: 'NOT IMPLEMENTED', -// stringValue: 'NOT IMPLEMENTED', -// type: ExportValueType.STRING -// }; -// } - -// // ------------------------------------------------------------------------------------------------------------- -// // options component -// export const ColorGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { -// const {options, onOptionsChange} = props; - -// const handleOptionsChange = (changedFieldName: string, value: any) => { -// let newOptions = {...options, [changedFieldName]: value}; -// onOptionsChange(newOptions); -// }; - -// // TODO: implement your own options component here -// return ( -//
-// dasdaskjldabsj -//
-// ); -// } const kindSelectOptions: SelectOption[] = Object.values(ColorGeneratorKind).map((kind) => ({ value: kind, From c7836f68397d726b9f8890566ad78800e96043b7 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Sat, 2 Mar 2024 01:00:38 +1300 Subject: [PATCH 45/60] feat: schema selector UI --- next.config.js | 1 - src/components/Exporter/src/ExportModal.tsx | 14 +++- src/components/Icons/index.ts | 2 + src/components/Icons/src/IconSlash.tsx | 9 ++ src/components/Icons/src/index.ts | 2 + .../InputPanel/src/InputPanel.module.css | 13 +-- src/components/InputPanel/src/InputPanel.tsx | 10 +-- .../src/components/DataFieldsList.tsx | 2 +- .../src/components/DataFieldsListItem.tsx | 2 + .../src/components/DataTypeOptionsModal.tsx | 2 + .../src/{context.tsx => HomeLayout.tsx} | 0 src/components/Layout/src/components/index.ts | 2 +- src/components/Navbar/index.ts | 2 + .../src}/NavBar.module.css | 0 .../src/components => Navbar/src}/NavBar.tsx | 55 ++++++------ .../src/components/ColorModeSwitchButton.tsx | 0 .../src/components/GithubButton.tsx | 0 .../src/components/LocaleSwitchButton.tsx | 0 .../src/components/LoginButton.tsx | 0 .../src/components/Logo.tsx | 0 .../src/components/UserLogin.module.css | 0 .../src/components/UserLogin.tsx | 0 src/components/Navbar/src/index.ts | 1 + src/components/SchemaSelector/index.ts | 2 + .../src/SchemaSelector.module.scss | 28 +++++++ .../SchemaSelector/src/SchemaSelector.tsx | 44 ++++++++++ src/components/SchemaSelector/src/index.ts | 1 + src/constants/actions.ts | 2 +- src/pages/collections/index.tsx | 13 +++ src/pages/workspace/index.tsx | 83 ++++++++----------- src/pages/workspace/workspace.module.css | 1 - 31 files changed, 186 insertions(+), 105 deletions(-) create mode 100644 src/components/Icons/index.ts create mode 100644 src/components/Icons/src/IconSlash.tsx create mode 100644 src/components/Icons/src/index.ts rename src/components/Layout/src/{context.tsx => HomeLayout.tsx} (100%) create mode 100644 src/components/Navbar/index.ts rename src/components/{Layout/src/components => Navbar/src}/NavBar.module.css (100%) rename src/components/{Layout/src/components => Navbar/src}/NavBar.tsx (69%) rename src/components/{Layout => Navbar}/src/components/ColorModeSwitchButton.tsx (100%) rename src/components/{Layout => Navbar}/src/components/GithubButton.tsx (100%) rename src/components/{Layout => Navbar}/src/components/LocaleSwitchButton.tsx (100%) rename src/components/{Layout => Navbar}/src/components/LoginButton.tsx (100%) rename src/components/{Layout => Navbar}/src/components/Logo.tsx (100%) rename src/components/{Layout => Navbar}/src/components/UserLogin.module.css (100%) rename src/components/{Layout => Navbar}/src/components/UserLogin.tsx (100%) create mode 100644 src/components/Navbar/src/index.ts create mode 100644 src/components/SchemaSelector/index.ts create mode 100644 src/components/SchemaSelector/src/SchemaSelector.module.scss create mode 100644 src/components/SchemaSelector/src/SchemaSelector.tsx create mode 100644 src/components/SchemaSelector/src/index.ts create mode 100644 src/pages/collections/index.tsx diff --git a/next.config.js b/next.config.js index e04ae21..d6b3a28 100644 --- a/next.config.js +++ b/next.config.js @@ -9,7 +9,6 @@ const nextConfig = semi({ i18n: { locales: ['en', 'zh-CN', 'ja-JP'], defaultLocale: 'en', - localeDetection: false, }, transpilePackages: ['@douyinfe/semi-ui', '@douyinfe/semi-icons', '@douyinfe/semi-illustrations'], webpack(config) { diff --git a/src/components/Exporter/src/ExportModal.tsx b/src/components/Exporter/src/ExportModal.tsx index e7045f9..326ec86 100644 --- a/src/components/Exporter/src/ExportModal.tsx +++ b/src/components/Exporter/src/ExportModal.tsx @@ -1,5 +1,5 @@ import React, {useEffect, useState} from 'react'; -import {Button, Modal, Progress, Toast, Typography} from "@douyinfe/semi-ui"; +import {Button, Modal, Progress, Space, Tag, Toast, Typography} from "@douyinfe/semi-ui"; import {useDispatch, useSelector} from "react-redux"; import { selectCurrentNumOfRowsGenerated, @@ -21,13 +21,14 @@ import { selectNumberOfExportRows } from "@/reducers/workspace/workspaceSelectors"; import {ExportPreview} from "@/components/Exporter/src/ExportPreview"; -import {ExportProcessStage} from "@/constants/enums"; +import {ColorMode, ExportProcessStage} from "@/constants/enums"; import {ExportDash} from "@/components/Exporter/src/ExportDash"; import {batchGenerateData} from "@/utils/generatorUtils"; import {GenerateDataBatchCompletedCallbackResponse} from "@/types/generator"; import {IconExpand, IconTickCircle} from "@douyinfe/semi-icons"; import {getFileExtensionByFormat} from "@/utils/formatterUtils"; import {FormattedMessage} from "@/locale"; +import {RootState} from "@/types/system"; export const ExportModal: React.FunctionComponent = () => { const dispatch = useDispatch(); @@ -47,7 +48,7 @@ export const ExportModal: React.FunctionComponent = () => { const sortableIdList = useSelector(selectDataFieldsSortableIdsList); const dataFields = useSelector(selectDataFields); const totalNumOfRowsGenerated = useSelector(selectCurrentNumOfRowsGenerated); - + const colorMode = useSelector((state: RootState) => state.app.colorMode); let percent = totalNumOfRowsGenerated / numOfExportRows; // effects @@ -183,7 +184,12 @@ export const ExportModal: React.FunctionComponent = () => { style={{width: '90%', maxWidth: '460px'}} className={'no-select-area'} visible={modalVisible} - title={} + title={ + + + Beta + + } onCancel={onCloseModal} footer={renderModalFooter()} > diff --git a/src/components/Icons/index.ts b/src/components/Icons/index.ts new file mode 100644 index 0000000..9266de1 --- /dev/null +++ b/src/components/Icons/index.ts @@ -0,0 +1,2 @@ +import {IconSlash} from "@/components/Icons/src" +export {IconSlash} \ No newline at end of file diff --git a/src/components/Icons/src/IconSlash.tsx b/src/components/Icons/src/IconSlash.tsx new file mode 100644 index 0000000..205d665 --- /dev/null +++ b/src/components/Icons/src/IconSlash.tsx @@ -0,0 +1,9 @@ +import React from 'react'; + + +export const IconSlash: React.FunctionComponent = () => { + return + + +} + diff --git a/src/components/Icons/src/index.ts b/src/components/Icons/src/index.ts new file mode 100644 index 0000000..49a7a62 --- /dev/null +++ b/src/components/Icons/src/index.ts @@ -0,0 +1,2 @@ +import {IconSlash} from "@/components/Icons/src/IconSlash"; +export {IconSlash} \ No newline at end of file diff --git a/src/components/InputPanel/src/InputPanel.module.css b/src/components/InputPanel/src/InputPanel.module.css index aebf97d..e08b4af 100644 --- a/src/components/InputPanel/src/InputPanel.module.css +++ b/src/components/InputPanel/src/InputPanel.module.css @@ -39,14 +39,7 @@ body[theme-mode="dark"] .background:after { } .inputPanel{ - padding: 0 24px; - height: 100%; + padding: 12px 24px; + height: 95%; position: relative; - width: 100%; -} - -.treeSelect { - margin-top: 12px; - z-index: 3; -} - +} \ No newline at end of file diff --git a/src/components/InputPanel/src/InputPanel.tsx b/src/components/InputPanel/src/InputPanel.tsx index 66b0a04..3f66bee 100644 --- a/src/components/InputPanel/src/InputPanel.tsx +++ b/src/components/InputPanel/src/InputPanel.tsx @@ -3,15 +3,12 @@ import {Toolbar} from "@/components/Toolbar"; import styles from "./InputPanel.module.css"; import {DataFieldsList} from "@/components/InputPanel/src/components"; import {ComponentSize} from "@/constants/enums"; -import {TreeSelect} from '@douyinfe/semi-ui'; import {useSelector} from "react-redux"; import {selectCollections} from "@/reducers/collection/collectionSelectors"; -export type InputPanelProps = { - isMobile: boolean -} +export type InputPanelProps = {} -export const InputPanel: React.FunctionComponent = ({isMobile, ...props}) => { +export const InputPanel: React.FunctionComponent = () => { const containerRef = useRef(null); const [containerHeight, setPanelHeight] = React.useState(800); const [componentSize, setComponentSize] = React.useState(ComponentSize.LARGE); @@ -47,9 +44,6 @@ export const InputPanel: React.FunctionComponent = ({isMobile, return (
- {isMobile && - - }
diff --git a/src/components/InputPanel/src/components/DataFieldsList.tsx b/src/components/InputPanel/src/components/DataFieldsList.tsx index eec76e9..7d1fdce 100644 --- a/src/components/InputPanel/src/components/DataFieldsList.tsx +++ b/src/components/InputPanel/src/components/DataFieldsList.tsx @@ -50,7 +50,7 @@ export const DataFieldsList: React.FunctionComponent = ({.. } return ( -
+
{ numberOfDataFields !== 0 ? diff --git a/src/components/InputPanel/src/components/DataFieldsListItem.tsx b/src/components/InputPanel/src/components/DataFieldsListItem.tsx index b6a9f80..dbe298a 100644 --- a/src/components/InputPanel/src/components/DataFieldsListItem.tsx +++ b/src/components/InputPanel/src/components/DataFieldsListItem.tsx @@ -78,6 +78,8 @@ export const DataFieldsListItem: React.FunctionComponent} errorMessage={errorMessages.emptyRate} + min={0} + max={100} />) }; diff --git a/src/components/InputPanel/src/components/DataTypeOptionsModal.tsx b/src/components/InputPanel/src/components/DataTypeOptionsModal.tsx index 48895f9..71dac3b 100644 --- a/src/components/InputPanel/src/components/DataTypeOptionsModal.tsx +++ b/src/components/InputPanel/src/components/DataTypeOptionsModal.tsx @@ -91,6 +91,8 @@ export const DataTypeOptionsModal: React.FunctionComponent} errorMessage={emptyRateError} + min={0} + max={100} />} {renderDataTypeOptions()}
diff --git a/src/components/Layout/src/context.tsx b/src/components/Layout/src/HomeLayout.tsx similarity index 100% rename from src/components/Layout/src/context.tsx rename to src/components/Layout/src/HomeLayout.tsx diff --git a/src/components/Layout/src/components/index.ts b/src/components/Layout/src/components/index.ts index fc5a9be..6828d4d 100644 --- a/src/components/Layout/src/components/index.ts +++ b/src/components/Layout/src/components/index.ts @@ -1,3 +1,3 @@ export * from './Content' export * from './Footer' -export * from './NavBar' \ No newline at end of file +export * from '../../../Navbar/src/NavBar' \ No newline at end of file diff --git a/src/components/Navbar/index.ts b/src/components/Navbar/index.ts new file mode 100644 index 0000000..c4cd5c4 --- /dev/null +++ b/src/components/Navbar/index.ts @@ -0,0 +1,2 @@ +import {NavBar} from "./src"; +export {NavBar} \ No newline at end of file diff --git a/src/components/Layout/src/components/NavBar.module.css b/src/components/Navbar/src/NavBar.module.css similarity index 100% rename from src/components/Layout/src/components/NavBar.module.css rename to src/components/Navbar/src/NavBar.module.css diff --git a/src/components/Layout/src/components/NavBar.tsx b/src/components/Navbar/src/NavBar.tsx similarity index 69% rename from src/components/Layout/src/components/NavBar.tsx rename to src/components/Navbar/src/NavBar.tsx index ccde009..a975a8a 100644 --- a/src/components/Layout/src/components/NavBar.tsx +++ b/src/components/Navbar/src/NavBar.tsx @@ -1,19 +1,19 @@ -import {Button, Nav} from "@douyinfe/semi-ui"; +import {Nav} from "@douyinfe/semi-ui"; import React, {FunctionComponent, useState} from "react"; import styles from './NavBar.module.css'; -import {ColorModeSwitchButton} from "@/components/Layout/src/components/ColorModeSwitchButton"; +import {ColorModeSwitchButton} from "@/components/Navbar/src/components/ColorModeSwitchButton"; import {ColorMode} from "@/constants/enums"; import {useSelector} from "react-redux"; import {RootState} from "@/types/system"; -import {LocaleSwitchButton} from "@/components/Layout/src/components/LocaleSwitchButton"; -import {navBarRoutes} from "@/routes"; +import {LocaleSwitchButton} from "@/components/Navbar/src/components/LocaleSwitchButton"; import {useIntl} from "@/locale"; import {useRouter} from "next/router"; -import {GithubButton} from "@/components/Layout/src/components/GithubButton"; +import {GithubButton} from "@/components/Navbar/src/components/GithubButton"; import Hamburger from 'hamburger-react' -import {Logo} from "@/components/Layout/src/components/Logo"; -import { LoginButton } from "./LoginButton"; -import { User, UserLogin } from "./UserLogin"; +import {Logo} from "@/components/Navbar/src/components/Logo"; +import {LoginButton} from "./components/LoginButton"; +import {User, UserLogin} from "./components/UserLogin"; +import {SchemaSelector} from "@/components/SchemaSelector"; export type NavBarProps = {} @@ -55,7 +55,7 @@ export const NavBar: FunctionComponent = () => { setIsLoggedIn(false); } - const user : User = { + const user: User = { id: "ID123", name: "John" } @@ -69,12 +69,6 @@ export const NavBar: FunctionComponent = () => { onSelect={(key) => onSelectItem(key)}> - { - isLoggedIn - ? - : - } -
= () => { color={colorMode === ColorMode.DARK ? 'white' : "black"} size={22} duration={0.6}/>
+ + + - { - navBarRoutes.map((route, index) => { - return ( - - ) - }) - } + + {/*{*/} + {/* navBarRoutes.map((route, index) => {*/} + {/* return (*/} + {/* */} + {/* )*/} + {/* })*/} + {/*}*/} + @@ -103,7 +102,7 @@ export const NavBar: FunctionComponent = () => { { isLoggedIn - ? + ? : } diff --git a/src/components/Layout/src/components/ColorModeSwitchButton.tsx b/src/components/Navbar/src/components/ColorModeSwitchButton.tsx similarity index 100% rename from src/components/Layout/src/components/ColorModeSwitchButton.tsx rename to src/components/Navbar/src/components/ColorModeSwitchButton.tsx diff --git a/src/components/Layout/src/components/GithubButton.tsx b/src/components/Navbar/src/components/GithubButton.tsx similarity index 100% rename from src/components/Layout/src/components/GithubButton.tsx rename to src/components/Navbar/src/components/GithubButton.tsx diff --git a/src/components/Layout/src/components/LocaleSwitchButton.tsx b/src/components/Navbar/src/components/LocaleSwitchButton.tsx similarity index 100% rename from src/components/Layout/src/components/LocaleSwitchButton.tsx rename to src/components/Navbar/src/components/LocaleSwitchButton.tsx diff --git a/src/components/Layout/src/components/LoginButton.tsx b/src/components/Navbar/src/components/LoginButton.tsx similarity index 100% rename from src/components/Layout/src/components/LoginButton.tsx rename to src/components/Navbar/src/components/LoginButton.tsx diff --git a/src/components/Layout/src/components/Logo.tsx b/src/components/Navbar/src/components/Logo.tsx similarity index 100% rename from src/components/Layout/src/components/Logo.tsx rename to src/components/Navbar/src/components/Logo.tsx diff --git a/src/components/Layout/src/components/UserLogin.module.css b/src/components/Navbar/src/components/UserLogin.module.css similarity index 100% rename from src/components/Layout/src/components/UserLogin.module.css rename to src/components/Navbar/src/components/UserLogin.module.css diff --git a/src/components/Layout/src/components/UserLogin.tsx b/src/components/Navbar/src/components/UserLogin.tsx similarity index 100% rename from src/components/Layout/src/components/UserLogin.tsx rename to src/components/Navbar/src/components/UserLogin.tsx diff --git a/src/components/Navbar/src/index.ts b/src/components/Navbar/src/index.ts new file mode 100644 index 0000000..1207df7 --- /dev/null +++ b/src/components/Navbar/src/index.ts @@ -0,0 +1 @@ +export * from './NavBar' \ No newline at end of file diff --git a/src/components/SchemaSelector/index.ts b/src/components/SchemaSelector/index.ts new file mode 100644 index 0000000..dc37373 --- /dev/null +++ b/src/components/SchemaSelector/index.ts @@ -0,0 +1,2 @@ +import {SchemaSelector} from "@/components/SchemaSelector/src"; +export {SchemaSelector} \ No newline at end of file diff --git a/src/components/SchemaSelector/src/SchemaSelector.module.scss b/src/components/SchemaSelector/src/SchemaSelector.module.scss new file mode 100644 index 0000000..aca5bf8 --- /dev/null +++ b/src/components/SchemaSelector/src/SchemaSelector.module.scss @@ -0,0 +1,28 @@ +.schemaSelector{ + display: flex; + height: 40px; + align-items: center; +} + +.schemaSelectorTag{ + display: flex; + align-items: center; + justify-content: center; + font-weight: 500; +} +.schemaSelectorTagIcon{ + display: flex; + align-items: center; + justify-content: center; + width: 25px; + height: 25px; + margin-right: 5px; + border-radius: 20%; + background-color: lightslategray; +} + +.schemaSelectorButton{ + width: 25px; + height: 25px; + margin-left: 6px; +} \ No newline at end of file diff --git a/src/components/SchemaSelector/src/SchemaSelector.tsx b/src/components/SchemaSelector/src/SchemaSelector.tsx new file mode 100644 index 0000000..d58aef6 --- /dev/null +++ b/src/components/SchemaSelector/src/SchemaSelector.tsx @@ -0,0 +1,44 @@ +import React from "react"; +import {Button, Icon, Tag, Typography} from "@douyinfe/semi-ui"; +import {IconSlash} from "@/components/Icons"; +import styles from './SchemaSelector.module.scss' +import {ColorMode} from "@/constants/enums"; +import {useSelector} from "react-redux"; +import {RootState} from "@/types/system"; +import {IconChevronUpDown} from "@douyinfe/semi-icons"; +import {Emoji, EmojiStyle} from 'emoji-picker-react'; +import {convertToUnifiedCode} from "@/utils/collectionUtils"; + + +export interface SchemaSelectorProps { +} + +export const SchemaSelector: React.FunctionComponent = () => { + + // store + const colorMode = useSelector((state: RootState) => state.app.colorMode); + const {Text} = Typography; + + return
+ } size={"extra-large"} style={{color: 'gray'}}/> + +
+
+
+ +
+
+
+ + Untitled Schema + +
+
+ + +
+} diff --git a/src/components/SchemaSelector/src/index.ts b/src/components/SchemaSelector/src/index.ts new file mode 100644 index 0000000..448f67a --- /dev/null +++ b/src/components/SchemaSelector/src/index.ts @@ -0,0 +1 @@ +export * from './SchemaSelector'; \ No newline at end of file diff --git a/src/constants/actions.ts b/src/constants/actions.ts index e79ae02..9b11b8f 100644 --- a/src/constants/actions.ts +++ b/src/constants/actions.ts @@ -37,5 +37,5 @@ export const SET_RAW_VIEW_LINE_WRAP = 'SET_RAW_VIEW_LINE_WRAP'; export const SET_RAW_VIEW_FONT_SIZE = 'SET_RAW_VIEW_FONT_SIZE'; export const SET_PREVIEW_FORMATTED_DATA = 'SET_PREVIEW_FORMATTED_DATA'; -// collections +// index.ts export const ON_DROP_TREE_NODE = 'ON_DROP_TREE_NODE'; \ No newline at end of file diff --git a/src/pages/collections/index.tsx b/src/pages/collections/index.tsx new file mode 100644 index 0000000..1c50248 --- /dev/null +++ b/src/pages/collections/index.tsx @@ -0,0 +1,13 @@ +import React from "react"; +import Head from "next/head"; + +export default function Collections() { + + return ( +
+ + Collections- Duymmi + +
+ ); +} \ No newline at end of file diff --git a/src/pages/workspace/index.tsx b/src/pages/workspace/index.tsx index 48fbf6f..11e5fc1 100644 --- a/src/pages/workspace/index.tsx +++ b/src/pages/workspace/index.tsx @@ -1,17 +1,18 @@ -import React, { useEffect, useState } from "react"; -import { ReflexContainer, ReflexElement, ReflexSplitter } from 'react-reflex'; +import React, {useEffect, useState} from "react"; +import {ReflexContainer, ReflexElement, ReflexSplitter} from 'react-reflex'; import styles from './workspace.module.css'; -import { InputPanel } from "@/components/InputPanel"; -import { PreviewPanel } from "@/components/PreviewPanel"; -import { useDispatch, useSelector } from "react-redux"; -import { ColorMode, PanelsOrientation } from "@/constants/enums"; -import { doGeneratePreviewData, doSetPanelsOrientation } from "@/reducers/workspace/workspaceActions"; +import {InputPanel} from "@/components/InputPanel"; +import {PreviewPanel} from "@/components/PreviewPanel"; +import {useDispatch, useSelector} from "react-redux"; +import {ColorMode, PanelsOrientation} from "@/constants/enums"; +import {doGeneratePreviewData, doSetPanelsOrientation} from "@/reducers/workspace/workspaceActions"; import Head from "next/head"; -import { useIntl } from "@/locale"; -import { FilesPanel } from "@/components/FilesPanel/src"; -import { selectPanelsOrientation, selectPreviewData } from "@/reducers/workspace/workspaceSelectors"; -import { selectColorMode } from "@/reducers/app/appSelectors"; +import {useIntl} from "@/locale"; +import {FilesPanel} from "@/components/FilesPanel/src"; +import {selectPanelsOrientation, selectPreviewData} from "@/reducers/workspace/workspaceSelectors"; +import {selectColorMode} from "@/reducers/app/appSelectors"; import {ExportModal} from "@/components/Exporter"; + const MOBILE_VIEW_MAX_WIDTH = 768; @@ -54,49 +55,31 @@ export default function Workspace() { return ( <> - {intl.formatMessage({ id: "nav.item.workspace" })} - Duymmi + {intl.formatMessage({id: "nav.item.workspace"})} - Duymmi - - {!isMobileView && ( - - - - )} - - {!isMobileView && ( - - )} - - - - - - - - - - - - - + + + + + + + + + + + + ); diff --git a/src/pages/workspace/workspace.module.css b/src/pages/workspace/workspace.module.css index db6f3b7..29d1d24 100644 --- a/src/pages/workspace/workspace.module.css +++ b/src/pages/workspace/workspace.module.css @@ -23,5 +23,4 @@ .leftReflexElement { min-width: 375px; - display: flex; } \ No newline at end of file From c306cf9e2230b3fb0f53cfb7b6cf9463fad976b1 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Sat, 2 Mar 2024 21:52:44 +1300 Subject: [PATCH 46/60] feat: add javascript formatter (#247) --- .../JavaScript/JavaScript.config.tsx | 9 - .../formatters/JavaScript/JavaScript.d.ts | 0 .../JavaScript/JavaScript.format.ts | 3 - src/core/formatters/JavaScript/Javascript.tsx | 186 ++++++++++++++++++ src/core/formatters/JavaScript/index.ts | 5 +- src/locale/translations/en.ts | 11 ++ src/locale/translations/zhCN.ts | 10 + src/reducers/workspace/workspaceReducer.ts | 2 +- src/utils/formatterUtils.ts | 4 + 9 files changed, 215 insertions(+), 15 deletions(-) delete mode 100644 src/core/formatters/JavaScript/JavaScript.config.tsx delete mode 100644 src/core/formatters/JavaScript/JavaScript.d.ts delete mode 100644 src/core/formatters/JavaScript/JavaScript.format.ts create mode 100644 src/core/formatters/JavaScript/Javascript.tsx diff --git a/src/core/formatters/JavaScript/JavaScript.config.tsx b/src/core/formatters/JavaScript/JavaScript.config.tsx deleted file mode 100644 index eb2248f..0000000 --- a/src/core/formatters/JavaScript/JavaScript.config.tsx +++ /dev/null @@ -1,9 +0,0 @@ -import React from "react"; - -export const JavaScriptConfig:React.FC = () => { - return ( -
-

JavaScript Config

-
- ) -} \ No newline at end of file diff --git a/src/core/formatters/JavaScript/JavaScript.d.ts b/src/core/formatters/JavaScript/JavaScript.d.ts deleted file mode 100644 index e69de29..0000000 diff --git a/src/core/formatters/JavaScript/JavaScript.format.ts b/src/core/formatters/JavaScript/JavaScript.format.ts deleted file mode 100644 index f2bb634..0000000 --- a/src/core/formatters/JavaScript/JavaScript.format.ts +++ /dev/null @@ -1,3 +0,0 @@ -export const format = (data: any): any => { - return data; -} \ No newline at end of file diff --git a/src/core/formatters/JavaScript/Javascript.tsx b/src/core/formatters/JavaScript/Javascript.tsx new file mode 100644 index 0000000..78b7840 --- /dev/null +++ b/src/core/formatters/JavaScript/Javascript.tsx @@ -0,0 +1,186 @@ +import React from "react"; +import {EndOfLineChars, ExportValueType} from "@/constants/enums"; +import {FormatRequest, FormatterConfigComponentInterface} from "@/types/formatter"; +import {FormattedMessage, useIntl} from "@/locale"; +import {OptionsInput, OptionsSelect, SelectOption} from "@/components/Utils"; +import {OptionsSwitch} from "@/components/Utils/src/OptionsSwitch"; +import {isNullOrWhiteSpace} from "@/utils/stringUtils"; + +// ------------------------------------------------------------------------------------------------------------- +// types + +export enum JavascriptFormatterFormat { VARIABLE = "VARIABLE", EXPORT = "EXPORT"} +export enum JavascriptDeclarationKeyword { VAR = "var", CONST = "const", LET = "let" } +export enum JavascriptModuleType { ES6 = "ES6", CommonJS = "CommonJS"} + +export type JavascriptFormatterConfig = { + format:JavascriptFormatterFormat, + variableName?: string, + declarationKeyword: JavascriptDeclarationKeyword, + module:JavascriptModuleType +} + +export const defaultJavascriptFormatterConfig: JavascriptFormatterConfig = { + format: JavascriptFormatterFormat.VARIABLE, + variableName: "data", + declarationKeyword: JavascriptDeclarationKeyword.VAR, + module: JavascriptModuleType.ES6 +} + +// ------------------------------------------------------------------------------------------------------------- +// format method + +export const format = (request: FormatRequest): string => { + const { fields, values, config, sortedFieldIds } = request; + const { format: formatType, variableName, declarationKeyword, module } = config; + + if (values.length === 0) { + return ''; + } + + const jsonData = values.map(item => { + const row: Record = {}; + for (const column of sortedFieldIds) { + const field = fields[column]; + const { isDraft, fieldName } = field; + const itemValue = item[column]; + let { value } = itemValue; + + if (!isDraft && itemValue.type !== ExportValueType.NULL && value !== null) { + if (typeof value === 'bigint') { + value = value.toString(); + } + row[fieldName] = value; + } + } + return row; + }); + + let output = JSON.stringify(jsonData, null, 3); + + return formatOutput(formatType, module, declarationKeyword, variableName, output); +}; + +function formatOutput(formatType, module, declarationKeyword, variableName, output) { + switch (formatType) { + case JavascriptFormatterFormat.VARIABLE: + return formatVariableOutput(declarationKeyword, variableName, output); + case JavascriptFormatterFormat.EXPORT: + return formatExportOutput(module, output); + default: + return output; + } +} + +function formatVariableOutput(declarationKeyword, variableName, output) { + if (isNullOrWhiteSpace(variableName)) { + return ''; + } + return `${declarationKeyword} ${variableName} = ${output};`; +} + +function formatExportOutput(module, output) { + switch (module) { + case JavascriptModuleType.ES6: + return `export default ${output};`; + case JavascriptModuleType.CommonJS: + return `module.exports = ${output};`; + default: + return output; + } +} + +// ------------------------------------------------------------------------------------------------------------- +// config component + +export const JavascriptConfigComponent: React.FC = ({...props}) => { + const {onConfigChange, config} = props; + const jsConfig: JavascriptFormatterConfig = config; + const intl = useIntl(); + + // action + const handleValueChange = (field: string, value: any) => { + onConfigChange({...jsConfig, [field]: value}) + } + + // error validation + const [errorMessages, setErrorMessages] = React.useState({delimiter: ''}); + React.useEffect(() => { + const newErrorMessages = {...errorMessages}; + if (isNullOrWhiteSpace(jsConfig.variableName) && jsConfig.format === JavascriptFormatterFormat.VARIABLE) { + newErrorMessages.delimiter = intl.formatMessage({id: 'export.configurator.javascript.varName.required'}); + } else { + newErrorMessages.delimiter = ''; + } + setErrorMessages(newErrorMessages); + }, [jsConfig.format, jsConfig.variableName]); + + return ( +
+ } + selectOptions={formatOptions} + value={jsConfig.format} + onChange={(value) => { + handleValueChange('format', value) + }} + style={{width: '120px'}} + /> + + { + jsConfig.format === JavascriptFormatterFormat.VARIABLE && + <> + } + value={jsConfig.variableName} + onChange={(value) => { + handleValueChange('variableName', value) + }} + style={{width: '150px'}} + errorMessage={errorMessages.delimiter} + /> + } + selectOptions={keywordsOptions} + value={jsConfig.declarationKeyword} + onChange={(value) => { + handleValueChange('declarationKeyword', value) + }} + style={{width: '120px'}} + /> + + } + + { + jsConfig.format === JavascriptFormatterFormat.EXPORT && + } + selectOptions={moduleOptions} + value={jsConfig.module} + onChange={(value) => { + handleValueChange('module', value) + }} + style={{width: '150px'}} + /> + } + +
+ ) +} + +const formatOptions: SelectOption[] = [ + {label: , value: JavascriptFormatterFormat.VARIABLE}, + {label: , value: JavascriptFormatterFormat.EXPORT} +] + +const keywordsOptions: SelectOption[] = [ + {label: "var", value: JavascriptDeclarationKeyword.VAR}, + {label: "const", value: JavascriptDeclarationKeyword.CONST}, + {label: "let", value: JavascriptDeclarationKeyword.LET} +] + +const moduleOptions: SelectOption[] = [ + {label: "ES6", value: JavascriptModuleType.ES6}, + {label: "CommonJS", value: JavascriptModuleType.CommonJS}, +] + diff --git a/src/core/formatters/JavaScript/index.ts b/src/core/formatters/JavaScript/index.ts index 8a37875..b8d6601 100644 --- a/src/core/formatters/JavaScript/index.ts +++ b/src/core/formatters/JavaScript/index.ts @@ -1,11 +1,12 @@ import {Formatter} from "@/types/formatter"; import {ExportFormat, ExportFormatCategory} from "@/constants/enums"; -import {format} from "@/core/formatters/JavaScript/JavaScript.format"; -import {JavaScriptConfig} from "@/core/formatters/JavaScript/JavaScript.config"; +import {JavascriptConfigComponent, format, defaultJavascriptFormatterConfig} from "@/core/formatters/JavaScript/Javascript"; export const JavaScriptFormatter: Formatter = { type: ExportFormat.JAVA_SCRIPT, category: ExportFormatCategory.PROGRAMMING_LANGUAGES, format: format, fileExtension: 'js', + configComponent: JavascriptConfigComponent, + defaultConfig: defaultJavascriptFormatterConfig } \ No newline at end of file diff --git a/src/locale/translations/en.ts b/src/locale/translations/en.ts index 8d40630..e188b9f 100644 --- a/src/locale/translations/en.ts +++ b/src/locale/translations/en.ts @@ -34,9 +34,11 @@ export const en = { // csv "export.configurator.csv.delimiter": "Delimiter", + "export.configurator.csv.delimiter.required" : "Delimiter cannot be empty", "export.configurator.csv.includeHeader": "Include header", "export.configurator.csv.endLineChar": "End of line characters", + // xml "export.configurator.xml.rootNodeName": "Root node", "export.configurator.xml.childNodeName": "Child node", @@ -47,6 +49,15 @@ export const en = { "export.configurator.json.insideArray": "Inside array", "export.configurator.json.includeNullValues": "Include null values", + // javascript + "export.configurator.javascript.format": "Format", + "export.configurator.javascript.format.variable": "Variable", + "export.configurator.javascript.format.export": "Export", + "export.configurator.javascript.varName": "Variable Name", + "export.configurator.javascript.varName.required": "Variable name cannot be empty", + "export.configurator.javascript.declarationKeyword": "Declaration Keyword", + "export.configurator.javascript.module": "Module", + // ------------------------------------------------------------------------------------------------------------- // data types diff --git a/src/locale/translations/zhCN.ts b/src/locale/translations/zhCN.ts index 11423aa..05f0633 100644 --- a/src/locale/translations/zhCN.ts +++ b/src/locale/translations/zhCN.ts @@ -33,6 +33,7 @@ export const zhCN = { // csv "export.configurator.csv.delimiter": "分隔符", + "export.configurator.csv.delimiter.required" : "分隔符不可为空", "export.configurator.csv.includeHeader": "包含表头", "export.configurator.csv.endLineChar": "行结束符", @@ -46,6 +47,15 @@ export const zhCN = { "export.configurator.json.insideArray": "数组", "export.configurator.json.includeNullValues": "包含空值", + // javascript + "export.configurator.javascript.format": "格式", + "export.configurator.javascript.format.variable": "变量", + "export.configurator.javascript.format.export": "导出", + "export.configurator.javascript.varName": "变量名", + "export.configurator.javascript.varName.required": "变量名不可为空", + "export.configurator.javascript.declarationKeyword": "声明类型", + "export.configurator.javascript.module": "模块", + // ------------------------------------------------------------------------------------------------------------- // data types diff --git a/src/reducers/workspace/workspaceReducer.ts b/src/reducers/workspace/workspaceReducer.ts index 6b38d9e..a1a4319 100644 --- a/src/reducers/workspace/workspaceReducer.ts +++ b/src/reducers/workspace/workspaceReducer.ts @@ -153,7 +153,7 @@ const workspaceReducer = (state: WorkspaceReducerState = initStates, action: Act case GENERATE_PREVIEW_DATA: return { ...state, - previewData: generateData(state.dataFields, state.dataFieldsSortableIdsList, 20) + previewData: generateData(state.dataFields, state.dataFieldsSortableIdsList, 80) }; case GENERATE_SPECIFIC_FIELD_PREVIEW_DATA: return { diff --git a/src/utils/formatterUtils.ts b/src/utils/formatterUtils.ts index d5881c8..8d5ddc0 100644 --- a/src/utils/formatterUtils.ts +++ b/src/utils/formatterUtils.ts @@ -49,6 +49,10 @@ export const getCodemirrorLanguagePluginByFormat = (format: ExportFormat): any = case ExportFormat.XML: return langs.xml(); case ExportFormat.CSV: + return langs.spreadsheet(); + case ExportFormat.JAVA_SCRIPT: + return langs.javascript(); + default: return langs.mathematica(); } } \ No newline at end of file From 953f035938493e9685e0a9c6dc2c6b9a35bc859b Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Sat, 2 Mar 2024 23:11:53 +1300 Subject: [PATCH 47/60] chore: scripts for add new formatter --- package.json | 3 +- public/images/exportFormats/dark/sql.svg | 32 +++++ scripts/addNewFormatter.ts | 163 +++++++++++++++++++++++ scripts/addNewGenerator.ts | 2 +- src/constants/enums.ts | 1 + src/core/formatters/Json/Json.tsx | 1 - src/locale/translations/en.ts | 1 + src/locale/translations/jaJP.ts | 1 + src/locale/translations/zhCN.ts | 1 + src/utils/formatterUtils.ts | 2 + 10 files changed, 204 insertions(+), 3 deletions(-) create mode 100644 public/images/exportFormats/dark/sql.svg create mode 100644 scripts/addNewFormatter.ts diff --git a/package.json b/package.json index e26664a..b3216cf 100644 --- a/package.json +++ b/package.json @@ -8,7 +8,8 @@ "start": "next start", "lint": "next lint", "cypress": "cypress open", - "add:generator": "tsx ./scripts/addNewGenerator.ts" + "add:generator": "tsx ./scripts/addNewGenerator.ts", + "add:formatter": "tsx ./scripts/addNewFormatter.ts" }, "dependencies": { "@douyinfe/semi-ui": "^2.51.0", diff --git a/public/images/exportFormats/dark/sql.svg b/public/images/exportFormats/dark/sql.svg new file mode 100644 index 0000000..dfab250 --- /dev/null +++ b/public/images/exportFormats/dark/sql.svg @@ -0,0 +1,32 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/scripts/addNewFormatter.ts b/scripts/addNewFormatter.ts new file mode 100644 index 0000000..e236665 --- /dev/null +++ b/scripts/addNewFormatter.ts @@ -0,0 +1,163 @@ +import * as fs from 'fs'; +import * as readline from 'readline'; +import {ExportFormatCategory} from "@/constants/enums"; +import {enumUtils} from "./utils/enumUtils"; +import {addLinesToLocal} from "./utils/localValuesUtils"; + +const rl = readline.createInterface({ + input: process.stdin, + output: process.stdout +}); + +const categories = Object.values(ExportFormatCategory); + +const createFormatter = (formatterName: string, fileExtension: string) => { + rl.question('➡️ Please select the category for the formatter（enter the corresponding digit）：\n' + + categories.map((option, index) => `${index + 1}. ${option}`).join('\n') + + '\n', (answer) => { + + const selectedIndex = parseInt(answer) - 1; + if (isNaN(selectedIndex) || selectedIndex < 0 || selectedIndex >= categories.length) { + console.log('❌Invalid option, please try again.'); + createFormatter(formatterName, fileExtension); + return; + } else { + const path = `./src/core/formatters/${formatterName}`; + + // add DataType enum option + enumUtils('./src/constants/enums.ts', 'ExportFormat', formatterName.toUpperCase(), formatterName.toLowerCase()); + + // create directory + fs.mkdirSync(path, {recursive: true}); + + // create index.ts + fs.writeFileSync(`${path}/index.ts`, writeFormatterIndexFile(formatterName, categories[selectedIndex], fileExtension), 'utf8'); + + // create GENERATOR_NAME.tsx + const fileName = `${formatterName}.tsx`; + fs.writeFileSync(`${path}/${fileName}`, writeFormatterTsxFile(formatterName), 'utf8'); + + // add generator + addFormatterToIndex(formatterName); + + // add generator name to locale + addLinesToLocal(/\/\/\s+data\s+types\s*/, + [`// ${formatterName.toLowerCase()}`, + `"dataType.${formatterName.toLowerCase()}": "${formatterName}",`] + ); + + console.log(`✨ Successfully created formatter ${formatterName}!\n See ${path} for details.`); + rl.close(); + } + }); +} + +rl.question('💥 Please enter the name of the new formatter: ', (generatorName: string) => { + const folderPath = `./src/core/generators`; + generatorName = formatFolderName(generatorName); + if (checkIfFormatExists(generatorName)) { + rl.close(); + return; + } + + rl.question('➡️ Please enter the file extension for the formatter: ',(fileExtension: string) => { + createFormatter(generatorName, fileExtension); + }); +}); + +// utils +const checkIfFormatExists = (formatterName: string): boolean => { + const targetPath = `./src/core/formatters/${formatterName}`; + if (fs.existsSync(targetPath)) { + console.log('❌ The formatter already exists, please try again.'); + return true; + } + return false; +}; + +const formatFolderName = (folderName: string): string => { + const firstLetter = folderName.charAt(0).toUpperCase(); + const restLetters = folderName.slice(1); + return `${firstLetter}${restLetters}`; +}; + +const addFormatterToIndex = (formatterName: string) => { + const formattersIndexFilePath = './src/core/formatters/index.ts'; + const fileContent = fs.readFileSync(formattersIndexFilePath, 'utf8'); + const contentAfterImport = `${`import {${formatterName}Formatter} from "@/core/formatters/${formatterName}";`}\n${fileContent}`; + const generatorLine = ` [ExportFormat.${formatterName.toUpperCase()}]: ${formatterName}Formatter,`; + const updatedContent = contentAfterImport.replace(/export\s+const\s+formatters\s*=\s*{/, `export const formatters = {\n${generatorLine}`); + fs.writeFileSync(formattersIndexFilePath, updatedContent, 'utf8'); + +} + +const writeFormatterTsxFile = (formatterName: string) => { + return `import React from "react"; +import {FormatRequest, FormatterConfigComponentInterface} from "@/types/formatter"; +import {ExportValueType} from "@/constants/enums"; + + +// ------------------------------------------------------------------------------------------------------------- +// types + +export type ${formatterName}FormatterConfig = { + // TODO: add your own config types here +} + +// ------------------------------------------------------------------------------------------------------------- +// default options + +export const default${formatterName}FormatterConfig: ${formatterName}FormatterConfig = { + + // TODO: add your own default configs here +} + +// ------------------------------------------------------------------------------------------------------------- +// format method + +export const format = (request: FormatRequest): string => { + + const { fields, values, sortedFieldIds, config } = request; + + // TODO: implement your own format method here + + return "NOT IMPLEMENTED" +} + +// ------------------------------------------------------------------------------------------------------------- +// config component + +export const ${formatterName}ConfigComponent: React.FC = ({...props}) => { + const {config, onConfigChange} = props; + + // action + const handleValueChange = (field: string, value: any) => { + onConfigChange({...config, [field]: value}) + } + + // TODO: implement your own configs component here + return ( +
+ NOT IMPLEMENTED +
+ ); +} +`; +} + +const writeFormatterIndexFile = (formatterName: string, category: string, fileExtension: string) => { + return `import {Formatter} from "@/types/formatter"; +import {ExportFormat, ExportFormatCategory} from "@/constants/enums"; +import {${formatterName}ConfigComponent, format, default${formatterName}FormatterConfig} from "./${formatterName}"; + + +export const ${formatterName}Formatter: Formatter = { + type: ExportFormat.${formatterName.toUpperCase()}, + category: ExportFormatCategory.${category.toUpperCase()}, + format: format, + fileExtension: '${fileExtension}', + configComponent: ${formatterName}ConfigComponent, + defaultConfig: default${formatterName}FormatterConfig, +}`; + +} \ No newline at end of file diff --git a/scripts/addNewGenerator.ts b/scripts/addNewGenerator.ts index 547412c..bc14639 100644 --- a/scripts/addNewGenerator.ts +++ b/scripts/addNewGenerator.ts @@ -96,7 +96,7 @@ import {ExportValueType} from "@/constants/enums"; // ------------------------------------------------------------------------------------------------------------- // types export interface ${generatorName}GeneratorOptions { - // TODO: add your own options type here + // TODO: add your own option types here } // ------------------------------------------------------------------------------------------------------------- diff --git a/src/constants/enums.ts b/src/constants/enums.ts index 433619a..5aee073 100644 --- a/src/constants/enums.ts +++ b/src/constants/enums.ts @@ -2,6 +2,7 @@ // export format export enum ExportFormatCategory { FILE_TYPES = "fileTypes", + DATABASE = "database", PROGRAMMING_LANGUAGES = "programmingLanguages", } diff --git a/src/core/formatters/Json/Json.tsx b/src/core/formatters/Json/Json.tsx index f6d1fa3..f715690 100644 --- a/src/core/formatters/Json/Json.tsx +++ b/src/core/formatters/Json/Json.tsx @@ -1,6 +1,5 @@ import React from "react"; import {FormatRequest, FormatterConfigComponentInterface} from "@/types/formatter"; -import {CsvConfigComponent} from "@/core/formatters/Csv/Csv"; import {OptionsSwitch} from "@/components/Utils/src/OptionsSwitch"; import {FormattedMessage} from "@/locale"; import {ExportValueType} from "@/constants/enums"; diff --git a/src/locale/translations/en.ts b/src/locale/translations/en.ts index e188b9f..1a34aad 100644 --- a/src/locale/translations/en.ts +++ b/src/locale/translations/en.ts @@ -5,6 +5,7 @@ export const en = { // export category "export.category.fileTypes": "General file types", + "export.category.databases" : "Databases", "export.category.programmingLanguages": "Programming languages", // export format modal diff --git a/src/locale/translations/jaJP.ts b/src/locale/translations/jaJP.ts index 222dbd8..2033e3c 100644 --- a/src/locale/translations/jaJP.ts +++ b/src/locale/translations/jaJP.ts @@ -6,6 +6,7 @@ export const jaJP = { // export category "export.category.fileTypes": "一般的なファイルタイプ", + "export.category.databases" : "Databases", "export.category.programmingLanguages": "プログラミング言語", // export format modal diff --git a/src/locale/translations/zhCN.ts b/src/locale/translations/zhCN.ts index 05f0633..7ffca1c 100644 --- a/src/locale/translations/zhCN.ts +++ b/src/locale/translations/zhCN.ts @@ -4,6 +4,7 @@ export const zhCN = { // export category "export.category.fileTypes": "常见格式", + "export.category.databases" : "数据库", "export.category.programmingLanguages": "编程语言", // export format modal diff --git a/src/utils/formatterUtils.ts b/src/utils/formatterUtils.ts index 8d5ddc0..1ad7a88 100644 --- a/src/utils/formatterUtils.ts +++ b/src/utils/formatterUtils.ts @@ -23,6 +23,8 @@ export const getFormattersGroupedByCategory = (): {} => { categorizedFormatters[category] = [formatter]; } } + + return categorizedFormatters; } From 97d8c2c1eb0da8ddc3dc2a13379e984f2f973aeb Mon Sep 17 00:00:00 2001 From: Hong Weng Date: Mon, 4 Mar 2024 16:28:34 +1300 Subject: [PATCH 48/60] feat: update color generator add formats to kind of RGB --- src/constants/enums.ts | 5 +- src/core/generators/Color/Color.tsx | 117 ++++++++++++++++++++-------- 2 files changed, 88 insertions(+), 34 deletions(-) diff --git a/src/constants/enums.ts b/src/constants/enums.ts index 28112ec..e63f9f9 100644 --- a/src/constants/enums.ts +++ b/src/constants/enums.ts @@ -17,7 +17,10 @@ export enum ExportValueType { NUMBER = "number", BOOLEAN = "boolean", DATE_TIME = "dateTime", - NULL = "null" + NULL = "null", + CSS = "css", + BINARY = "binary", + HEX = "hex", } // data types diff --git a/src/core/generators/Color/Color.tsx b/src/core/generators/Color/Color.tsx index 58ff252..bbd2653 100644 --- a/src/core/generators/Color/Color.tsx +++ b/src/core/generators/Color/Color.tsx @@ -1,15 +1,17 @@ import React from "react"; -import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; -import {ExportValueType} from "@/constants/enums"; -import {faker} from "@faker-js/faker"; -import {OptionsNumberInput, OptionsSelect, SelectOption} from "@/components/Utils"; -import {FormattedMessage, useIntl} from "@/locale"; +import { GenerateResult, GeneratorOptionsComponentInterface } from "@/types/generator"; +import { ExportValueType } from "@/constants/enums"; +import { CssFunctionType, faker } from "@faker-js/faker"; +import { Tag } from "@douyinfe/semi-ui"; +import { OptionsNumberInput, OptionsSelect, SelectOption } from "@/components/Utils"; +import { FormattedMessage} from "@/locale"; +import style from '../Boolean/Boolean.module.scss'; export enum ColorGeneratorFormat { - BINARY_COLOR = "BINARY_COLOR", - CSS_COLOR = "CSS_COLOR", - DECIMAL_COLOR = "DECIMAL_COLOR", + BINARY = "BINARY", + CSS = "CSS", + DECIMAL = "DECIMAL", } export enum ColorGeneratorKind { @@ -20,23 +22,38 @@ export enum ColorGeneratorKind { export interface ColorGeneratorOptions { kind: ColorGeneratorKind; format: ColorGeneratorFormat; - + casing?: 'lower' | 'mixed' | 'upper'; + includeAlpha?: boolean; + prefix?: string; + + } export const ColorGeneratorDefaultOptions: ColorGeneratorOptions = { kind: ColorGeneratorKind.HUMAN, - format: ColorGeneratorFormat.CSS_COLOR, - - - + format: ColorGeneratorFormat.CSS, + }; +const toBinary = (value: number): string => value.toString(2).padStart(8, '0'); + +export const generate = (options): GenerateResult => { + const { format, kind, casing, includeAlpha, prefix } = options; + -export const generate = (options): GenerateResult =>{ - const { format,kind} = options; - const fakerOptions = { format:ColorGeneratorFormat.CSS_COLOR }; let result: any; - + let stringValue: string; + const fakerOptions: { + casing?: 'lower' | 'mixed' | 'upper'; + includeAlpha?: boolean; + prefix?: string; + format?: 'css' | 'decimal' | 'hex'; + } = { + casing: casing, + includeAlpha: includeAlpha, + prefix: prefix, + }; + switch (kind) { case ColorGeneratorKind.HSL: result = faker.color.hsl(); @@ -45,42 +62,60 @@ export const generate = (options): GenerateResult =>{ result = faker.color.human(); break; case ColorGeneratorKind.RGB: - result = faker.color.rgb(); + if (format === ColorGeneratorFormat.BINARY) { + // Handle binary format conversion separately since Faker doesn't support it directly + const decimalColor = faker.color.rgb({ format: 'decimal' }); + result = decimalColor.map(toBinary).join(' '); + } else { + fakerOptions.format = format === ColorGeneratorFormat.CSS ? 'css' : + format === ColorGeneratorFormat.DECIMAL ? 'decimal' : 'hex'; + + result = faker.color.rgb(fakerOptions); + } break; - } + + stringValue = Array.isArray(result) ? result.join(', ') : result; + return { - value:result, - stringValue:result.toString(), - type:kind === ColorGeneratorKind.HSL || ColorGeneratorKind.HUMAN || ColorGeneratorKind.RGB ? ExportValueType.STRING : ExportValueType.NULL - } + value: result, + stringValue: stringValue, + type: ExportValueType.STRING + }; + } -export const ColorGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { - const {options, onOptionsChange} = props; + + +export const ColorGeneratorOptionsComponent: React.FunctionComponent = ({ ...props }) => { + const { options, onOptionsChange } = props; const colorOptions: ColorGeneratorOptions = options; - const intl = useIntl(); + + const handleOptionsChange = (changedFieldName: string, value: any) => { - let newOptions = {...colorOptions, [changedFieldName]: value}; + let newOptions = { ...colorOptions, [changedFieldName]: value }; onOptionsChange(newOptions); } - - return ( <> } + label={} selectOptions={kindSelectOptions} value={colorOptions.kind} onChange={(v) => handleOptionsChange('kind', v)} - style={{width: '100px'}} + style={{ width: '100px' }} /> + {colorOptions.kind === ColorGeneratorKind.RGB && } + selectOptions={formatSelectOptions} + value={colorOptions.format} + onChange={(v) => handleOptionsChange('format', v)} + />} - ) }; @@ -89,4 +124,20 @@ export const ColorGeneratorOptionsComponent: React.FunctionComponent ({ value: kind, label: kind, -})); \ No newline at end of file +})); + +const formatSelectOptions: SelectOption[] = [ + { + value: ColorGeneratorFormat.BINARY, + label: <>binBinary Format + }, + { + value: ColorGeneratorFormat.CSS, + label: <>cssCSS Format + }, + { + value: ColorGeneratorFormat.DECIMAL, + label: <>intInteger Format + } +] + From d8cea7570d343e729e48bf424e239c96dd9492aa Mon Sep 17 00:00:00 2001 From: Hong Weng Date: Mon, 4 Mar 2024 17:04:19 +1300 Subject: [PATCH 49/60] feat: update color generator --- src/core/generators/Color/Color.tsx | 10 +++++----- src/locale/translations/en.ts | 2 +- src/locale/translations/zhCN.ts | 1 + 3 files changed, 7 insertions(+), 6 deletions(-) diff --git a/src/core/generators/Color/Color.tsx b/src/core/generators/Color/Color.tsx index bbd2653..11aa033 100644 --- a/src/core/generators/Color/Color.tsx +++ b/src/core/generators/Color/Color.tsx @@ -15,7 +15,7 @@ export enum ColorGeneratorFormat { } export enum ColorGeneratorKind { - HUMAN = "HUMAN", + HUMAN = "W", RGB = "RGB", HSL = "HSL", } @@ -110,7 +110,7 @@ export const ColorGeneratorOptionsComponent: React.FunctionComponent {colorOptions.kind === ColorGeneratorKind.RGB && } + label={} selectOptions={formatSelectOptions} value={colorOptions.format} onChange={(v) => handleOptionsChange('format', v)} @@ -129,15 +129,15 @@ const kindSelectOptions: SelectOption[] = Object.values(ColorGeneratorKind).map( const formatSelectOptions: SelectOption[] = [ { value: ColorGeneratorFormat.BINARY, - label: <>binBinary Format + label: <>binaryBinary Format }, { value: ColorGeneratorFormat.CSS, - label: <>cssCSS Format + label: <>stringCSS Format }, { value: ColorGeneratorFormat.DECIMAL, - label: <>intInteger Format + label: <>stringInteger Format } ] diff --git a/src/locale/translations/en.ts b/src/locale/translations/en.ts index 304d091..d7a71fb 100644 --- a/src/locale/translations/en.ts +++ b/src/locale/translations/en.ts @@ -39,7 +39,7 @@ export const en = { // color "dataType.color": "Color", - + "dataType.color.format.label": "Format", // persontitle "dataType.persontitle": "Person Title", diff --git a/src/locale/translations/zhCN.ts b/src/locale/translations/zhCN.ts index 3cd5676..3f859fb 100644 --- a/src/locale/translations/zhCN.ts +++ b/src/locale/translations/zhCN.ts @@ -38,6 +38,7 @@ export const zhCN = { // color "dataType.color": "颜色", + "dataType.color.format.label": "格式", // persontitle "dataType.persontitle": "人物称谓", From 4dd374bdce165590a586a09856772949d13ebf8d Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Thu, 7 Mar 2024 11:50:17 +1300 Subject: [PATCH 50/60] feat: sql formatter & refactor value type (#249) --- package.json | 2 +- scripts/addNewFormatter.ts | 17 +- src/components/DevTools/index.ts | 3 + .../DevTools/src/GeneratorDebugger.tsx | 96 ++++++++ src/components/DevTools/src/index.tsx | 1 + .../ExportFormatConfiguratorModal.tsx | 2 +- .../src/components/DataFieldsListItem.tsx | 38 ++- .../src/components/DataTypeOptionsModal.tsx | 11 +- src/components/Utils/src/OptionsRadio.tsx | 49 ++++ src/constants/enums.ts | 19 +- src/core/formatters/Csv/Csv.tsx | 6 +- src/core/formatters/JavaScript/Javascript.tsx | 52 ++-- src/core/formatters/Json/Json.tsx | 9 +- src/core/formatters/Sql/Sql.tsx | 230 ++++++++++++++++++ src/core/formatters/Sql/index.ts | 13 + src/core/formatters/Xml/Xml.tsx | 4 +- src/core/formatters/index.ts | 2 + src/core/generators/Boolean/Boolean.tsx | 53 ++-- src/core/generators/Boolean/index.ts | 7 +- src/core/generators/Color/Color.tsx | 92 ++++--- src/core/generators/Color/index.ts | 5 +- .../generators/CompanyName/CompanyName.tsx | 2 - src/core/generators/CompanyName/index.ts | 3 +- src/core/generators/Email/Email.tsx | 17 +- src/core/generators/Email/index.ts | 3 +- src/core/generators/Emoji/Emoji.tsx | 13 +- src/core/generators/Emoji/index.ts | 3 +- src/core/generators/FirstName/FirstName.tsx | 15 +- src/core/generators/FirstName/index.ts | 3 +- src/core/generators/FullName/FullName.tsx | 30 +-- src/core/generators/FullName/index.ts | 4 +- src/core/generators/LastName/LastName.tsx | 19 +- src/core/generators/LastName/index.ts | 5 +- src/core/generators/MiddleName/MiddleName.tsx | 17 +- src/core/generators/MiddleName/index.ts | 5 +- src/core/generators/Number/Number.tsx | 64 +++-- src/core/generators/Number/index.ts | 9 +- .../generators/PersonTitle/PersonTitle.tsx | 20 +- src/core/generators/PersonTitle/index.ts | 5 +- src/core/generators/Phone/Phone.tsx | 15 +- src/core/generators/Phone/index.ts | 5 +- src/core/generators/Sex/Sex.tsx | 4 - src/core/generators/Sex/index.ts | 5 +- src/locale/translations/en.ts | 20 +- src/locale/translations/jaJP.ts | 2 +- src/locale/translations/zhCN.ts | 6 +- src/reducers/workspace/workspaceActions.ts | 8 +- src/reducers/workspace/workspaceReducer.ts | 3 +- src/types/generator.d.ts | 9 +- src/utils/devUtils.ts | 1 + src/utils/formatterUtils.ts | 2 + src/utils/generatorUtils.ts | 11 +- src/utils/typeUtils.ts | 5 + 53 files changed, 762 insertions(+), 282 deletions(-) create mode 100644 src/components/DevTools/index.ts create mode 100644 src/components/DevTools/src/GeneratorDebugger.tsx create mode 100644 src/components/DevTools/src/index.tsx create mode 100644 src/components/Utils/src/OptionsRadio.tsx create mode 100644 src/core/formatters/Sql/Sql.tsx create mode 100644 src/core/formatters/Sql/index.ts create mode 100644 src/utils/devUtils.ts diff --git a/package.json b/package.json index b3216cf..8ea8bdf 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "dummyi", - "version": "0.1.0", + "version": "0.2.1", "private": true, "scripts": { "dev": "next dev", diff --git a/scripts/addNewFormatter.ts b/scripts/addNewFormatter.ts index e236665..edbe40f 100644 --- a/scripts/addNewFormatter.ts +++ b/scripts/addNewFormatter.ts @@ -24,7 +24,7 @@ const createFormatter = (formatterName: string, fileExtension: string) => { } else { const path = `./src/core/formatters/${formatterName}`; - // add DataType enum option + // add formatter enum option enumUtils('./src/constants/enums.ts', 'ExportFormat', formatterName.toUpperCase(), formatterName.toLowerCase()); // create directory @@ -33,19 +33,13 @@ const createFormatter = (formatterName: string, fileExtension: string) => { // create index.ts fs.writeFileSync(`${path}/index.ts`, writeFormatterIndexFile(formatterName, categories[selectedIndex], fileExtension), 'utf8'); - // create GENERATOR_NAME.tsx + // create FORMATTER_NAME.tsx const fileName = `${formatterName}.tsx`; fs.writeFileSync(`${path}/${fileName}`, writeFormatterTsxFile(formatterName), 'utf8'); - // add generator + // add formatter addFormatterToIndex(formatterName); - // add generator name to locale - addLinesToLocal(/\/\/\s+data\s+types\s*/, - [`// ${formatterName.toLowerCase()}`, - `"dataType.${formatterName.toLowerCase()}": "${formatterName}",`] - ); - console.log(`✨ Successfully created formatter ${formatterName}!\n See ${path} for details.`); rl.close(); } @@ -85,10 +79,9 @@ const addFormatterToIndex = (formatterName: string) => { const formattersIndexFilePath = './src/core/formatters/index.ts'; const fileContent = fs.readFileSync(formattersIndexFilePath, 'utf8'); const contentAfterImport = `${`import {${formatterName}Formatter} from "@/core/formatters/${formatterName}";`}\n${fileContent}`; - const generatorLine = ` [ExportFormat.${formatterName.toUpperCase()}]: ${formatterName}Formatter,`; - const updatedContent = contentAfterImport.replace(/export\s+const\s+formatters\s*=\s*{/, `export const formatters = {\n${generatorLine}`); + const formatterLine = ` [ExportFormat.${formatterName.toUpperCase()}]: ${formatterName}Formatter,`; + const updatedContent = contentAfterImport.replace(/export\s+const\s+formatters\s*=\s*{/, `export const formatters = {\n${formatterLine}`); fs.writeFileSync(formattersIndexFilePath, updatedContent, 'utf8'); - } const writeFormatterTsxFile = (formatterName: string) => { diff --git a/src/components/DevTools/index.ts b/src/components/DevTools/index.ts new file mode 100644 index 0000000..45569a1 --- /dev/null +++ b/src/components/DevTools/index.ts @@ -0,0 +1,3 @@ +import {GeneratorDebugger} from "@/components/DevTools/src"; + +export {GeneratorDebugger} \ No newline at end of file diff --git a/src/components/DevTools/src/GeneratorDebugger.tsx b/src/components/DevTools/src/GeneratorDebugger.tsx new file mode 100644 index 0000000..d7f35cb --- /dev/null +++ b/src/components/DevTools/src/GeneratorDebugger.tsx @@ -0,0 +1,96 @@ +import {DataField} from "@/types/generator"; +import React from "react"; +import {IconTerminal} from "@douyinfe/semi-icons"; +import {Button, Card, Descriptions, Modal, Tag, Typography} from "@douyinfe/semi-ui"; +import CodeMirror from "@uiw/react-codemirror"; +import {EditorView} from "@codemirror/view"; +import {langs} from '@uiw/codemirror-extensions-langs'; +import {darkTheme, lightTheme} from "@/components/PreviewPanel/src/components/RawPreviewer/RawPreviewer.themes"; +import {useSelector} from "react-redux"; +import {selectColorMode} from "@/reducers/app/appSelectors"; +import {ColorMode} from "@/constants/enums"; + +export interface GeneratorDebuggerProps { + id: string; + dataField: DataField; + renderDataTypeOptions: any +} + +export const GeneratorDebugger: React.FunctionComponent = ({...props}) => { + const {id, dataField, renderDataTypeOptions} = props; + const [isModalOpen, setIsModalOpen] = React.useState(false); + const {Text} = Typography; + + // store + const colorMode = useSelector(selectColorMode); + + const handleOpen = () => { + setIsModalOpen(true); + } + + const handleClose = () => { + setIsModalOpen(false); + } + + return ( + <> + + + +
+ + + ) +} \ No newline at end of file diff --git a/src/components/DevTools/src/index.tsx b/src/components/DevTools/src/index.tsx new file mode 100644 index 0000000..23bb28b --- /dev/null +++ b/src/components/DevTools/src/index.tsx @@ -0,0 +1 @@ +export * from './GeneratorDebugger'; \ No newline at end of file diff --git a/src/components/ExportFormatConfigurator/src/components/ExportFormatConfiguratorModal.tsx b/src/components/ExportFormatConfigurator/src/components/ExportFormatConfiguratorModal.tsx index 5002a6b..f418c23 100644 --- a/src/components/ExportFormatConfigurator/src/components/ExportFormatConfiguratorModal.tsx +++ b/src/components/ExportFormatConfigurator/src/components/ExportFormatConfiguratorModal.tsx @@ -45,7 +45,7 @@ export const ExportFormatConfiguratorModal: React.FC diff --git a/src/components/InputPanel/src/components/DataFieldsListItem.tsx b/src/components/InputPanel/src/components/DataFieldsListItem.tsx index dbe298a..6330742 100644 --- a/src/components/InputPanel/src/components/DataFieldsListItem.tsx +++ b/src/components/InputPanel/src/components/DataFieldsListItem.tsx @@ -12,10 +12,13 @@ import { doUpdateDataField, doUpdateDataFieldName, } from "@/reducers/workspace/workspaceActions"; import {FormattedMessage, useIntl} from "@/locale"; -import {ComponentSize} from "@/constants/enums"; +import {ComponentSize, ValueType} from "@/constants/enums"; import {getGeneratorOptionsComponentByDataType} from "@/utils/generatorUtils"; import {OptionsButton, OptionsInput, OptionsNumberInput} from "@/components/Utils"; import {isNullOrWhiteSpace} from "@/utils/stringUtils"; +import {GeneratorDebugger} from "@/components/DevTools"; +import {inDevEnvironment} from "@/utils/devUtils"; +import {hasValue} from "@/utils/typeUtils"; export interface DataFieldsListItemItemProps { id: string; @@ -45,9 +48,14 @@ export const DataFieldsListItem: React.FunctionComponent { - handleUpdateDataField('dataTypeOptions', options); - } + const handleOptionValueChange = (fieldName: string, value: any, valueType?: ValueType) => { + let field = {...dataField, dataTypeOptions: {...dataField.dataTypeOptions, [fieldName]: value}}; + if (hasValue(valueType)) { + field.valueType = valueType; + } + console.log(valueType) + dispatch(doUpdateDataField(id, field)); + }; const handleDelete = () => { dispatch(doDeleteDataField(id)); @@ -65,7 +73,10 @@ export const DataFieldsListItem: React.FunctionComponent { if (!dataField.dataType) return null; return OptionsComponent ? - : null; + : null }; const renderEmptyRateInput = () => { @@ -127,7 +138,12 @@ export const DataFieldsListItem: React.FunctionComponent} onClick={handleOpenDataTypeSelectModal} - style={{width: 140, fontSize: '13px', fontWeight: 'normal', justifyContent: 'left'}} + style={{ + width: 140, + fontSize: '13px', + fontWeight: 'normal', + justifyContent: 'left' + }} text={dataField.dataType ? : } @@ -154,6 +170,7 @@ export const DataFieldsListItem: React.FunctionComponent
+
diff --git a/src/components/InputPanel/src/components/DataTypeOptionsModal.tsx b/src/components/InputPanel/src/components/DataTypeOptionsModal.tsx index 71dac3b..7245063 100644 --- a/src/components/InputPanel/src/components/DataTypeOptionsModal.tsx +++ b/src/components/InputPanel/src/components/DataTypeOptionsModal.tsx @@ -8,7 +8,7 @@ import { } from "@/reducers/workspace/workspaceSelectors"; import {getGeneratorOptionsComponentByDataType} from "@/utils/generatorUtils"; import {doCloseDataTypeOptionsModal, doUpdateDataField} from "@/reducers/workspace/workspaceActions"; -import {ComponentSize} from "@/constants/enums"; +import {ComponentSize, ValueType} from "@/constants/enums"; import {FormattedMessage, useIntl} from "@/locale"; import {OptionsNumberInput} from "@/components/Utils"; import {isNullOrWhiteSpace} from "@/utils/stringUtils"; @@ -39,6 +39,7 @@ export const DataTypeOptionsModal: React.FunctionComponent : null; }; @@ -51,6 +52,14 @@ export const DataTypeOptionsModal: React.FunctionComponent{ + const newDataField = { + ...dataField, + valueType:valueType + } + dispatch(doUpdateDataField(dataFieldId, newDataField)); + } + const handleEmptyRateChange = (value) => { const newDataField = { ...dataField, diff --git a/src/components/Utils/src/OptionsRadio.tsx b/src/components/Utils/src/OptionsRadio.tsx new file mode 100644 index 0000000..4de0578 --- /dev/null +++ b/src/components/Utils/src/OptionsRadio.tsx @@ -0,0 +1,49 @@ +import React from "react"; +import {ErrorTooltip, InfoTooltip} from "@/components/Utils"; +import {Radio, RadioGroup} from "@douyinfe/semi-ui"; + +export interface RadioOption { + label: string | React.ReactNode; + value: any; +} + +export interface OptionsRadioProps { + label: string | React.ReactNode; + radioOptions: RadioOption[]; + type: 'button'|'card' + infoTooltip?: string | React.ReactNode; + errorMessage?: string; + value: any; + onChange: (value: any) => void; + style?: React.CSSProperties; +} + +export const OptionsRadio: React.FunctionComponent = ({...props}) => { + const {label, radioOptions, infoTooltip, errorMessage, value, style, onChange} = props; + + return ( +
+
+ {label} + {infoTooltip && + {infoTooltip} + } +
+ + onChange(e.target.value)} + style={style} + > + {radioOptions.map((option,index)=>{ + return + {option.label} + + })} + + +
+ ) +} \ No newline at end of file diff --git a/src/constants/enums.ts b/src/constants/enums.ts index 828f5bb..b36d537 100644 --- a/src/constants/enums.ts +++ b/src/constants/enums.ts @@ -2,26 +2,29 @@ // export format export enum ExportFormatCategory { FILE_TYPES = "fileTypes", - DATABASE = "database", + DATABASES = "databases", PROGRAMMING_LANGUAGES = "programmingLanguages", } export enum ExportFormat { + SQL = "SQL", CSV = "CSV", JSON = "JSON", JAVA_SCRIPT = "Javascript", XML = "XML", } -export enum ExportValueType { +export enum ValueType { STRING = "string", - NUMBER = "number", + TEXT= "text", + ONE_BIT = "1bit", + INT = "integer", + BIGINT = "bigint", + FLOAT = "float", + DOUBLE = "double", BOOLEAN = "boolean", - DATE_TIME = "dateTime", - NULL = "null", - CSS = "css", - BINARY = "binary", - HEX = "hex", + INT_LIST = "int_list", + STRING_LIST = "string_list" } export enum ExportProcessStage{ diff --git a/src/core/formatters/Csv/Csv.tsx b/src/core/formatters/Csv/Csv.tsx index 12250ab..e3f7662 100644 --- a/src/core/formatters/Csv/Csv.tsx +++ b/src/core/formatters/Csv/Csv.tsx @@ -1,5 +1,5 @@ import React from "react"; -import {EndOfLineChars, ExportValueType} from "@/constants/enums"; +import {EndOfLineChars} from "@/constants/enums"; import {FormatRequest, FormatterConfigComponentInterface} from "@/types/formatter"; import {FormattedMessage, useIntl} from "@/locale"; import {OptionsInput, OptionsSelect, SelectOption} from "@/components/Utils"; @@ -45,7 +45,7 @@ export const format = (request: FormatRequest): string => { sortedFieldIds .filter(column => !fields[column].isDraft) .map(column => { - if(item[column].type !== ExportValueType.NULL) { + if (item[column].value !== null) { let value = item[column].stringValue; value = value.replace(/"/g, '""'); // Escape double quotes if (value.includes(delimiter) || value.includes(endOfLineChar)) { @@ -53,7 +53,7 @@ export const format = (request: FormatRequest): string => { } return value; - }else{ + } else { return ""; } })); diff --git a/src/core/formatters/JavaScript/Javascript.tsx b/src/core/formatters/JavaScript/Javascript.tsx index 78b7840..3957712 100644 --- a/src/core/formatters/JavaScript/Javascript.tsx +++ b/src/core/formatters/JavaScript/Javascript.tsx @@ -1,23 +1,23 @@ import React from "react"; -import {EndOfLineChars, ExportValueType} from "@/constants/enums"; import {FormatRequest, FormatterConfigComponentInterface} from "@/types/formatter"; import {FormattedMessage, useIntl} from "@/locale"; import {OptionsInput, OptionsSelect, SelectOption} from "@/components/Utils"; -import {OptionsSwitch} from "@/components/Utils/src/OptionsSwitch"; import {isNullOrWhiteSpace} from "@/utils/stringUtils"; // ------------------------------------------------------------------------------------------------------------- // types export enum JavascriptFormatterFormat { VARIABLE = "VARIABLE", EXPORT = "EXPORT"} + export enum JavascriptDeclarationKeyword { VAR = "var", CONST = "const", LET = "let" } + export enum JavascriptModuleType { ES6 = "ES6", CommonJS = "CommonJS"} export type JavascriptFormatterConfig = { - format:JavascriptFormatterFormat, + format: JavascriptFormatterFormat, variableName?: string, declarationKeyword: JavascriptDeclarationKeyword, - module:JavascriptModuleType + module: JavascriptModuleType } export const defaultJavascriptFormatterConfig: JavascriptFormatterConfig = { @@ -31,8 +31,8 @@ export const defaultJavascriptFormatterConfig: JavascriptFormatterConfig = { // format method export const format = (request: FormatRequest): string => { - const { fields, values, config, sortedFieldIds } = request; - const { format: formatType, variableName, declarationKeyword, module } = config; + const {fields, values, config, sortedFieldIds} = request; + const {format: formatType, variableName, declarationKeyword, module} = config; if (values.length === 0) { return ''; @@ -42,11 +42,11 @@ export const format = (request: FormatRequest): string => { const row: Record = {}; for (const column of sortedFieldIds) { const field = fields[column]; - const { isDraft, fieldName } = field; + const {isDraft, fieldName} = field; const itemValue = item[column]; - let { value } = itemValue; + let {value} = itemValue; - if (!isDraft && itemValue.type !== ExportValueType.NULL && value !== null) { + if (!isDraft && value !== null) { if (typeof value === 'bigint') { value = value.toString(); } @@ -104,13 +104,13 @@ export const JavascriptConfigComponent: React.FC { const newErrorMessages = {...errorMessages}; if (isNullOrWhiteSpace(jsConfig.variableName) && jsConfig.format === JavascriptFormatterFormat.VARIABLE) { - newErrorMessages.delimiter = intl.formatMessage({id: 'export.configurator.javascript.varName.required'}); + newErrorMessages.varName = intl.formatMessage({id: 'export.configurator.javascript.varName.required'}); } else { - newErrorMessages.delimiter = ''; + newErrorMessages.varName = ''; } setErrorMessages(newErrorMessages); }, [jsConfig.format, jsConfig.variableName]); @@ -130,15 +130,15 @@ export const JavascriptConfigComponent: React.FC - } - value={jsConfig.variableName} - onChange={(value) => { - handleValueChange('variableName', value) - }} - style={{width: '150px'}} - errorMessage={errorMessages.delimiter} - /> + } + value={jsConfig.variableName} + onChange={(value) => { + handleValueChange('variableName', value) + }} + style={{width: '150px'}} + errorMessage={errorMessages.varName} + /> } selectOptions={keywordsOptions} @@ -169,8 +169,14 @@ export const JavascriptConfigComponent: React.FC, value: JavascriptFormatterFormat.VARIABLE}, - {label: , value: JavascriptFormatterFormat.EXPORT} + { + label: , + value: JavascriptFormatterFormat.VARIABLE + }, + { + label: , + value: JavascriptFormatterFormat.EXPORT + } ] const keywordsOptions: SelectOption[] = [ diff --git a/src/core/formatters/Json/Json.tsx b/src/core/formatters/Json/Json.tsx index f715690..be6a0d8 100644 --- a/src/core/formatters/Json/Json.tsx +++ b/src/core/formatters/Json/Json.tsx @@ -2,7 +2,6 @@ import React from "react"; import {FormatRequest, FormatterConfigComponentInterface} from "@/types/formatter"; import {OptionsSwitch} from "@/components/Utils/src/OptionsSwitch"; import {FormattedMessage} from "@/locale"; -import {ExportValueType} from "@/constants/enums"; import {OptionsSelect, SelectOption} from "@/components/Utils"; // ------------------------------------------------------------------------------------------------------------- @@ -24,8 +23,8 @@ export const defaultJsonFormatterConfig: JsonFormatterConfig = { // format method export const format = (request: FormatRequest): string => { - const { fields, values, sortedFieldIds, config } = request; - const { insideArray, includeNullValues, indentSize } = config; + const {fields, values, sortedFieldIds, config} = request; + const {insideArray, includeNullValues, indentSize} = config; if (values.length === 0) { return ''; @@ -38,11 +37,11 @@ export const format = (request: FormatRequest): string => { if (!fields[column].isDraft) { let value = item[column].value; - if(typeof value === 'bigint'){ + if (typeof value === 'bigint') { value = value.toString(); } - if (includeNullValues || (item[column].type !== ExportValueType.NULL && value !== null)) { + if (includeNullValues || value !== null) { row[fields[column].fieldName] = value; } } diff --git a/src/core/formatters/Sql/Sql.tsx b/src/core/formatters/Sql/Sql.tsx new file mode 100644 index 0000000..0419980 --- /dev/null +++ b/src/core/formatters/Sql/Sql.tsx @@ -0,0 +1,230 @@ +import React from "react"; +import {FormatRequest, FormatterConfigComponentInterface} from "@/types/formatter"; +import {OptionsInput, OptionsNumberInput, OptionsSelect, SelectOption} from "@/components/Utils"; +import {FormattedMessage, useIntl} from "@/locale"; +import {isNullOrWhiteSpace} from "@/utils/stringUtils"; +import {OptionsSwitch} from "@/components/Utils/src/OptionsSwitch"; +import {Divider} from "@douyinfe/semi-ui"; +import {DataField, GenerateResult} from "@/types/generator"; +import {ValueType} from "@/constants/enums"; + + +// ------------------------------------------------------------------------------------------------------------- +// types + +export enum SqlType { + MYSQL = "MYSQL", + POSTGRES = "POSTGRES", + ORACLE = "ORACLE", + MICROSOFT = "MICROSOFT", + SQLITE = "SQLITE", + IBMDB2 = "IBMDB2", + SAPHANA = "SAPHANA" +} + +export type SqlFormatterConfig = { + type: SqlType, + tableName: string, + batchSize: number, + dropTable: boolean, + createTable: boolean, + primaryKey: boolean, + primaryKeyColumnName: string, +} + +// ------------------------------------------------------------------------------------------------------------- +// default options + +export const defaultSqlFormatterConfig: SqlFormatterConfig = { + type: SqlType.MYSQL, + tableName: "DataTable", + batchSize: 20, + dropTable: false, + createTable: false, + primaryKey: true, + primaryKeyColumnName: "id" +} + +// ------------------------------------------------------------------------------------------------------------- +// format method + +export const format = (request: FormatRequest): string => { + const {fields, values, config, sortedFieldIds} = request; + const {type, tableName, batchSize, dropTable, createTable, primaryKey, primaryKeyColumnName} = config; + console.log(values) + + let sql = ''; + + if (values.length === 0) { + return sql; + } + + // Drop table if required + if (dropTable) { + sql += `DROP TABLE IF EXISTS ${tableName};\n\n`; + } + + // Create table if required + if (createTable) { + sql += `CREATE TABLE ${tableName} (\n`; + if (primaryKey) { + sql += ` ${primaryKeyColumnName} INT AUTO_INCREMENT PRIMARY KEY,\n`; + } + sortedFieldIds.forEach((id, index) => { + sql += addCreateTableColumn(fields[id]) + sql += index < sortedFieldIds.length - 1 ? ',\n' : '\n'; + }); + sql += `);\n\n`; + } + + // Insert data + if (values.length > 0) { + for (let i = 0; i < values.length; i += batchSize) { + const batchValues = values.slice(i, i + batchSize); + sql += `INSERT INTO ${tableName} (`; + sql += sortedFieldIds.map(id => fields[id].fieldName).join(', '); + sql += `) VALUES \n`; + + batchValues.forEach((item, index) => { + const valueString = sortedFieldIds.map(id => { + const value = item[id].stringValue; // Assuming stringValue is the appropriate property for SQL value + return typeof value === 'string' ? `'${value.replace(/'/g, "''")}'` : value; // Handle string values and escape single quotes + }).join(', '); + sql += ` (${valueString})`; + sql += index < batchValues.length - 1 ? ',\n' : ';\n\n'; // End the line with a comma or a semicolon depending on the batch + }); + } + } + + return sql; +} + +const addCreateTableColumn = (field: DataField) => { + let sql = ` ${field.fieldName} `; + switch (field.valueType) { + case ValueType.STRING: + sql += "VARCHAR(255) DEFAULT NULL" + return sql; + case ValueType.INT: + sql += "INT DEFAULT NULL" + return sql; + case ValueType.DOUBLE: + sql += "DOUBLE DEFAULT NULL" + return sql; + case ValueType.STRING_LIST: + sql += "VARCHAR(255) DEFAULT NULL" + default: + return sql; + } +} + +// ------------------------------------------------------------------------------------------------------------- +// config component + +export const SqlConfigComponent: React.FC = ({...props}) => { + const {config, onConfigChange} = props; + const intl = useIntl(); + + // action + const handleValueChange = (field: string, value: any) => { + onConfigChange({...config, [field]: value}) + } + + const [errorMessages, setErrorMessages] = React.useState({tableName: ''}); + React.useEffect(() => { + const newErrorMessages = {...errorMessages}; + if (isNullOrWhiteSpace(config.tableName)) { + newErrorMessages.tableName = intl.formatMessage({id: 'export.configurator.sql.tableName.required'}); + } else { + newErrorMessages.tableName = ''; + } + setErrorMessages(newErrorMessages); + }, [config.tableName]); + + return ( +
+ } + selectOptions={typeOptions} + value={config.type} + onChange={(value) => { + handleValueChange('type', value) + }} + style={{width: '200px'}} + /> + +
+ } + value={config.tableName} + onChange={(value) => { + handleValueChange('tableName', value) + }} + style={{width: '150px'}} + errorMessage={errorMessages.tableName} + /> + + } + value={config.batchSize} + onChange={(value) => { + handleValueChange('batchSize', value) + }} + style={{width: '100px'}} + min={1} + /> + +
+ + +
+ } + value={config.dropTable} + onChange={(value) => { + handleValueChange('dropTable', value) + }}/> + + } + value={config.createTable} + onChange={(value) => { + handleValueChange('createTable', value) + }}/> +
+ + { + config.createTable &&
+ } + value={config.primaryKey} + onChange={(value) => { + handleValueChange('primaryKey', value) + }}/> + + {config.primaryKey && } + value={config.primaryKeyColumnName} + onChange={(value) => { + handleValueChange('primaryKeyColumnName', value) + }} + style={{width: '80px'}} + errorMessage={errorMessages.tableName} + />} +
+ } + +
+ ); +} + + +const typeOptions: SelectOption[] = [ + {label: "MySQL", value: SqlType.MYSQL}, + {label: "PostgresSQL", value: SqlType.POSTGRES}, + {label: "Oracle Database", value: SqlType.ORACLE}, + {label: "Microsoft SQL Server", value: SqlType.MICROSOFT}, + {label: "SQLite", value: SqlType.SQLITE}, + {label: "IBM DB2", value: SqlType.IBMDB2}, + {label: "SAP HANA", value: SqlType.SAPHANA} +] diff --git a/src/core/formatters/Sql/index.ts b/src/core/formatters/Sql/index.ts new file mode 100644 index 0000000..9c7d79d --- /dev/null +++ b/src/core/formatters/Sql/index.ts @@ -0,0 +1,13 @@ +import {Formatter} from "@/types/formatter"; +import {ExportFormat, ExportFormatCategory} from "@/constants/enums"; +import {SqlConfigComponent, format, defaultSqlFormatterConfig} from "./Sql"; + + +export const SqlFormatter: Formatter = { + type: ExportFormat.SQL, + category: ExportFormatCategory.DATABASES, + format: format, + fileExtension: 'sql', + configComponent: SqlConfigComponent, + defaultConfig: defaultSqlFormatterConfig, +} \ No newline at end of file diff --git a/src/core/formatters/Xml/Xml.tsx b/src/core/formatters/Xml/Xml.tsx index 2e217aa..607f069 100644 --- a/src/core/formatters/Xml/Xml.tsx +++ b/src/core/formatters/Xml/Xml.tsx @@ -2,8 +2,6 @@ import React from "react"; import {FormatRequest, FormatterConfigComponentInterface} from "@/types/formatter"; import {OptionsInput, OptionsSelect, SelectOption} from "@/components/Utils"; import {FormattedMessage} from "@/locale"; -import {ExportValueType} from "@/constants/enums"; - // ------------------------------------------------------------------------------------------------------------- // types @@ -42,7 +40,7 @@ export const format = (request: FormatRequest): string => { sortedFieldIds.forEach(column => { if (!fields[column].isDraft) { - if(item[column].type !== ExportValueType.NULL) { + if (item[column].value !== null) { let value = item[column].stringValue; if (value.includes('\n')) { value = `"${value}"`; diff --git a/src/core/formatters/index.ts b/src/core/formatters/index.ts index 9c440e7..19d37ef 100644 --- a/src/core/formatters/index.ts +++ b/src/core/formatters/index.ts @@ -1,3 +1,4 @@ +import {SqlFormatter} from "@/core/formatters/Sql"; import {CsvFormatter} from "@/core/formatters/Csv"; import {JsonFormatter} from "@/core/formatters/Json"; import {JavaScriptFormatter} from "@/core/formatters/JavaScript"; @@ -6,6 +7,7 @@ import {XmlFormatter} from "@/core/formatters/Xml"; export const formatters = { + [ExportFormat.SQL]: SqlFormatter, [ExportFormat.CSV]: CsvFormatter, [ExportFormat.JSON]: JsonFormatter, [ExportFormat.JAVA_SCRIPT]: JavaScriptFormatter, diff --git a/src/core/generators/Boolean/Boolean.tsx b/src/core/generators/Boolean/Boolean.tsx index 2afeb25..f7c6d06 100644 --- a/src/core/generators/Boolean/Boolean.tsx +++ b/src/core/generators/Boolean/Boolean.tsx @@ -4,12 +4,14 @@ import {FormattedMessage, useIntl} from "@/locale"; import {Tag} from "@douyinfe/semi-ui"; import {OptionsNumberInput, OptionsSelect, SelectOption} from "@/components/Utils"; import {faker} from "@faker-js/faker"; -import {ExportValueType} from "@/constants/enums"; +import {ValueType} from "@/constants/enums"; import style from './Boolean.module.scss'; import {isNullOrWhiteSpace} from "@/utils/stringUtils"; +import {ColorGeneratorOptions} from "@/core/generators/Color/Color"; // ------------------------------------------------------------------------------------------------------------- -// types +// typesx + export enum BooleanGenerateFormat { TRUE_FALSE_BOOLEAN = "TRUE_FALSE_BOOLEAN", ONE_ZERO_NUMBER = "ONE_ZERO_NUMBER", @@ -37,26 +39,22 @@ export const generate = (options: any): GenerateResult => { case BooleanGenerateFormat.TRUE_FALSE_BOOLEAN: return { value: result, - stringValue: result ? 'true' : 'false', - type: ExportValueType.BOOLEAN + stringValue: result ? 'true' : 'false' }; case BooleanGenerateFormat.ONE_ZERO_NUMBER: return { value: result ? 1 : 0, - stringValue: result ? '1' : '0', - type: ExportValueType.NUMBER + stringValue: result ? '1' : '0' }; case BooleanGenerateFormat.TRUE_FALSE_STRING: return { value: result ? 'true' : 'false', - stringValue: result ? 'true' : 'false', - type: ExportValueType.STRING + stringValue: result ? 'true' : 'false' }; case BooleanGenerateFormat.YES_NO_STRING: return { value: result ? 'Yes' : 'No', - stringValue: result ? 'Yes' : 'No', - type: ExportValueType.STRING + stringValue: result ? 'Yes' : 'No' }; } } @@ -64,13 +62,24 @@ export const generate = (options: any): GenerateResult => { // ------------------------------------------------------------------------------------------------------------- // options component export const BooleanGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { - const {options, onOptionsChange} = props; - const booleanOptions: BooleanGeneratorOptions = options; + const {options, handleOptionValueChange} = props as { + options: BooleanGeneratorOptions, + handleOptionValueChange: typeof props.handleOptionValueChange + }; + const intl = useIntl(); - const handleOptionsChange = (changedFieldName: string, value: any) => { - let newOptions = {...booleanOptions, [changedFieldName]: value}; - onOptionsChange(newOptions); + // format + const handleFormatChange = (format: BooleanGenerateFormat) => { + if (format === BooleanGenerateFormat.TRUE_FALSE_BOOLEAN) { + handleOptionValueChange("format", BooleanGenerateFormat.TRUE_FALSE_BOOLEAN, ValueType.BOOLEAN); + } else if (format === BooleanGenerateFormat.ONE_ZERO_NUMBER) { + handleOptionValueChange("format", BooleanGenerateFormat.ONE_ZERO_NUMBER, ValueType.ONE_BIT); + } else if (format === BooleanGenerateFormat.TRUE_FALSE_STRING) { + handleOptionValueChange("format", BooleanGenerateFormat.TRUE_FALSE_STRING, ValueType.STRING); + } else if (format === BooleanGenerateFormat.YES_NO_STRING) { + handleOptionValueChange("format", BooleanGenerateFormat.YES_NO_STRING, ValueType.STRING); + } } // error validation @@ -79,26 +88,26 @@ export const BooleanGeneratorOptionsComponent: React.FunctionComponent { - if(isNullOrWhiteSpace(booleanOptions.truePercentage.toString())) { + if (isNullOrWhiteSpace(options.truePercentage.toString())) { setErrorMessages({ ...errorMessages, truePercentage: intl.formatMessage({id: 'dataType.boolean.true.errorMessage.empty'}) }) - }else{ + } else { setErrorMessages({ ...errorMessages, truePercentage: '' }) } - }, [booleanOptions.truePercentage]) + }, [options.truePercentage]) return ( <> } infoTooltip={} - value={booleanOptions.truePercentage} - onChange={(v) => handleOptionsChange("truePercentage", v)} + value={options.truePercentage} + onChange={(v) => handleOptionValueChange("truePercentage", v)} style={{width: '100px'}} suffix={"%"} min={0} @@ -109,8 +118,8 @@ export const BooleanGeneratorOptionsComponent: React.FunctionComponent} selectOptions={formatOptions} - value={booleanOptions.format} - onChange={(v) => handleOptionsChange("format", v)} + value={options.format} + onChange={(v) => handleFormatChange(v)} style={{width: '210px'}} /> diff --git a/src/core/generators/Boolean/index.ts b/src/core/generators/Boolean/index.ts index f71a801..c6569cc 100644 --- a/src/core/generators/Boolean/index.ts +++ b/src/core/generators/Boolean/index.ts @@ -1,9 +1,9 @@ import {Generator} from "@/types/generator"; -import {DataType, DataTypeCategory} from "@/constants/enums"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; import { - generate, + BooleanGeneratorDefaultOptions, BooleanGeneratorOptionsComponent, - BooleanGeneratorDefaultOptions + generate } from "@/core/generators/Boolean/Boolean"; @@ -11,6 +11,7 @@ export const BooleanGenerator: Generator = { type: DataType.BOOLEAN, category: DataTypeCategory.BASIC, generate: generate, + defaultValueType: ValueType.BOOLEAN, optionsComponent: BooleanGeneratorOptionsComponent, defaultOptions: BooleanGeneratorDefaultOptions, exampleLines: ["true, false", "1, 0", '"True", "Yes", "No"'] diff --git a/src/core/generators/Color/Color.tsx b/src/core/generators/Color/Color.tsx index 11aa033..e6981a1 100644 --- a/src/core/generators/Color/Color.tsx +++ b/src/core/generators/Color/Color.tsx @@ -1,11 +1,11 @@ import React from "react"; -import { GenerateResult, GeneratorOptionsComponentInterface } from "@/types/generator"; -import { ExportValueType } from "@/constants/enums"; -import { CssFunctionType, faker } from "@faker-js/faker"; -import { Tag } from "@douyinfe/semi-ui"; -import { OptionsNumberInput, OptionsSelect, SelectOption } from "@/components/Utils"; -import { FormattedMessage} from "@/locale"; +import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; +import {faker} from "@faker-js/faker"; +import {Tag} from "@douyinfe/semi-ui"; +import {OptionsSelect, SelectOption} from "@/components/Utils"; +import {FormattedMessage} from "@/locale"; import style from '../Boolean/Boolean.module.scss'; +import {ValueType} from "@/constants/enums"; export enum ColorGeneratorFormat { @@ -15,31 +15,28 @@ export enum ColorGeneratorFormat { } export enum ColorGeneratorKind { - HUMAN = "W", + HUMAN = "HUMAN", RGB = "RGB", HSL = "HSL", } + export interface ColorGeneratorOptions { kind: ColorGeneratorKind; format: ColorGeneratorFormat; casing?: 'lower' | 'mixed' | 'upper'; includeAlpha?: boolean; prefix?: string; - - } export const ColorGeneratorDefaultOptions: ColorGeneratorOptions = { kind: ColorGeneratorKind.HUMAN, format: ColorGeneratorFormat.CSS, - }; const toBinary = (value: number): string => value.toString(2).padStart(8, '0'); export const generate = (options): GenerateResult => { - const { format, kind, casing, includeAlpha, prefix } = options; - + const {format, kind, casing, includeAlpha, prefix} = options; let result: any; let stringValue: string; @@ -64,7 +61,7 @@ export const generate = (options): GenerateResult => { case ColorGeneratorKind.RGB: if (format === ColorGeneratorFormat.BINARY) { // Handle binary format conversion separately since Faker doesn't support it directly - const decimalColor = faker.color.rgb({ format: 'decimal' }); + const decimalColor = faker.color.rgb({format: 'decimal'}); result = decimalColor.map(toBinary).join(' '); } else { fakerOptions.format = format === ColorGeneratorFormat.CSS ? 'css' : @@ -80,40 +77,50 @@ export const generate = (options): GenerateResult => { return { value: result, stringValue: stringValue, - type: ExportValueType.STRING }; - - } +export const ColorGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { + const {options, handleOptionValueChange} = props as { + options: ColorGeneratorOptions, + handleOptionValueChange: typeof props.handleOptionValueChange + }; -export const ColorGeneratorOptionsComponent: React.FunctionComponent = ({ ...props }) => { - const { options, onOptionsChange } = props; - const colorOptions: ColorGeneratorOptions = options; - - + // kind + const handleChangeKind = (kind: ColorGeneratorKind) => { + if (kind === ColorGeneratorKind.RGB) { + handleOptionValueChange("kind", kind, options.format === ColorGeneratorFormat.DECIMAL ? ValueType.INT_LIST : ValueType.STRING); + } else { + handleOptionValueChange("kind", kind, ValueType.STRING); + } + } - const handleOptionsChange = (changedFieldName: string, value: any) => { - let newOptions = { ...colorOptions, [changedFieldName]: value }; - onOptionsChange(newOptions); + // format + const handleChangeFormat = (format: ColorGeneratorFormat) => { + if (format === ColorGeneratorFormat.DECIMAL) { + handleOptionValueChange("format", format, ValueType.INT_LIST); + } else { + handleOptionValueChange("format", format, ValueType.STRING); + } } return ( <> } + label={} selectOptions={kindSelectOptions} - value={colorOptions.kind} - onChange={(v) => handleOptionsChange('kind', v)} - style={{ width: '100px' }} + value={options.kind} + onChange={(v) => handleChangeKind(v)} + style={{width: '150px'}} /> - {colorOptions.kind === ColorGeneratorKind.RGB && } + {options.kind === ColorGeneratorKind.RGB && } selectOptions={formatSelectOptions} - value={colorOptions.format} - onChange={(v) => handleOptionsChange('format', v)} + value={options.format} + onChange={(v) => handleChangeFormat(v)} + style={{width: '250px'}} />} @@ -121,23 +128,30 @@ export const ColorGeneratorOptionsComponent: React.FunctionComponent ({ - value: kind, - label: kind, -})); +const kindSelectOptions: SelectOption[] = [ + { + label: , + value: ColorGeneratorKind.HUMAN, + }, { + label: "RGB", + value: ColorGeneratorKind.RGB + }, { + label: "HSL", + value: ColorGeneratorKind.HSL + }] const formatSelectOptions: SelectOption[] = [ { value: ColorGeneratorFormat.BINARY, - label: <>binaryBinary Format + label: <>stringBinary }, { value: ColorGeneratorFormat.CSS, - label: <>stringCSS Format + label: <>stringCSS }, { value: ColorGeneratorFormat.DECIMAL, - label: <>stringInteger Format + label: <>listDecimal } ] diff --git a/src/core/generators/Color/index.ts b/src/core/generators/Color/index.ts index 4a10a14..2112211 100644 --- a/src/core/generators/Color/index.ts +++ b/src/core/generators/Color/index.ts @@ -1,13 +1,14 @@ import {Generator} from "@/types/generator"; -import {DataType, DataTypeCategory} from "@/constants/enums"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; +import {ColorGeneratorDefaultOptions, ColorGeneratorOptionsComponent, generate} from "@/core/generators/Color/Color"; -import {ColorGeneratorOptionsComponent, ColorGeneratorDefaultOptions, generate} from "@/core/generators/Color/Color"; export const ColorGenerator: Generator = { type: DataType.COLOR, category: DataTypeCategory.BASIC, generate: generate, optionsComponent: ColorGeneratorOptionsComponent, defaultOptions: ColorGeneratorDefaultOptions, + defaultValueType: ValueType.STRING, exampleLines: ["red", "#ff0000", "8-32 bits x 3"] } \ No newline at end of file diff --git a/src/core/generators/CompanyName/CompanyName.tsx b/src/core/generators/CompanyName/CompanyName.tsx index 4b34e3b..d77056a 100644 --- a/src/core/generators/CompanyName/CompanyName.tsx +++ b/src/core/generators/CompanyName/CompanyName.tsx @@ -1,6 +1,5 @@ import {GenerateResult} from "@/types/generator"; import {faker} from "@faker-js/faker"; -import {ExportValueType} from "@/constants/enums"; // ------------------------------------------------------------------------------------------------------------- // types @@ -15,7 +14,6 @@ export const generate = (options: any): GenerateResult => { return { value: value, stringValue: value, - type: ExportValueType.STRING } } diff --git a/src/core/generators/CompanyName/index.ts b/src/core/generators/CompanyName/index.ts index 372c364..46101c0 100644 --- a/src/core/generators/CompanyName/index.ts +++ b/src/core/generators/CompanyName/index.ts @@ -1,11 +1,12 @@ import {Generator} from "@/types/generator"; import {generate} from "@/core/generators/CompanyName/CompanyName"; -import {DataType, DataTypeCategory} from "@/constants/enums"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; export const CompanyNameGenerator:Generator = { type: DataType.COMPANY_NAME, category: DataTypeCategory.COMMERCE, generate: generate, + defaultValueType: ValueType.STRING, exampleLines: ["Cassin LLC", "Thompson Group", "Emmerich Inc"] } diff --git a/src/core/generators/Email/Email.tsx b/src/core/generators/Email/Email.tsx index 9b80345..1cedf2c 100644 --- a/src/core/generators/Email/Email.tsx +++ b/src/core/generators/Email/Email.tsx @@ -1,6 +1,5 @@ import {isNullOrWhiteSpace} from "@/utils/stringUtils"; import {faker} from "@faker-js/faker"; -import {ExportValueType} from "@/constants/enums"; import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; import React from "react"; import {OptionsSwitch} from "@/components/Utils/src/OptionsSwitch"; @@ -36,20 +35,16 @@ export const generate = (options: any): GenerateResult => { return { value: value, stringValue: value, - type: ExportValueType.STRING } } // ------------------------------------------------------------------------------------------------------------- // options component export const EmailGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { - const {options, onOptionsChange} = props; - const emailOptions: EmailGeneratorOptions = options; - - const handleOptionsChange = (changedFieldName: string, value: any) => { - let newOptions = {...emailOptions, [changedFieldName]: value}; - onOptionsChange(newOptions); - } + const {options, handleOptionValueChange} = props as { + options: EmailGeneratorOptions, + handleOptionValueChange: typeof props.handleOptionValueChange + }; return ( <> @@ -57,7 +52,7 @@ export const EmailGeneratorOptionsComponent: React.FunctionComponent} value={options.provider} onChange={(v) => { - handleOptionsChange('provider', v) + handleOptionValueChange('provider', v) }} /> @@ -65,7 +60,7 @@ export const EmailGeneratorOptionsComponent: React.FunctionComponent} value={options.allowSpecialCharacters} onChange={(v) => { - handleOptionsChange('allowSpecialCharacters', v) + handleOptionValueChange('allowSpecialCharacters', v) }} size={'large'} /> diff --git a/src/core/generators/Email/index.ts b/src/core/generators/Email/index.ts index 9488f18..ea1fa9b 100644 --- a/src/core/generators/Email/index.ts +++ b/src/core/generators/Email/index.ts @@ -1,5 +1,5 @@ import {Generator} from "@/types/generator"; -import {DataType, DataTypeCategory} from "@/constants/enums"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; import {EmailGeneratorDefaultOptions, EmailGeneratorOptionsComponent, generate} from "@/core/generators/Email/Email"; export const EmailGenerator: Generator = { @@ -8,5 +8,6 @@ export const EmailGenerator: Generator = { generate: generate, optionsComponent: EmailGeneratorOptionsComponent, defaultOptions: EmailGeneratorDefaultOptions, + defaultValueType: ValueType.STRING, exampleLines: ["Saman3@hotmail.com", "nik.Rau78@yahoo.com", "denis@apple.com"] } \ No newline at end of file diff --git a/src/core/generators/Emoji/Emoji.tsx b/src/core/generators/Emoji/Emoji.tsx index cbb0a99..45f572d 100644 --- a/src/core/generators/Emoji/Emoji.tsx +++ b/src/core/generators/Emoji/Emoji.tsx @@ -1,6 +1,5 @@ import React from "react"; import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; -import {ExportValueType, Sex} from "@/constants/enums"; import {OptionsSelect, SelectOption} from "@/components/Utils"; import {FormattedMessage} from "@/locale"; import {faker} from "@faker-js/faker"; @@ -35,24 +34,20 @@ export const generate = (options: any): GenerateResult => { const config = {}; config['types'] = options.type; - const value = faker.internet.emoji(config); return { value: value, stringValue: value, - type: ExportValueType.STRING }; } // ------------------------------------------------------------------------------------------------------------- // options component export const EmojiGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { - const {options, onOptionsChange} = props; - - const handleOptionsChange = (changedFieldName: string, value: any) => { - let newOptions = {...options, [changedFieldName]: value}; - onOptionsChange(newOptions); + const {options, handleOptionValueChange} = props as { + options: EmojiGeneratorOptions, + handleOptionValueChange: typeof props.handleOptionValueChange }; return ( @@ -63,7 +58,7 @@ export const EmojiGeneratorOptionsComponent: React.FunctionComponent} selectOptions={EmojiTypeSelectOptions} value={options.type} - onChange={(v) => handleOptionsChange("type", v)} + onChange={(v) => handleOptionValueChange("type", v)} style={{width: '200px'}} />
diff --git a/src/core/generators/Emoji/index.ts b/src/core/generators/Emoji/index.ts index f0d6ceb..451305b 100644 --- a/src/core/generators/Emoji/index.ts +++ b/src/core/generators/Emoji/index.ts @@ -1,5 +1,5 @@ import {Generator} from "@/types/generator"; -import {DataType, DataTypeCategory} from "@/constants/enums"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; import {EmojiGeneratorDefaultOptions, EmojiGeneratorOptionsComponent, generate} from "./Emoji"; export const EmojiGenerator: Generator = { @@ -8,6 +8,7 @@ export const EmojiGenerator: Generator = { generate: generate, optionsComponent: EmojiGeneratorOptionsComponent, defaultOptions: EmojiGeneratorDefaultOptions, + defaultValueType: ValueType.STRING, exampleLines: ["🤜", "📖", "👰"] } \ No newline at end of file diff --git a/src/core/generators/FirstName/FirstName.tsx b/src/core/generators/FirstName/FirstName.tsx index e7c1aeb..4ca5942 100644 --- a/src/core/generators/FirstName/FirstName.tsx +++ b/src/core/generators/FirstName/FirstName.tsx @@ -1,6 +1,6 @@ import React from "react"; import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; -import {ExportValueType, Sex} from "@/constants/enums"; +import {Sex} from "@/constants/enums"; import {faker} from "@faker-js/faker"; import {FormattedMessage} from "@/locale"; import {OptionsSelect} from "@/components/Utils"; @@ -30,19 +30,16 @@ export const generate = (options: any): GenerateResult => { return { value: value, - stringValue: value, - type: ExportValueType.STRING + stringValue: value }; } // ------------------------------------------------------------------------------------------------------------- // options component export const FirstNameGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { - const {options, onOptionsChange} = props; - - const handleOptionsChange = (changedFieldName: string, value: any) => { - let newOptions = {...options, [changedFieldName]: value}; - onOptionsChange(newOptions); + const {options, handleOptionValueChange} = props as { + options:FirstNameGeneratorOptions, + handleOptionValueChange: typeof props.handleOptionValueChange }; return ( @@ -52,7 +49,7 @@ export const FirstNameGeneratorOptionsComponent: React.FunctionComponent handleOptionsChange("sex", v)}/> + onChange={(v) => handleOptionValueChange("sex", v)}/> ); } diff --git a/src/core/generators/FirstName/index.ts b/src/core/generators/FirstName/index.ts index 52d108d..fb4f20c 100644 --- a/src/core/generators/FirstName/index.ts +++ b/src/core/generators/FirstName/index.ts @@ -1,5 +1,5 @@ import {Generator} from "@/types/generator"; -import {DataType, DataTypeCategory} from "@/constants/enums"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; import {FirstNameGeneratorDefaultOptions, FirstNameGeneratorOptionsComponent, generate} from "./FirstName"; export const FirstNameGenerator: Generator = { @@ -8,6 +8,7 @@ export const FirstNameGenerator: Generator = { generate: generate, optionsComponent: FirstNameGeneratorOptionsComponent, defaultOptions: FirstNameGeneratorDefaultOptions, + defaultValueType: ValueType.STRING, exampleLines: ["Javier", "Luis", "Tom"] } \ No newline at end of file diff --git a/src/core/generators/FullName/FullName.tsx b/src/core/generators/FullName/FullName.tsx index f56a8aa..5676718 100644 --- a/src/core/generators/FullName/FullName.tsx +++ b/src/core/generators/FullName/FullName.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import {GenerateRequest, GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; -import {OptionsInput, OptionsSelect, SelectOption} from "@/components/Utils"; +import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; +import {OptionsInput, OptionsSelect} from "@/components/Utils"; import {FormattedMessage} from "@/locale"; -import {ExportValueType, Sex} from "@/constants/enums"; +import {Sex} from "@/constants/enums"; import {faker} from "@faker-js/faker"; import {isNullOrWhiteSpace} from "@/utils/stringUtils"; import {SexSelectOptions} from "@/core/common/selectOptions/SexSelectOptions"; @@ -44,7 +44,6 @@ export const generate = (options): GenerateResult => { return { value:value, stringValue: value, - type: ExportValueType.STRING } } @@ -52,34 +51,31 @@ export const generate = (options): GenerateResult => { // options component export const FullNameGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { - const {options, onOptionsChange} = props; - const fullNameOptions: FullNameGeneratorOptions = options; - - const handleOptionsChange = (changedFieldName: string, value: any) => { - let newOptions = {...fullNameOptions, [changedFieldName]: value}; - onOptionsChange(newOptions); - } + const {options, handleOptionValueChange} = props as { + options: FullNameGeneratorOptions, + handleOptionValueChange: typeof props.handleOptionValueChange + }; return ( <> } selectOptions={SexSelectOptions} - value={fullNameOptions.sex} + value={options.sex} style={{width: '150px'}} - onChange={(v) => handleOptionsChange("sex", v)}/> + onChange={(v) => handleOptionValueChange("sex", v)}/> } - value={fullNameOptions.firstName} - onChange={(v) => handleOptionsChange("firstName", v)} + value={options.firstName} + onChange={(v) => handleOptionValueChange("firstName", v)} style={{width: '100px'}} /> } - value={fullNameOptions.lastName} - onChange={(v) => handleOptionsChange("lastName", v)} + value={options.lastName} + onChange={(v) => handleOptionValueChange("lastName", v)} style={{width: '100px'}} /> diff --git a/src/core/generators/FullName/index.ts b/src/core/generators/FullName/index.ts index dc4bf69..ff41016 100644 --- a/src/core/generators/FullName/index.ts +++ b/src/core/generators/FullName/index.ts @@ -1,5 +1,5 @@ import {Generator} from "@/types/generator"; -import {DataType, DataTypeCategory} from "@/constants/enums"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; import { FullNameGeneratorDefaultOptions, FullNameGeneratorOptionsComponent, @@ -7,12 +7,12 @@ import { } from "@/core/generators/FullName/FullName"; - export const FullNameGenerator : Generator = { type: DataType.FULL_NAME, category:DataTypeCategory.PERSON, generate: generate, optionsComponent: FullNameGeneratorOptionsComponent, defaultOptions: FullNameGeneratorDefaultOptions, + defaultValueType: ValueType.STRING, exampleLines:["Zach Smith", "Peggy Hackett", "Mr. Elmer Nienow"] } \ No newline at end of file diff --git a/src/core/generators/LastName/LastName.tsx b/src/core/generators/LastName/LastName.tsx index 1f9bdce..d8c8f35 100644 --- a/src/core/generators/LastName/LastName.tsx +++ b/src/core/generators/LastName/LastName.tsx @@ -1,6 +1,6 @@ import React from "react"; import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; -import {ExportValueType, Sex} from "@/constants/enums"; +import {Sex} from "@/constants/enums"; import {faker} from "@faker-js/faker"; import {OptionsSelect} from "@/components/Utils"; import {FormattedMessage} from "@/locale"; @@ -14,7 +14,7 @@ export interface LastNameGeneratorOptions { // ------------------------------------------------------------------------------------------------------------- // default options -export const LastNameGeneratorDefaultOptions:LastNameGeneratorOptions = { +export const LastNameGeneratorDefaultOptions: LastNameGeneratorOptions = { sex: Sex.ALL } @@ -22,7 +22,7 @@ export const LastNameGeneratorDefaultOptions:LastNameGeneratorOptions = { // generate method export const generate = (options: any): GenerateResult => { let config = null; - if(options.sex !== Sex.ALL ){ + if (options.sex !== Sex.ALL) { config = options.sex; } @@ -31,19 +31,16 @@ export const generate = (options: any): GenerateResult => { return { value: value, stringValue: value, - type: ExportValueType.STRING }; } // ------------------------------------------------------------------------------------------------------------- // options component export const LastNameGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { - const {options, onOptionsChange} = props; - - const handleOptionsChange = (changedFieldName: string, value: any) => { - let newOptions = {...options, [changedFieldName]: value}; - onOptionsChange(newOptions); - } + const {options, handleOptionValueChange} = props as { + options: LastNameGeneratorOptions, + handleOptionValueChange: typeof props.handleOptionValueChange + }; return ( <> @@ -52,7 +49,7 @@ export const LastNameGeneratorOptionsComponent: React.FunctionComponent handleOptionsChange("sex", v)}/> + onChange={(v) => handleOptionValueChange("sex", v)}/> ); } \ No newline at end of file diff --git a/src/core/generators/LastName/index.ts b/src/core/generators/LastName/index.ts index b8641d8..0c5c251 100644 --- a/src/core/generators/LastName/index.ts +++ b/src/core/generators/LastName/index.ts @@ -1,6 +1,6 @@ import {Generator} from "@/types/generator"; -import {DataType, DataTypeCategory} from "@/constants/enums"; -import {LastNameGeneratorDefaultOptions, LastNameGeneratorOptionsComponent, generate} from "./LastName"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; +import {generate, LastNameGeneratorDefaultOptions, LastNameGeneratorOptionsComponent} from "./LastName"; export const LastNameGenerator: Generator = { type: DataType.LASTNAME, @@ -8,6 +8,7 @@ export const LastNameGenerator: Generator = { generate: generate, optionsComponent: LastNameGeneratorOptionsComponent, defaultOptions: LastNameGeneratorDefaultOptions, + defaultValueType: ValueType.STRING, exampleLines: ["Hegmann", "Parker", "Wang"] } \ No newline at end of file diff --git a/src/core/generators/MiddleName/MiddleName.tsx b/src/core/generators/MiddleName/MiddleName.tsx index c7de7c8..bafbf4b 100644 --- a/src/core/generators/MiddleName/MiddleName.tsx +++ b/src/core/generators/MiddleName/MiddleName.tsx @@ -1,6 +1,6 @@ import React from "react"; import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; -import {ExportValueType, Sex} from "@/constants/enums"; +import {Sex} from "@/constants/enums"; import {faker} from "@faker-js/faker"; import {OptionsSelect} from "@/components/Utils"; import {FormattedMessage} from "@/locale"; @@ -14,7 +14,7 @@ export interface MiddleNameGeneratorOptions { // ------------------------------------------------------------------------------------------------------------- // default options -export const MiddleNameGeneratorDefaultOptions:MiddleNameGeneratorOptions = { +export const MiddleNameGeneratorDefaultOptions: MiddleNameGeneratorOptions = { sex: Sex.ALL } @@ -22,7 +22,7 @@ export const MiddleNameGeneratorDefaultOptions:MiddleNameGeneratorOptions = { // generate method export const generate = (options: any): GenerateResult => { let config = null; - if(options.sex !== Sex.ALL ){ + if (options.sex !== Sex.ALL) { config = options.sex; } @@ -31,18 +31,15 @@ export const generate = (options: any): GenerateResult => { return { value: value, stringValue: value, - type: ExportValueType.STRING }; } // ------------------------------------------------------------------------------------------------------------- // options component export const MiddleNameGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { - const {options, onOptionsChange} = props; - - const handleOptionsChange = (changedFieldName: string, value: any) => { - let newOptions = {...options, [changedFieldName]: value}; - onOptionsChange(newOptions); + const {options, handleOptionValueChange} = props as { + options: MiddleNameGeneratorOptions, + handleOptionValueChange: typeof props.handleOptionValueChange }; return ( @@ -52,7 +49,7 @@ export const MiddleNameGeneratorOptionsComponent: React.FunctionComponent handleOptionsChange("sex", v)}/> + onChange={(v) => handleOptionValueChange("sex", v)}/> ); } \ No newline at end of file diff --git a/src/core/generators/MiddleName/index.ts b/src/core/generators/MiddleName/index.ts index 219e572..df981b9 100644 --- a/src/core/generators/MiddleName/index.ts +++ b/src/core/generators/MiddleName/index.ts @@ -1,6 +1,6 @@ import {Generator} from "@/types/generator"; -import {DataType, DataTypeCategory} from "@/constants/enums"; -import {MiddleNameGeneratorDefaultOptions, MiddleNameGeneratorOptionsComponent, generate} from "./MiddleName"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; +import {generate, MiddleNameGeneratorDefaultOptions, MiddleNameGeneratorOptionsComponent} from "./MiddleName"; export const MiddleNameGenerator: Generator = { type: DataType.MIDDLENAME, @@ -8,6 +8,7 @@ export const MiddleNameGenerator: Generator = { generate: generate, optionsComponent: MiddleNameGeneratorOptionsComponent, defaultOptions: MiddleNameGeneratorDefaultOptions, + defaultValueType: ValueType.STRING, exampleLines: ["Elliott", "Taylor", "Bailey"] } \ No newline at end of file diff --git a/src/core/generators/Number/Number.tsx b/src/core/generators/Number/Number.tsx index e64793d..29a6119 100644 --- a/src/core/generators/Number/Number.tsx +++ b/src/core/generators/Number/Number.tsx @@ -3,7 +3,7 @@ import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/genera import {FormattedMessage, useIntl} from "@/locale"; import {OptionsNumberInput, OptionsSelect, SelectOption} from "@/components/Utils"; import {faker} from "@faker-js/faker"; -import {ExportValueType} from "@/constants/enums"; +import {ValueType} from "@/constants/enums"; import {isNullOrWhiteSpace} from "@/utils/stringUtils"; // ------------------------------------------------------------------------------------------------------------- @@ -32,6 +32,15 @@ export const NumberGeneratorDefaultOptions: NumberGeneratorOptions = { max: 9999, } +const kindToValueTypeMap = { + [NumberGeneratorKind.INTEGER]: ValueType.INT, + [NumberGeneratorKind.BINARY]: ValueType.INT, + [NumberGeneratorKind.HEX]: ValueType.STRING, + [NumberGeneratorKind.BIGINT]: ValueType.BIGINT, + [NumberGeneratorKind.FLOAT]: ValueType.DOUBLE, + [NumberGeneratorKind.OCTAL]: ValueType.STRING, +}; + // ------------------------------------------------------------------------------------------------------------- // generate method @@ -63,7 +72,6 @@ export const generate = (options): GenerateResult => { return { value: result, stringValue: result.toString(), - type: kind === NumberGeneratorKind.BINARY || kind === NumberGeneratorKind.OCTAL || kind === NumberGeneratorKind.HEX ? ExportValueType.STRING : ExportValueType.NUMBER }; } @@ -71,14 +79,12 @@ export const generate = (options): GenerateResult => { // options component export const NumberGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { - const {options, onOptionsChange} = props; - const numberOptions: NumberGeneratorOptions = options; - const intl = useIntl(); + const {options, handleOptionValueChange} = props as { + options: NumberGeneratorOptions, + handleOptionValueChange: typeof props.handleOptionValueChange + }; - const handleOptionsChange = (changedFieldName: string, value: any) => { - let newOptions = {...numberOptions, [changedFieldName]: value}; - onOptionsChange(newOptions); - } + const intl = useIntl(); // error validation const [errorMessages, setErrorMessages] = React.useState({ @@ -89,57 +95,69 @@ export const NumberGeneratorOptionsComponent: React.FunctionComponent { const newErrorMessages = {...errorMessages}; // min - if (isNullOrWhiteSpace(numberOptions.min.toString())) { + if (isNullOrWhiteSpace(options.min.toString())) { newErrorMessages.min = intl.formatMessage({id: 'dataType.number.min.errorMessage.empty'}) - } else if (numberOptions.min > numberOptions.max) { + } else if (options.min > options.max) { newErrorMessages.min = intl.formatMessage({id: 'dataType.number.min.errorMessage.greaterThanMax'}) } else { newErrorMessages.min = ''; } // max - if (isNullOrWhiteSpace(numberOptions.max.toString())) { + if (isNullOrWhiteSpace(options.max.toString())) { newErrorMessages.max = intl.formatMessage({id: 'dataType.number.max.errorMessage.empty'}) - } else if (numberOptions.max < numberOptions.min) { + } else if (options.max < options.min) { newErrorMessages.max = intl.formatMessage({id: 'dataType.number.max.errorMessage.lessThanMin'}) } else { newErrorMessages.max = ''; } setErrorMessages(newErrorMessages); - }, [numberOptions.min, numberOptions.max]); + }, [options.min, options.max]); + + + const handleKindChange = (kind: NumberGeneratorKind) => { + const valueType = kindToValueTypeMap[kind]; + if (valueType) { + handleOptionValueChange("kind", kind, valueType); + } + }; return ( <> } selectOptions={kindSelectOptions} - value={numberOptions.kind} - onChange={(v) => handleOptionsChange('kind', v)} + value={options.kind} + onChange={(v) => handleKindChange(v)} style={{width: '100px'}} /> - {numberOptions.kind === NumberGeneratorKind.FLOAT && } selectOptions={precisionSelectOptions} - value={numberOptions.precision} - onChange={(v) => handleOptionsChange('precision', v)} + value={options.precision} + onChange={(v) => handleOptionValueChange('precision', v)} />}
} - value={numberOptions.min} - onChange={(v) => handleOptionsChange('min', v)} + value={options.min} + onChange={(v) => handleOptionValueChange('min', v)} style={{width: '120px'}} errorMessage={errorMessages.min} + min={-2147483647} + max={2147483647} /> } - value={numberOptions.max} - onChange={(v) => handleOptionsChange('max', v)} + value={options.max} + onChange={(v) => handleOptionValueChange('max', v)} style={{width: '120px'}} errorMessage={errorMessages.max} + max={2147483647} + min={-2147483647} />
diff --git a/src/core/generators/Number/index.ts b/src/core/generators/Number/index.ts index 0acd931..d4e0ed8 100644 --- a/src/core/generators/Number/index.ts +++ b/src/core/generators/Number/index.ts @@ -1,6 +1,10 @@ import {Generator} from "@/types/generator"; -import {DataType, DataTypeCategory} from "@/constants/enums"; -import {NumberGeneratorOptionsComponent, NumberGeneratorDefaultOptions, generate} from "@/core/generators/Number/Number"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; +import { + generate, + NumberGeneratorDefaultOptions, + NumberGeneratorOptionsComponent +} from "@/core/generators/Number/Number"; export const NumberGenerator: Generator = { @@ -9,5 +13,6 @@ export const NumberGenerator: Generator = { generate: generate, optionsComponent: NumberGeneratorOptionsComponent, defaultOptions: NumberGeneratorDefaultOptions, + defaultValueType: ValueType.INT, exampleLines: ["0.2, 1000, 1234", "10110101, af17", "431433n, 0x1234"] } \ No newline at end of file diff --git a/src/core/generators/PersonTitle/PersonTitle.tsx b/src/core/generators/PersonTitle/PersonTitle.tsx index 74e6e7d..31a9048 100644 --- a/src/core/generators/PersonTitle/PersonTitle.tsx +++ b/src/core/generators/PersonTitle/PersonTitle.tsx @@ -1,6 +1,6 @@ import React from "react"; import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; -import {ExportValueType, Sex} from "@/constants/enums"; +import {Sex} from "@/constants/enums"; import {faker} from "@faker-js/faker"; import {OptionsSelect} from "@/components/Utils"; import {FormattedMessage} from "@/locale"; @@ -14,7 +14,7 @@ export interface PersonTitleGeneratorOptions { // ------------------------------------------------------------------------------------------------------------- // default options -export const PersonTitleGeneratorDefaultOptions:PersonTitleGeneratorOptions = { +export const PersonTitleGeneratorDefaultOptions: PersonTitleGeneratorOptions = { sex: Sex.ALL } @@ -22,7 +22,7 @@ export const PersonTitleGeneratorDefaultOptions:PersonTitleGeneratorOptions = { // generate method export const generate = (options: any): GenerateResult => { let config = null; - if(options.sex !== Sex.ALL ){ + if (options.sex !== Sex.ALL) { config = options.sex; } @@ -31,21 +31,17 @@ export const generate = (options: any): GenerateResult => { return { value: value, stringValue: value, - type: ExportValueType.STRING }; } // ------------------------------------------------------------------------------------------------------------- // options component export const PersonTitleGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { - const {options, onOptionsChange} = props; - - const handleOptionsChange = (changedFieldName: string, value: any) => { - let newOptions = {...options, [changedFieldName]: value}; - onOptionsChange(newOptions); + const {options, handleOptionValueChange} = props as { + options: PersonTitleGeneratorOptions, + handleOptionValueChange: typeof props.handleOptionValueChange }; - - // TODO: implement your own options component here + return ( <> handleOptionsChange("sex", v)}/> + onChange={(v) => handleOptionValueChange("sex", v)}/> ); } \ No newline at end of file diff --git a/src/core/generators/PersonTitle/index.ts b/src/core/generators/PersonTitle/index.ts index 8c8e92c..1b1aa73 100644 --- a/src/core/generators/PersonTitle/index.ts +++ b/src/core/generators/PersonTitle/index.ts @@ -1,6 +1,6 @@ import {Generator} from "@/types/generator"; -import {DataType, DataTypeCategory} from "@/constants/enums"; -import {PersonTitleGeneratorDefaultOptions, PersonTitleGeneratorOptionsComponent, generate} from "./PersonTitle"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; +import {generate, PersonTitleGeneratorDefaultOptions, PersonTitleGeneratorOptionsComponent} from "./PersonTitle"; export const PersonTitleGenerator: Generator = { type: DataType.PERSONTITLE, @@ -8,6 +8,7 @@ export const PersonTitleGenerator: Generator = { generate: generate, optionsComponent: PersonTitleGeneratorOptionsComponent, defaultOptions: PersonTitleGeneratorDefaultOptions, + defaultValueType: ValueType.STRING, exampleLines: ["Miss", "Mr.", "Dr."] } \ No newline at end of file diff --git a/src/core/generators/Phone/Phone.tsx b/src/core/generators/Phone/Phone.tsx index cd2d041..5fabecb 100644 --- a/src/core/generators/Phone/Phone.tsx +++ b/src/core/generators/Phone/Phone.tsx @@ -1,6 +1,5 @@ import React from "react"; import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; -import {ExportValueType} from "@/constants/enums"; import {faker} from "@faker-js/faker"; import {FormattedMessage} from "@/locale"; import {OptionsTagInput} from "@/components/Utils/src/OptionsTagInput"; @@ -27,29 +26,25 @@ export const generate = (options: PhoneGeneratorOptions): GenerateResult => { const value = faker.phone.number(format); return { value: value, - stringValue: value, - type: ExportValueType.STRING + stringValue: value }; } // ------------------------------------------------------------------------------------------------------------- // options component export const PhoneGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { - const {options, onOptionsChange} = props; - - const handleOptionsChange = (changedFieldName: string, value: any) => { - let newOptions = {...options, [changedFieldName]: value}; - onOptionsChange(newOptions); + const {options, handleOptionValueChange} = props as { + options: PhoneGeneratorOptions, + handleOptionValueChange: typeof props.handleOptionValueChange }; - // TODO: implement your own options component here return (
} infoTooltip={} value={options.formats} - onChange={(v) => handleOptionsChange("formats", v)} + onChange={(v) => handleOptionValueChange("formats", v)} style={{width: '350px'}} />
diff --git a/src/core/generators/Phone/index.ts b/src/core/generators/Phone/index.ts index bb1769a..081d6c2 100644 --- a/src/core/generators/Phone/index.ts +++ b/src/core/generators/Phone/index.ts @@ -1,6 +1,6 @@ import {Generator} from "@/types/generator"; -import {DataType, DataTypeCategory} from "@/constants/enums"; -import {PhoneGeneratorDefaultOptions, PhoneGeneratorOptionsComponent, generate} from "./Phone"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; +import {generate, PhoneGeneratorDefaultOptions, PhoneGeneratorOptionsComponent} from "./Phone"; export const PhoneGenerator: Generator = { type: DataType.PHONE, @@ -8,6 +8,7 @@ export const PhoneGenerator: Generator = { generate: generate, optionsComponent: PhoneGeneratorOptionsComponent, defaultOptions: PhoneGeneratorDefaultOptions, + defaultValueType: ValueType.STRING, exampleLines: ["+1-493-854-638", "(555) 750-8477", "(+64) 022-958-4397"] } \ No newline at end of file diff --git a/src/core/generators/Sex/Sex.tsx b/src/core/generators/Sex/Sex.tsx index 9d3cd5a..fe1e80a 100644 --- a/src/core/generators/Sex/Sex.tsx +++ b/src/core/generators/Sex/Sex.tsx @@ -1,6 +1,5 @@ import React from "react"; import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; -import {ExportValueType} from "@/constants/enums"; import {faker} from "@faker-js/faker"; // ------------------------------------------------------------------------------------------------------------- @@ -22,14 +21,11 @@ export const generate = (options: any): GenerateResult => { return { value: value, stringValue: value, - type: ExportValueType.STRING } } // ------------------------------------------------------------------------------------------------------------- // options component export const SexGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { - const {options, onOptionsChange} = props; - // TODO: implement your own options component here return null; } \ No newline at end of file diff --git a/src/core/generators/Sex/index.ts b/src/core/generators/Sex/index.ts index fa546f6..fe3a8da 100644 --- a/src/core/generators/Sex/index.ts +++ b/src/core/generators/Sex/index.ts @@ -1,12 +1,13 @@ import {Generator} from "@/types/generator"; -import {DataType, DataTypeCategory} from "@/constants/enums"; -import {SexGeneratorDefaultOptions, SexGeneratorOptionsComponent, generate} from "./Sex"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; +import {generate, SexGeneratorDefaultOptions} from "./Sex"; export const SexGenerator: Generator = { type: DataType.SEX, category: DataTypeCategory.PERSON, generate: generate, defaultOptions: SexGeneratorDefaultOptions, + defaultValueType: ValueType.STRING, exampleLines: ['male', 'female'] } \ No newline at end of file diff --git a/src/locale/translations/en.ts b/src/locale/translations/en.ts index 1c31a14..c249da4 100644 --- a/src/locale/translations/en.ts +++ b/src/locale/translations/en.ts @@ -9,7 +9,7 @@ export const en = { "export.category.programmingLanguages": "Programming languages", // export format modal - "export.configurator.modal.title": "Export Format", + "export.configurator.modal.title": "Generation Format", "export.configurator.modal.confirmButton.text": "Confirm", "export.configurator.config.label": "Configurations", "export.configurator.config.empty": "Configuration of this export format is currently not available.", @@ -18,7 +18,7 @@ export const en = { "export.modal.title": "Batch Generate", "export.modal.exportNumOfRows.label": "Rows to generate", "export.modal.exportNumOfRows.empty": "Rows to generate cannot be empty", - "export.modal.exportFormat.label": "Export format", + "export.modal.exportFormat.label": "Format", "export.modal.estimatedSize.label": "Estimated size", "export.modal.estimatedTime.label": "Estimated time", "export.modal.exportFileName.label": "File name", @@ -54,17 +54,31 @@ export const en = { "export.configurator.javascript.format": "Format", "export.configurator.javascript.format.variable": "Variable", "export.configurator.javascript.format.export": "Export", - "export.configurator.javascript.varName": "Variable Name", + "export.configurator.javascript.varName": "Variable name", "export.configurator.javascript.varName.required": "Variable name cannot be empty", "export.configurator.javascript.declarationKeyword": "Declaration Keyword", "export.configurator.javascript.module": "Module", + // sql + "export.configurator.sql.type": "Database type", + "export.configurator.sql.tableName": "Table name", + "export.configurator.sql.tableName.required": "Table name cannot be empty", + "export.configurator.sql.statement": "SQL statement", + "export.configurator.sql.batchSize": "Batch size", + "export.configurator.sql.includeDropTable": "Include `DROP TABLE`", + "export.configurator.sql.includeCreateTable": "Include `CREATE TABLE`", + "export.configurator.sql.includePrimaryKey": "Include primary key", + "export.configurator.sql.primaryKeyColumnName": "Primary key column", + // ------------------------------------------------------------------------------------------------------------- // data types + // color "dataType.color": "Color", + "dataType.color.kind.label": "Kind", "dataType.color.format.label": "Format", + "dataType.color.format.humanWord":"Human Word", // phone "dataType.phone": "Phone Number", diff --git a/src/locale/translations/jaJP.ts b/src/locale/translations/jaJP.ts index 6dc6617..b217c5f 100644 --- a/src/locale/translations/jaJP.ts +++ b/src/locale/translations/jaJP.ts @@ -22,7 +22,7 @@ export const jaJP = { // ------------------------------------------------------------------------------------------------------------- // data types - + // color "dataType.color": "Color", diff --git a/src/locale/translations/zhCN.ts b/src/locale/translations/zhCN.ts index b916c1c..4f1e6da 100644 --- a/src/locale/translations/zhCN.ts +++ b/src/locale/translations/zhCN.ts @@ -8,7 +8,7 @@ export const zhCN = { "export.category.programmingLanguages": "编程语言", // export format modal - "export.configurator.modal.title": "导出格式", + "export.configurator.modal.title": "生成格式", "export.configurator.modal.confirmButton.text": "确认", "export.configurator.config.label": "配置", "export.configurator.config.empty": "该输出格式的配置暂时还不可用", @@ -59,9 +59,11 @@ export const zhCN = { // ------------------------------------------------------------------------------------------------------------- // data types - + // color "dataType.color": "颜色", + "dataType.color.kind.label": "类型", + "dataType.color.format.humanWord":"词语", "dataType.color.format.label": "格式", // phone diff --git a/src/reducers/workspace/workspaceActions.ts b/src/reducers/workspace/workspaceActions.ts index 211e7a8..ab4e232 100644 --- a/src/reducers/workspace/workspaceActions.ts +++ b/src/reducers/workspace/workspaceActions.ts @@ -18,10 +18,10 @@ import { UPDATE_DATA_FIELD, UPDATE_DATA_FIELD_NAME } from "@/constants/actions"; -import {DataType, ExportFormat, PanelsOrientation} from "@/constants/enums"; +import {DataType, ExportFormat, PanelsOrientation, ValueType} from "@/constants/enums"; import {DataField} from "@/types/generator"; import {UUID} from "uuidjs"; -import {getGeneratorDefaultOptionsByDataType} from "@/utils/generatorUtils"; +import {getGeneratorDefaultOptionsByDataType, getGeneratorDefaultValueTypeByDataType} from "@/utils/generatorUtils"; import {getFormatterByFormat} from "@/utils/formatterUtils"; @@ -61,6 +61,7 @@ export const doAddNewDataField = (): any => const field: DataField = { isDraft: true, emptyRate: 0, + valueType: ValueType.STRING } const id = UUID.generate(); dispatch({type: ADD_NEW_DATA_FIELD, payload: {id: id, field: field}}); @@ -98,7 +99,8 @@ export const doSortDataFields = (sortableIdsList: string[]): any => export const doChangeDataType = (id: string, dataType: DataType): any => async dispatch => { const defaultOptions = getGeneratorDefaultOptionsByDataType(dataType); - dispatch({type: CHANGE_DATA_TYPE, payload: {id: id, dataType: dataType, options: defaultOptions}}); + const defaultValueType = getGeneratorDefaultValueTypeByDataType(dataType); + dispatch({type: CHANGE_DATA_TYPE, payload: {id: id, dataType: dataType, valueType:defaultValueType, options: defaultOptions}}); dispatch(doGenerateSpecificFieldPreviewData(id)); }; diff --git a/src/reducers/workspace/workspaceReducer.ts b/src/reducers/workspace/workspaceReducer.ts index a1a4319..0017996 100644 --- a/src/reducers/workspace/workspaceReducer.ts +++ b/src/reducers/workspace/workspaceReducer.ts @@ -131,11 +131,12 @@ const workspaceReducer = (state: WorkspaceReducerState = initStates, action: Act dataFieldsSortableIdsList: action.payload, }; case CHANGE_DATA_TYPE: - const {id, dataType, options} = action.payload; + const {id, dataType, valueType, options} = action.payload; const field = { ...state.dataFields[id], isDraft: false, dataType, + valueType, dataTypeOptions: options }; diff --git a/src/types/generator.d.ts b/src/types/generator.d.ts index 3e38786..c2b0cc2 100644 --- a/src/types/generator.d.ts +++ b/src/types/generator.d.ts @@ -1,8 +1,9 @@ -import {DataType, DataTypeCategory, ExportValueType} from "@/constants/enums"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; import React from "react"; export interface DataField { isDraft: boolean; + valueType: ValueType; fieldName?: string; dataType?: DataType; dataTypeOptions?: any; @@ -16,7 +17,8 @@ export interface DataFieldList { export interface Generator { type: DataType; category: DataTypeCategory; - generate: (options:any) => any; + generate: (options: any) => any; + defaultValueType: ValueType; exampleLines?: string[]; optionsComponent?: React.FunctionComponent; defaultOptions?: any; @@ -25,7 +27,7 @@ export interface Generator { export interface GeneratorOptionsComponentInterface { options: any; - onOptionsChange: (config: any) => void; + handleOptionValueChange: (fieldName: string, value: any, valueType?: ValueType) => void; } export interface GenerateRequest { @@ -35,7 +37,6 @@ export interface GenerateRequest { export interface GenerateResult { value: any; stringValue: string; - type: ExportValueType } export interface GenerateDataBatchCompletedCallbackResponse { diff --git a/src/utils/devUtils.ts b/src/utils/devUtils.ts new file mode 100644 index 0000000..f235b64 --- /dev/null +++ b/src/utils/devUtils.ts @@ -0,0 +1 @@ +export const inDevEnvironment = !!process && process.env.NODE_ENV === 'development'; \ No newline at end of file diff --git a/src/utils/formatterUtils.ts b/src/utils/formatterUtils.ts index 1ad7a88..17992b8 100644 --- a/src/utils/formatterUtils.ts +++ b/src/utils/formatterUtils.ts @@ -54,6 +54,8 @@ export const getCodemirrorLanguagePluginByFormat = (format: ExportFormat): any = return langs.spreadsheet(); case ExportFormat.JAVA_SCRIPT: return langs.javascript(); + case ExportFormat.SQL: + return langs.sql(); default: return langs.mathematica(); } diff --git a/src/utils/generatorUtils.ts b/src/utils/generatorUtils.ts index 3125ccc..c0292f5 100644 --- a/src/utils/generatorUtils.ts +++ b/src/utils/generatorUtils.ts @@ -6,7 +6,7 @@ import { Generator, GeneratorOptionsComponentInterface } from "@/types/generator"; -import {DataType, DataTypeCategory, ExportValueType} from "@/constants/enums"; +import {DataType, DataTypeCategory} from "@/constants/enums"; import React from "react"; // Generate data @@ -109,12 +109,17 @@ export const getGeneratorDefaultOptionsByDataType = (dataType: DataType): any => return generators[dataType].defaultOptions; } +// Get generator default value type by data type +export const getGeneratorDefaultValueTypeByDataType = (dataType: DataType): any => { + console.log(generators[dataType].defaultValueType); + return generators[dataType].defaultValueType; +} + // Get empty data row export const getEmptyDataRow = (): GenerateResult => { return { value: null, - stringValue: null, - type: ExportValueType.NULL + stringValue: null } } diff --git a/src/utils/typeUtils.ts b/src/utils/typeUtils.ts index 8b29cf6..b6f247c 100644 --- a/src/utils/typeUtils.ts +++ b/src/utils/typeUtils.ts @@ -8,4 +8,9 @@ export const calculateByteSize = (str: string) => { const encoder = new TextEncoder(); const encodedData = encoder.encode(str); return encodedData.length; +} + +// check variable has value +export function hasValue(variable: any): boolean { + return variable !== null && variable !== undefined; } \ No newline at end of file From 99995e2e0d5cefd91f0988d847065b5558e6e923 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Thu, 7 Mar 2024 13:41:39 +1300 Subject: [PATCH 51/60] feat: add AccountName & AccountNumber generators --- scripts/addNewFormatter.ts | 12 ++-- scripts/addNewGenerator.ts | 16 ++--- .../src/components/DataFieldsListItem.tsx | 1 - .../src/components/DataTypeOptionsModal.tsx | 24 +++---- src/constants/enums.ts | 2 + src/core/formatters/Sql/Sql.tsx | 2 +- .../generators/AccountName/AccountName.tsx | 33 +++++++++ src/core/generators/AccountName/index.ts | 13 ++++ .../AccountNumber/AccountNumber.tsx | 69 +++++++++++++++++++ src/core/generators/AccountNumber/index.ts | 14 ++++ src/core/generators/index.ts | 4 ++ src/locale/translations/en.ts | 10 +++ src/locale/translations/jaJP.ts | 8 +++ src/locale/translations/zhCN.ts | 10 +++ src/reducers/mock.ts | 12 +--- 15 files changed, 186 insertions(+), 44 deletions(-) create mode 100644 src/core/generators/AccountName/AccountName.tsx create mode 100644 src/core/generators/AccountName/index.ts create mode 100644 src/core/generators/AccountNumber/AccountNumber.tsx create mode 100644 src/core/generators/AccountNumber/index.ts diff --git a/scripts/addNewFormatter.ts b/scripts/addNewFormatter.ts index edbe40f..23c6e12 100644 --- a/scripts/addNewFormatter.ts +++ b/scripts/addNewFormatter.ts @@ -46,16 +46,16 @@ const createFormatter = (formatterName: string, fileExtension: string) => { }); } -rl.question('💥 Please enter the name of the new formatter: ', (generatorName: string) => { +rl.question('💥 Please enter the name of the new formatter: ', (formatterName: string) => { const folderPath = `./src/core/generators`; - generatorName = formatFolderName(generatorName); - if (checkIfFormatExists(generatorName)) { + formatterName = formatFolderName(formatterName); + if (checkIfFormatExists(formatterName)) { rl.close(); return; } - rl.question('➡️ Please enter the file extension for the formatter: ',(fileExtension: string) => { - createFormatter(generatorName, fileExtension); + rl.question('➡️ Please enter the file extension for the formatter: ', (fileExtension: string) => { + createFormatter(formatterName , fileExtension); }); }); @@ -87,8 +87,6 @@ const addFormatterToIndex = (formatterName: string) => { const writeFormatterTsxFile = (formatterName: string) => { return `import React from "react"; import {FormatRequest, FormatterConfigComponentInterface} from "@/types/formatter"; -import {ExportValueType} from "@/constants/enums"; - // ------------------------------------------------------------------------------------------------------------- // types diff --git a/scripts/addNewGenerator.ts b/scripts/addNewGenerator.ts index bc14639..e81710c 100644 --- a/scripts/addNewGenerator.ts +++ b/scripts/addNewGenerator.ts @@ -91,7 +91,6 @@ const addGeneratorToIndex = (generatorName: string) => { const writeGeneratorTsxFile = (generatorName: string) => { return `import React from "react"; import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; -import {ExportValueType} from "@/constants/enums"; // ------------------------------------------------------------------------------------------------------------- // types @@ -112,19 +111,16 @@ export const generate = (options: any): GenerateResult => { return { value: 'NOT IMPLEMENTED', - stringValue: 'NOT IMPLEMENTED', - type: ExportValueType.STRING + stringValue: 'NOT IMPLEMENTED' }; } // ------------------------------------------------------------------------------------------------------------- // options component export const ${generatorName}GeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { - const {options, onOptionsChange} = props; - - const handleOptionsChange = (changedFieldName: string, value: any) => { - let newOptions = {...options, [changedFieldName]: value}; - onOptionsChange(newOptions); + const {options, handleOptionValueChange} = props as { + options: ${generatorName}GeneratorOptions, + handleOptionValueChange: typeof props.handleOptionValueChange }; // TODO: implement your own options component here @@ -138,7 +134,7 @@ export const ${generatorName}GeneratorOptionsComponent: React.FunctionComponent< const writeGeneratorIndexFile = (generatorName: string, category: string) => { return `import {Generator} from "@/types/generator"; -import {DataType, DataTypeCategory} from "@/constants/enums"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; import {${generatorName}GeneratorDefaultOptions, ${generatorName}GeneratorOptionsComponent, generate} from "./${generatorName}"; export const ${generatorName}Generator: Generator = { @@ -147,8 +143,8 @@ export const ${generatorName}Generator: Generator = { generate: generate, optionsComponent: ${generatorName}GeneratorOptionsComponent, defaultOptions: ${generatorName}GeneratorDefaultOptions, + defaultValueType: ValueType.STRING, exampleLines: ["NOT IMPLEMENTED", "NOT IMPLEMENTED", "NOT IMPLEMENTED"] } `; - } \ No newline at end of file diff --git a/src/components/InputPanel/src/components/DataFieldsListItem.tsx b/src/components/InputPanel/src/components/DataFieldsListItem.tsx index 6330742..c45d021 100644 --- a/src/components/InputPanel/src/components/DataFieldsListItem.tsx +++ b/src/components/InputPanel/src/components/DataFieldsListItem.tsx @@ -53,7 +53,6 @@ export const DataFieldsListItem: React.FunctionComponent : null; + handleOptionValueChange={handleOptionValueChange}/> : null; }; // actions - const handleDataFieldOptionsChange = (options) => { - const newDataField = { - ...dataField, - dataTypeOptions: options - }; - dispatch(doUpdateDataField(dataFieldId, newDataField)); - } - - const handleDataFieldValueTypeChange = (valueType: ValueType) =>{ - const newDataField = { - ...dataField, - valueType:valueType + const handleOptionValueChange = (fieldName: string, value: any, valueType?: ValueType) => { + let field = {...dataField, dataTypeOptions: {...dataField.dataTypeOptions, [fieldName]: value}}; + if (hasValue(valueType)) { + field.valueType = valueType; } - dispatch(doUpdateDataField(dataFieldId, newDataField)); - } + dispatch(doUpdateDataField(dataFieldId, field)); + }; const handleEmptyRateChange = (value) => { const newDataField = { diff --git a/src/constants/enums.ts b/src/constants/enums.ts index b36d537..991eda3 100644 --- a/src/constants/enums.ts +++ b/src/constants/enums.ts @@ -43,6 +43,8 @@ export enum DataTypeCategory { } export enum DataType { + ACCOUNTNUMBER = "accountnumber", + ACCOUNTNAME = "accountname", COLOR = "color", PHONE = "phone", EMOJI = "emoji", diff --git a/src/core/formatters/Sql/Sql.tsx b/src/core/formatters/Sql/Sql.tsx index 0419980..591cd6d 100644 --- a/src/core/formatters/Sql/Sql.tsx +++ b/src/core/formatters/Sql/Sql.tsx @@ -5,7 +5,7 @@ import {FormattedMessage, useIntl} from "@/locale"; import {isNullOrWhiteSpace} from "@/utils/stringUtils"; import {OptionsSwitch} from "@/components/Utils/src/OptionsSwitch"; import {Divider} from "@douyinfe/semi-ui"; -import {DataField, GenerateResult} from "@/types/generator"; +import {DataField} from "@/types/generator"; import {ValueType} from "@/constants/enums"; diff --git a/src/core/generators/AccountName/AccountName.tsx b/src/core/generators/AccountName/AccountName.tsx new file mode 100644 index 0000000..17ea3b2 --- /dev/null +++ b/src/core/generators/AccountName/AccountName.tsx @@ -0,0 +1,33 @@ +import React from "react"; +import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; +import {faker} from "@faker-js/faker"; + +// ------------------------------------------------------------------------------------------------------------- +// types +export interface AccountNameGeneratorOptions { + // TODO: add your own option types here +} + +// ------------------------------------------------------------------------------------------------------------- +// default options +export const AccountNameGeneratorDefaultOptions:AccountNameGeneratorOptions = { + // TODO: add your own default options here +} + +// ------------------------------------------------------------------------------------------------------------- +// generate method +export const generate = (options: any): GenerateResult => { + + const value = faker.finance.accountName(); + + return { + value: value, + stringValue: value + }; +} + +// ------------------------------------------------------------------------------------------------------------- +// options component +export const AccountNameGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { + return null; +} \ No newline at end of file diff --git a/src/core/generators/AccountName/index.ts b/src/core/generators/AccountName/index.ts new file mode 100644 index 0000000..48c0d59 --- /dev/null +++ b/src/core/generators/AccountName/index.ts @@ -0,0 +1,13 @@ +import {Generator} from "@/types/generator"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; +import {AccountNameGeneratorDefaultOptions, generate} from "./AccountName"; + +export const AccountNameGenerator: Generator = { + type: DataType.ACCOUNTNAME, + category: DataTypeCategory.COMMERCE, + generate: generate, + defaultOptions: AccountNameGeneratorDefaultOptions, + defaultValueType: ValueType.STRING, + exampleLines: ["Savings Account", "Home Loan Account", "Investment Account"] +} + \ No newline at end of file diff --git a/src/core/generators/AccountNumber/AccountNumber.tsx b/src/core/generators/AccountNumber/AccountNumber.tsx new file mode 100644 index 0000000..0f51252 --- /dev/null +++ b/src/core/generators/AccountNumber/AccountNumber.tsx @@ -0,0 +1,69 @@ +import React from "react"; +import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; +import {OptionsNumberInput} from "@/components/Utils"; +import {FormattedMessage, useIntl} from "@/locale"; +import {faker} from "@faker-js/faker"; +import {isNullOrWhiteSpace} from "@/utils/stringUtils"; + +// ------------------------------------------------------------------------------------------------------------- +// types +export interface AccountNumberGeneratorOptions { + length: number +} + +// ------------------------------------------------------------------------------------------------------------- +// default options +export const AccountNumberGeneratorDefaultOptions: AccountNumberGeneratorOptions = { + length: 12 +} + +// ------------------------------------------------------------------------------------------------------------- +// generate method +export const generate = (options: any): GenerateResult => { + const {length} = options + + const value = faker.finance.accountNumber(length); + return { + value: value, + stringValue: value + }; +} + +// ------------------------------------------------------------------------------------------------------------- +// options component +export const AccountNumberGeneratorOptionsComponent: React.FunctionComponent = ({...props}) => { + const {options, handleOptionValueChange} = props as { + options: AccountNumberGeneratorOptions, + handleOptionValueChange: typeof props.handleOptionValueChange + }; + + const intl = useIntl(); + + const [errorMessages, setErrorMessages] = React.useState({ + length: '' + }); + + React.useEffect(() => { + const newErrorMessages = {...errorMessages}; + // length + if (isNullOrWhiteSpace(options.length.toString())) { + newErrorMessages.length = intl.formatMessage({id: 'dataType.number.min.errorMessage.empty'}) + } + + setErrorMessages(newErrorMessages); + }, [options.length]); + + return ( +
+ } + value={options.length} + onChange={(v) => handleOptionValueChange('length', v)} + style={{width: '65px'}} + errorMessage={errorMessages.length} + max={20} + min={5} + /> +
+ ); +} \ No newline at end of file diff --git a/src/core/generators/AccountNumber/index.ts b/src/core/generators/AccountNumber/index.ts new file mode 100644 index 0000000..4afeebf --- /dev/null +++ b/src/core/generators/AccountNumber/index.ts @@ -0,0 +1,14 @@ +import {Generator} from "@/types/generator"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; +import {AccountNumberGeneratorDefaultOptions, AccountNumberGeneratorOptionsComponent, generate} from "./AccountNumber"; + +export const AccountNumberGenerator: Generator = { + type: DataType.ACCOUNTNUMBER, + category: DataTypeCategory.COMMERCE, + generate: generate, + optionsComponent: AccountNumberGeneratorOptionsComponent, + defaultOptions: AccountNumberGeneratorDefaultOptions, + defaultValueType: ValueType.STRING, + exampleLines: ["240073388677", "58712518", "817968195916"] +} + \ No newline at end of file diff --git a/src/core/generators/index.ts b/src/core/generators/index.ts index 018b24b..3dc13d4 100644 --- a/src/core/generators/index.ts +++ b/src/core/generators/index.ts @@ -1,3 +1,5 @@ +import {AccountNumberGenerator} from "@/core/generators/AccountNumber"; +import {AccountNameGenerator} from "@/core/generators/AccountName"; import {ColorGenerator} from "@/core/generators/Color"; import {PhoneGenerator} from "@/core/generators/Phone"; import {EmojiGenerator} from "@/core/generators/Emoji"; @@ -14,6 +16,8 @@ import {CompanyNameGenerator} from "@/core/generators/CompanyName"; import {DataType} from "@/constants/enums"; export const generators = { + [DataType.ACCOUNTNUMBER]: AccountNumberGenerator, + [DataType.ACCOUNTNAME]: AccountNameGenerator, [DataType.COLOR]: ColorGenerator, [DataType.PHONE]: PhoneGenerator, [DataType.EMOJI]: EmojiGenerator, diff --git a/src/locale/translations/en.ts b/src/locale/translations/en.ts index c249da4..b4155dd 100644 --- a/src/locale/translations/en.ts +++ b/src/locale/translations/en.ts @@ -74,6 +74,16 @@ export const en = { // data types + + + // accountnumber + "dataType.accountnumber": "Account Number", + "dataType.accountnumber.length": "Length", + "dataType.accountnumber.empty": "Length cannot be empty", + + // accountname + "dataType.accountname": "Account Name", + // color "dataType.color": "Color", "dataType.color.kind.label": "Kind", diff --git a/src/locale/translations/jaJP.ts b/src/locale/translations/jaJP.ts index b217c5f..c4a1763 100644 --- a/src/locale/translations/jaJP.ts +++ b/src/locale/translations/jaJP.ts @@ -23,6 +23,14 @@ export const jaJP = { // ------------------------------------------------------------------------------------------------------------- // data types + + + // accountnumber + "dataType.accountnumber": "AccountNumber", + + // accountname + "dataType.accountname": "AccountName", + // color "dataType.color": "Color", diff --git a/src/locale/translations/zhCN.ts b/src/locale/translations/zhCN.ts index 4f1e6da..4720194 100644 --- a/src/locale/translations/zhCN.ts +++ b/src/locale/translations/zhCN.ts @@ -60,6 +60,16 @@ export const zhCN = { // ------------------------------------------------------------------------------------------------------------- // data types + + + // accountnumber + "dataType.accountnumber": "银行账号", + "dataType.accountnumber.length": "长度", + "dataType.accountnumber.empty": "长度不能为空", + + // accountname + "dataType.accountname": "账户名", + // color "dataType.color": "颜色", "dataType.color.kind.label": "类型", diff --git a/src/reducers/mock.ts b/src/reducers/mock.ts index 14920cd..5b81167 100644 --- a/src/reducers/mock.ts +++ b/src/reducers/mock.ts @@ -1,5 +1,5 @@ -import {DataField, DataFieldList} from "@/types/generator"; -import {CollectionNodeType, DataType} from "@/constants/enums"; +import {DataFieldList} from "@/types/generator"; +import {CollectionNodeType, DataType, ValueType} from "@/constants/enums"; import {NumberGeneratorDefaultOptions} from "@/core/generators/Number/Number"; import {BooleanGeneratorDefaultOptions} from "@/core/generators/Boolean/Boolean"; import {SchemasCollection} from "@/types/system"; @@ -11,15 +11,9 @@ export const mockFields: DataFieldList = isDraft: false, dataType: DataType.NUMBER, dataTypeOptions: NumberGeneratorDefaultOptions, + valueType: ValueType.INT, emptyRate: 0, }, - "2": { - fieldName: 'boolean', - isDraft: false, - dataType: DataType.BOOLEAN, - dataTypeOptions: BooleanGeneratorDefaultOptions, - emptyRate: 0, - } }; export const mockCollections: SchemasCollection[] = From 967a2b106c4ac3435a7bf1037418a0d2599a3347 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Thu, 7 Mar 2024 15:44:45 +1300 Subject: [PATCH 52/60] chore: generator debugger --- .../DevTools/src/GenerateResultsPreviewer.tsx | 89 +++++++++++++++++++ .../DevTools/src/GeneratorDebugger.tsx | 59 ++++++++++-- src/utils/formatterUtils.ts | 5 ++ src/utils/generatorUtils.ts | 1 - 4 files changed, 144 insertions(+), 10 deletions(-) create mode 100644 src/components/DevTools/src/GenerateResultsPreviewer.tsx diff --git a/src/components/DevTools/src/GenerateResultsPreviewer.tsx b/src/components/DevTools/src/GenerateResultsPreviewer.tsx new file mode 100644 index 0000000..5d6ec12 --- /dev/null +++ b/src/components/DevTools/src/GenerateResultsPreviewer.tsx @@ -0,0 +1,89 @@ +import {DataFieldList} from "@/types/generator"; +import {ColorMode, ExportFormat} from "@/constants/enums"; +import React from "react"; +import {FormatRequest} from "@/types/formatter"; +import { + formatData, + getCodemirrorLanguagePluginByFormat, + getFormatterDefaultConfigByFormat +} from "@/utils/formatterUtils"; +import CodeMirror from "@uiw/react-codemirror"; +import {darkTheme, lightTheme} from "@/components/PreviewPanel/src/components/RawPreviewer/RawPreviewer.themes"; +import {EditorView} from "@codemirror/view"; +import {Card, Tag, Typography} from "@douyinfe/semi-ui"; +import {useSelector} from "react-redux"; +import {selectColorMode} from "@/reducers/app/appSelectors"; +import {Extension} from "@codemirror/state"; + +export interface GenerateResultsPreviewerProps { + values: any[]; + fields: DataFieldList; + sortedFieldIds: string[]; + formatType: ExportFormat; +} + +export const GenerateResultsPreviewer: React.FunctionComponent = ({...props}) => { + const {values, fields, sortedFieldIds, formatType} = props; + const {Text} = Typography; + // store + const colorMode = useSelector(selectColorMode); + + // state + const [previewData, setPreviewData] = React.useState(""); + const [codeMirrorExtensions, setCodeMirrorExtensions] = React.useState([]); + + React.useEffect(() => { + getPreviewData(values, fields, sortedFieldIds, formatType); + }, [values, fields, sortedFieldIds, formatType]); + + React.useEffect(() => { + const extensions: Extension[] = []; + extensions.push(getCodemirrorLanguagePluginByFormat(formatType)); + extensions.push(EditorView.lineWrapping); + setCodeMirrorExtensions(extensions); + }, [formatType]); + + // actions + const getPreviewData = (values: any[], fields: DataFieldList, sortedFieldIds: string[], formatType: ExportFormat) => { + try { + const formatRequest: FormatRequest = { + values: values, + fields: fields, + sortedFieldIds: sortedFieldIds, + format: formatType, + config: getFormatterDefaultConfigByFormat(formatType) + } + const data = formatData(formatRequest); + setPreviewData(data); + + } catch (err) { + setPreviewData(err.toString()) + } + } + + return ( +
+ + {formatType} + + +
+ ) +} \ No newline at end of file diff --git a/src/components/DevTools/src/GeneratorDebugger.tsx b/src/components/DevTools/src/GeneratorDebugger.tsx index d7f35cb..5dda66c 100644 --- a/src/components/DevTools/src/GeneratorDebugger.tsx +++ b/src/components/DevTools/src/GeneratorDebugger.tsx @@ -1,14 +1,22 @@ -import {DataField} from "@/types/generator"; +import {DataField, DataFieldList} from "@/types/generator"; import React from "react"; import {IconTerminal} from "@douyinfe/semi-icons"; -import {Button, Card, Descriptions, Modal, Tag, Typography} from "@douyinfe/semi-ui"; +import {Button, Card, Descriptions, Modal, Space, Tag, Typography} from "@douyinfe/semi-ui"; import CodeMirror from "@uiw/react-codemirror"; import {EditorView} from "@codemirror/view"; import {langs} from '@uiw/codemirror-extensions-langs'; import {darkTheme, lightTheme} from "@/components/PreviewPanel/src/components/RawPreviewer/RawPreviewer.themes"; -import {useSelector} from "react-redux"; +import {useDispatch, useSelector} from "react-redux"; import {selectColorMode} from "@/reducers/app/appSelectors"; -import {ColorMode} from "@/constants/enums"; +import {ColorMode, ExportFormat} from "@/constants/enums"; +import {doUpdateDataField} from "@/reducers/workspace/workspaceActions"; +import { + generateData, + getGeneratorDefaultOptionsByDataType, + getGeneratorDefaultValueTypeByDataType +} from "@/utils/generatorUtils"; +import {GenerateResultsPreviewer} from "@/components/DevTools/src/GenerateResultsPreviewer"; +import {formatters} from "@/core/formatters"; export interface GeneratorDebuggerProps { id: string; @@ -20,10 +28,25 @@ export const GeneratorDebugger: React.FunctionComponent const {id, dataField, renderDataTypeOptions} = props; const [isModalOpen, setIsModalOpen] = React.useState(false); const {Text} = Typography; + const dispatch = useDispatch(); + + // mock data + const dataFieldList: DataFieldList = {[id]: dataField} + const sortedFieldIds = [id] + const values = generateData(dataFieldList, sortedFieldIds, 3); // store const colorMode = useSelector(selectColorMode); + // actions + const handleResetGeneratorOptions = () => { + const defaultOptions = getGeneratorDefaultOptionsByDataType(dataField.dataType); + const defaultValueType = getGeneratorDefaultValueTypeByDataType(dataField.dataType); + let field = {...dataField, dataTypeOptions: defaultOptions, valueType: defaultValueType}; + dispatch(doUpdateDataField(id, field)); + } + + const handleOpen = () => { setIsModalOpen(true); } @@ -41,13 +64,16 @@ export const GeneratorDebugger: React.FunctionComponent icon={} /> - -
+ +
{id} {dataField.fieldName} + {dataField.isDraft ? "true" : "false"} @@ -66,7 +92,9 @@ export const GeneratorDebugger: React.FunctionComponent - {renderDataTypeOptions()} +
+ {renderDataTypeOptions()} +
@@ -86,11 +114,24 @@ export const GeneratorDebugger: React.FunctionComponent }} /> - + + + + + { + Object.entries(formatters).map(([format, FormatterComponent], index) => { + return + }) + } +
) -} \ No newline at end of file +} + diff --git a/src/utils/formatterUtils.ts b/src/utils/formatterUtils.ts index 17992b8..da455a1 100644 --- a/src/utils/formatterUtils.ts +++ b/src/utils/formatterUtils.ts @@ -33,6 +33,11 @@ export const getFormatterByFormat = (format: ExportFormat): Formatter => { return formatters[format]; } +// Get formatter default config by format +export const getFormatterDefaultConfigByFormat = (format: ExportFormat): any => { + return formatters[format].defaultConfig; +} + // Get formatter config component by format export const getFormatterConfigComponentByFormat = (format: ExportFormat): any => { return formatters[format].configComponent; diff --git a/src/utils/generatorUtils.ts b/src/utils/generatorUtils.ts index c0292f5..0942b53 100644 --- a/src/utils/generatorUtils.ts +++ b/src/utils/generatorUtils.ts @@ -111,7 +111,6 @@ export const getGeneratorDefaultOptionsByDataType = (dataType: DataType): any => // Get generator default value type by data type export const getGeneratorDefaultValueTypeByDataType = (dataType: DataType): any => { - console.log(generators[dataType].defaultValueType); return generators[dataType].defaultValueType; } From f3be12e9cdbb184265e95368e3e35ed178564111 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Thu, 7 Mar 2024 17:18:33 +1300 Subject: [PATCH 53/60] feat: adapt the SQL formatter to accommodate more types (#249) --- .../DevTools/src/GenerateResultsPreviewer.tsx | 15 +- .../DevTools/src/GeneratorDebugger.tsx | 2 +- src/constants/enums.ts | 1 - src/core/formatters/Sql/Sql.tsx | 140 +++++++++++++----- src/types/generator.d.ts | 4 - 5 files changed, 115 insertions(+), 47 deletions(-) diff --git a/src/components/DevTools/src/GenerateResultsPreviewer.tsx b/src/components/DevTools/src/GenerateResultsPreviewer.tsx index 5d6ec12..f75d3b9 100644 --- a/src/components/DevTools/src/GenerateResultsPreviewer.tsx +++ b/src/components/DevTools/src/GenerateResultsPreviewer.tsx @@ -10,7 +10,7 @@ import { import CodeMirror from "@uiw/react-codemirror"; import {darkTheme, lightTheme} from "@/components/PreviewPanel/src/components/RawPreviewer/RawPreviewer.themes"; import {EditorView} from "@codemirror/view"; -import {Card, Tag, Typography} from "@douyinfe/semi-ui"; +import {Card, Tag} from "@douyinfe/semi-ui"; import {useSelector} from "react-redux"; import {selectColorMode} from "@/reducers/app/appSelectors"; import {Extension} from "@codemirror/state"; @@ -24,7 +24,7 @@ export interface GenerateResultsPreviewerProps { export const GenerateResultsPreviewer: React.FunctionComponent = ({...props}) => { const {values, fields, sortedFieldIds, formatType} = props; - const {Text} = Typography; + // store const colorMode = useSelector(selectColorMode); @@ -46,6 +46,13 @@ export const GenerateResultsPreviewer: React.FunctionComponent { try { + let config = getFormatterDefaultConfigByFormat(formatType); + + if (formatType === ExportFormat.SQL) { + config.createTable = true; + config.primaryKey = false; + } + const formatRequest: FormatRequest = { values: values, fields: fields, @@ -63,8 +70,8 @@ export const GenerateResultsPreviewer: React.FunctionComponent - - {formatType} + + {formatType} // mock data const dataFieldList: DataFieldList = {[id]: dataField} const sortedFieldIds = [id] - const values = generateData(dataFieldList, sortedFieldIds, 3); + const values = generateData(dataFieldList, sortedFieldIds, 10); // store const colorMode = useSelector(selectColorMode); diff --git a/src/constants/enums.ts b/src/constants/enums.ts index 991eda3..040e19a 100644 --- a/src/constants/enums.ts +++ b/src/constants/enums.ts @@ -20,7 +20,6 @@ export enum ValueType { ONE_BIT = "1bit", INT = "integer", BIGINT = "bigint", - FLOAT = "float", DOUBLE = "double", BOOLEAN = "boolean", INT_LIST = "int_list", diff --git a/src/core/formatters/Sql/Sql.tsx b/src/core/formatters/Sql/Sql.tsx index 591cd6d..79e2cf4 100644 --- a/src/core/formatters/Sql/Sql.tsx +++ b/src/core/formatters/Sql/Sql.tsx @@ -22,6 +22,7 @@ export enum SqlType { SAPHANA = "SAPHANA" } + export type SqlFormatterConfig = { type: SqlType, tableName: string, @@ -48,10 +49,99 @@ export const defaultSqlFormatterConfig: SqlFormatterConfig = { // ------------------------------------------------------------------------------------------------------------- // format method +// Extend the addCreateTableColumn function to support different SQL dialects +const addCreateTableColumn = (field: DataField, sqlType: SqlType) => { + let fieldType = "VARCHAR(255)"; // Default data type + switch (field.valueType) { + case ValueType.INT: + fieldType = "INT"; + break; + case ValueType.DOUBLE: + fieldType = "DOUBLE(18,4)"; + break; + case ValueType.TEXT: + fieldType = (sqlType === SqlType.ORACLE || sqlType === SqlType.IBMDB2) ? "CLOB" : "TEXT"; + break; + case ValueType.ONE_BIT: + fieldType = "TINYINT(1)"; + break; + case ValueType.BOOLEAN: + fieldType = "TINYINT(1)"; + break; + case ValueType.BIGINT: + fieldType = "BIGINT"; + break; + default: + fieldType = "VARCHAR(255)"; + break; + } + + // Apply SQL type-specific modifications + switch (sqlType) { + case SqlType.ORACLE: + // Oracle-specific adaptations, e.g., use NUMBER instead of INT + if (fieldType === "INT") { + fieldType = "NUMBER"; + } else if (fieldType === "TINYINT(1)") { + fieldType = "NUMBER(1)"; + } + break; + case SqlType.POSTGRES: + // Postgres-specific adaptations, e.g., use BOOLEAN instead of TINYINT(1) + if (fieldType === "TINYINT(1)") { + fieldType = "BOOLEAN"; + } + break; + case SqlType.SQLITE: + // SQLite uses a more dynamic type system + if (fieldType === "TINYINT(1)") { + fieldType = "INTEGER"; + } + break; + // Add cases for other SQL types as necessary + } + + return ` ${field.fieldName} ${fieldType} DEFAULT NULL`; +}; + +const formatValueForSQL = (value: any, sqlType: SqlType): string => { + if (typeof value === 'string') { + // String values need to be enclosed in single quotes, and single quotes within the value escaped + return `'${value.replace(/'/g, "''")}'`; + } else if (typeof value === 'boolean') { + return (value ? "1" : "0"); + } else if (value === null) { + // Handle null values + return 'NULL'; + } + // Adapt this function for other data types and SQL dialects as needed + return value; +}; + +const generateInsertStatements = (sqlType: SqlType, tableName: string, sortedFieldIds: string[], values: any[], fields: { + [key: string]: any +}, batchSize: number): string => { + let inserts = ''; + for (let i = 0; i < values.length; i += batchSize) { + const batchValues = values.slice(i, i + batchSize); + inserts += `INSERT INTO ${tableName} (${sortedFieldIds.map(id => fields[id].fieldName).join(', ')}) VALUES\n`; + + batchValues.forEach((item, index) => { + const valueString = sortedFieldIds.map(id => { + let result = item[id]; // Assuming direct use of value; adapt as necessary + return formatValueForSQL(result.value, sqlType); // Apply formatting function + }).join(', '); + + inserts += ` (${valueString})${index < batchValues.length - 1 ? ',' : ';'}\n`; + }); + } + return inserts; +}; + +// Modify the format function to adapt to different SQL dialects export const format = (request: FormatRequest): string => { const {fields, values, config, sortedFieldIds} = request; const {type, tableName, batchSize, dropTable, createTable, primaryKey, primaryKeyColumnName} = config; - console.log(values) let sql = ''; @@ -68,10 +158,18 @@ export const format = (request: FormatRequest): string => { if (createTable) { sql += `CREATE TABLE ${tableName} (\n`; if (primaryKey) { - sql += ` ${primaryKeyColumnName} INT AUTO_INCREMENT PRIMARY KEY,\n`; + if (type === SqlType.ORACLE) { + sql += ` ${primaryKeyColumnName} NUMBER GENERATED ALWAYS AS IDENTITY PRIMARY KEY,\n`; + } else if (type === SqlType.POSTGRES) { + sql += ` ${primaryKeyColumnName} SERIAL PRIMARY KEY,\n`; + } else if (type === SqlType.SQLITE) { + sql += ` ${primaryKeyColumnName} INTEGER PRIMARY KEY AUTOINCREMENT,\n`; + } else { // Default, also covers MYSQL and others + sql += ` ${primaryKeyColumnName} INT AUTO_INCREMENT PRIMARY KEY,\n`; + } } sortedFieldIds.forEach((id, index) => { - sql += addCreateTableColumn(fields[id]) + sql += addCreateTableColumn(fields[id], type) // Pass SQL type to function sql += index < sortedFieldIds.length - 1 ? ',\n' : '\n'; }); sql += `);\n\n`; @@ -79,44 +177,12 @@ export const format = (request: FormatRequest): string => { // Insert data if (values.length > 0) { - for (let i = 0; i < values.length; i += batchSize) { - const batchValues = values.slice(i, i + batchSize); - sql += `INSERT INTO ${tableName} (`; - sql += sortedFieldIds.map(id => fields[id].fieldName).join(', '); - sql += `) VALUES \n`; - - batchValues.forEach((item, index) => { - const valueString = sortedFieldIds.map(id => { - const value = item[id].stringValue; // Assuming stringValue is the appropriate property for SQL value - return typeof value === 'string' ? `'${value.replace(/'/g, "''")}'` : value; // Handle string values and escape single quotes - }).join(', '); - sql += ` (${valueString})`; - sql += index < batchValues.length - 1 ? ',\n' : ';\n\n'; // End the line with a comma or a semicolon depending on the batch - }); - } + sql += generateInsertStatements(type, tableName, sortedFieldIds, values, fields, batchSize); } return sql; -} +}; -const addCreateTableColumn = (field: DataField) => { - let sql = ` ${field.fieldName} `; - switch (field.valueType) { - case ValueType.STRING: - sql += "VARCHAR(255) DEFAULT NULL" - return sql; - case ValueType.INT: - sql += "INT DEFAULT NULL" - return sql; - case ValueType.DOUBLE: - sql += "DOUBLE DEFAULT NULL" - return sql; - case ValueType.STRING_LIST: - sql += "VARCHAR(255) DEFAULT NULL" - default: - return sql; - } -} // ------------------------------------------------------------------------------------------------------------- // config component diff --git a/src/types/generator.d.ts b/src/types/generator.d.ts index c2b0cc2..f76d1a3 100644 --- a/src/types/generator.d.ts +++ b/src/types/generator.d.ts @@ -30,10 +30,6 @@ export interface GeneratorOptionsComponentInterface { handleOptionValueChange: (fieldName: string, value: any, valueType?: ValueType) => void; } -export interface GenerateRequest { - field: DataField; -} - export interface GenerateResult { value: any; stringValue: string; From e2de29300cb8e89ea9b845b6dc66329e422ce4c6 Mon Sep 17 00:00:00 2001 From: Hong Weng Date: Thu, 7 Mar 2024 18:54:12 +1300 Subject: [PATCH 54/60] feat: add DomainName generator --- src/constants/enums.ts | 1 + src/core/generators/DomainName/DomainName.tsx | 26 +++++++++++++++++++ src/core/generators/DomainName/index.ts | 11 ++++++++ src/core/generators/index.ts | 2 ++ src/locale/translations/en.ts | 4 +++ src/locale/translations/jaJP.ts | 4 +++ src/locale/translations/zhCN.ts | 4 +++ 7 files changed, 52 insertions(+) create mode 100644 src/core/generators/DomainName/DomainName.tsx create mode 100644 src/core/generators/DomainName/index.ts diff --git a/src/constants/enums.ts b/src/constants/enums.ts index 828f5bb..7857704 100644 --- a/src/constants/enums.ts +++ b/src/constants/enums.ts @@ -40,6 +40,7 @@ export enum DataTypeCategory { } export enum DataType { + DOMAINNAME = "domainname", COLOR = "color", PHONE = "phone", EMOJI = "emoji", diff --git a/src/core/generators/DomainName/DomainName.tsx b/src/core/generators/DomainName/DomainName.tsx new file mode 100644 index 0000000..9c980f6 --- /dev/null +++ b/src/core/generators/DomainName/DomainName.tsx @@ -0,0 +1,26 @@ +import React from "react"; +import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; +import {faker} from "@faker-js/faker"; +import {ExportValueType} from "@/constants/enums"; + +// ------------------------------------------------------------------------------------------------------------- +// types + +// no types for now +// ------------------------------------------------------------------------------------------------------------- + + +// ------------------------------------------------------------------------------------------------------------- +// generate method +export const generate = (options: any): GenerateResult => { + const value = faker.internet.domainName(); + + return { + value: value, + stringValue: value, + type: ExportValueType.STRING + }; +} + +// ------------------------------------------------------------------------------------------------------------- +// options component diff --git a/src/core/generators/DomainName/index.ts b/src/core/generators/DomainName/index.ts new file mode 100644 index 0000000..a275420 --- /dev/null +++ b/src/core/generators/DomainName/index.ts @@ -0,0 +1,11 @@ +import {Generator} from "@/types/generator"; +import {DataType, DataTypeCategory} from "@/constants/enums"; +import { generate} from "./DomainName"; + +export const DomainNameGenerator: Generator = { + type: DataType.DOMAINNAME, + category: DataTypeCategory.NETWORK, + generate: generate, + exampleLines: ["google.com", "wikipedia.org", "museum.info","aucklanduni.ac.nz","tech.startup.io"] +} + \ No newline at end of file diff --git a/src/core/generators/index.ts b/src/core/generators/index.ts index 018b24b..6563883 100644 --- a/src/core/generators/index.ts +++ b/src/core/generators/index.ts @@ -1,3 +1,4 @@ +import {DomainNameGenerator} from "@/core/generators/DomainName"; import {ColorGenerator} from "@/core/generators/Color"; import {PhoneGenerator} from "@/core/generators/Phone"; import {EmojiGenerator} from "@/core/generators/Emoji"; @@ -14,6 +15,7 @@ import {CompanyNameGenerator} from "@/core/generators/CompanyName"; import {DataType} from "@/constants/enums"; export const generators = { + [DataType.DOMAINNAME]: DomainNameGenerator, [DataType.COLOR]: ColorGenerator, [DataType.PHONE]: PhoneGenerator, [DataType.EMOJI]: EmojiGenerator, diff --git a/src/locale/translations/en.ts b/src/locale/translations/en.ts index 1c31a14..41697cd 100644 --- a/src/locale/translations/en.ts +++ b/src/locale/translations/en.ts @@ -62,6 +62,10 @@ export const en = { // ------------------------------------------------------------------------------------------------------------- // data types + + // domainname + "dataType.domainname": "DomainName", + // color "dataType.color": "Color", "dataType.color.format.label": "Format", diff --git a/src/locale/translations/jaJP.ts b/src/locale/translations/jaJP.ts index 6dc6617..4762bea 100644 --- a/src/locale/translations/jaJP.ts +++ b/src/locale/translations/jaJP.ts @@ -23,6 +23,10 @@ export const jaJP = { // ------------------------------------------------------------------------------------------------------------- // data types + + // domainname + "dataType.domainname": "DomainName", + // color "dataType.color": "Color", diff --git a/src/locale/translations/zhCN.ts b/src/locale/translations/zhCN.ts index b916c1c..38ce755 100644 --- a/src/locale/translations/zhCN.ts +++ b/src/locale/translations/zhCN.ts @@ -60,6 +60,10 @@ export const zhCN = { // ------------------------------------------------------------------------------------------------------------- // data types + + // domainname + "dataType.domainname": "DomainName", + // color "dataType.color": "颜色", "dataType.color.format.label": "格式", From 4c0919c7fc4b4a5a8e3880f3ff5dddb883cb86fa Mon Sep 17 00:00:00 2001 From: Hong Weng Date: Thu, 7 Mar 2024 19:24:46 +1300 Subject: [PATCH 55/60] feat: add DomainSuffix generator --- src/constants/enums.ts | 1 + .../generators/DomainSuffix/DomainSuffix.tsx | 22 +++++++++++++++++++ src/core/generators/DomainSuffix/index.ts | 11 ++++++++++ src/core/generators/index.ts | 2 ++ src/locale/translations/en.ts | 4 ++++ src/locale/translations/jaJP.ts | 4 ++++ src/locale/translations/zhCN.ts | 4 ++++ 7 files changed, 48 insertions(+) create mode 100644 src/core/generators/DomainSuffix/DomainSuffix.tsx create mode 100644 src/core/generators/DomainSuffix/index.ts diff --git a/src/constants/enums.ts b/src/constants/enums.ts index 7857704..bceba70 100644 --- a/src/constants/enums.ts +++ b/src/constants/enums.ts @@ -40,6 +40,7 @@ export enum DataTypeCategory { } export enum DataType { + DOMAINSUFFIX = "domainsuffix", DOMAINNAME = "domainname", COLOR = "color", PHONE = "phone", diff --git a/src/core/generators/DomainSuffix/DomainSuffix.tsx b/src/core/generators/DomainSuffix/DomainSuffix.tsx new file mode 100644 index 0000000..d4a94c6 --- /dev/null +++ b/src/core/generators/DomainSuffix/DomainSuffix.tsx @@ -0,0 +1,22 @@ +import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; +import {ExportValueType} from "@/constants/enums"; +import {faker} from "@faker-js/faker"; + +// ------------------------------------------------------------------------------------------------------------- +// types + + +// ------------------------------------------------------------------------------------------------------------- +// generate method +export const generate = (options: any): GenerateResult => { + // TODO: implement your own generate method here + const value = faker.internet.domainSuffix(); + return { + value: value, + stringValue: value, + type: ExportValueType.STRING + }; +} + +// ------------------------------------------------------------------------------------------------------------- +// options component diff --git a/src/core/generators/DomainSuffix/index.ts b/src/core/generators/DomainSuffix/index.ts new file mode 100644 index 0000000..968f6d4 --- /dev/null +++ b/src/core/generators/DomainSuffix/index.ts @@ -0,0 +1,11 @@ +import {Generator} from "@/types/generator"; +import {DataType, DataTypeCategory} from "@/constants/enums"; +import {generate} from "./DomainSuffix"; + +export const DomainSuffixGenerator: Generator = { + type: DataType.DOMAINSUFFIX, + category: DataTypeCategory.NETWORK, + generate: generate, + exampleLines: [".com", ".edu", ".nz",".app"] +} + \ No newline at end of file diff --git a/src/core/generators/index.ts b/src/core/generators/index.ts index 6563883..61fd252 100644 --- a/src/core/generators/index.ts +++ b/src/core/generators/index.ts @@ -1,3 +1,4 @@ +import {DomainSuffixGenerator} from "@/core/generators/DomainSuffix"; import {DomainNameGenerator} from "@/core/generators/DomainName"; import {ColorGenerator} from "@/core/generators/Color"; import {PhoneGenerator} from "@/core/generators/Phone"; @@ -15,6 +16,7 @@ import {CompanyNameGenerator} from "@/core/generators/CompanyName"; import {DataType} from "@/constants/enums"; export const generators = { + [DataType.DOMAINSUFFIX]: DomainSuffixGenerator, [DataType.DOMAINNAME]: DomainNameGenerator, [DataType.COLOR]: ColorGenerator, [DataType.PHONE]: PhoneGenerator, diff --git a/src/locale/translations/en.ts b/src/locale/translations/en.ts index 41697cd..7bc8002 100644 --- a/src/locale/translations/en.ts +++ b/src/locale/translations/en.ts @@ -63,6 +63,10 @@ export const en = { // data types + + // domainsuffix + "dataType.domainsuffix": "DomainSuffix", + // domainname "dataType.domainname": "DomainName", diff --git a/src/locale/translations/jaJP.ts b/src/locale/translations/jaJP.ts index 4762bea..96970f6 100644 --- a/src/locale/translations/jaJP.ts +++ b/src/locale/translations/jaJP.ts @@ -24,6 +24,10 @@ export const jaJP = { // data types + + // domainsuffix + "dataType.domainsuffix": "DomainSuffix", + // domainname "dataType.domainname": "DomainName", diff --git a/src/locale/translations/zhCN.ts b/src/locale/translations/zhCN.ts index 38ce755..6e4dd37 100644 --- a/src/locale/translations/zhCN.ts +++ b/src/locale/translations/zhCN.ts @@ -61,6 +61,10 @@ export const zhCN = { // data types + + // domainsuffix + "dataType.domainsuffix": "DomainSuffix", + // domainname "dataType.domainname": "DomainName", From bc3a5c98f6dca5a6c0ea4d4ff76fd1466b719e23 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Thu, 7 Mar 2024 21:37:03 +1300 Subject: [PATCH 56/60] feat: optimise formatter icons & bug fixes --- public/images/exportFormats/dark/C#.svg | 7 +++++ public/images/exportFormats/dark/CSV.svg | 13 ++++---- public/images/exportFormats/dark/Firebase.svg | 9 ++++++ public/images/exportFormats/dark/JSON.svg | 4 +-- .../images/exportFormats/dark/Typescript.svg | 7 +++++ public/images/exportFormats/dark/sql.svg | 31 +++---------------- public/images/exportFormats/light/C#.svg | 7 +++++ public/images/exportFormats/light/CSV.svg | 19 ++++++------ .../images/exportFormats/light/Firebase.svg | 15 +++++++++ public/images/exportFormats/light/JSON.svg | 10 +++--- .../images/exportFormats/light/Typescript.svg | 7 +++++ public/images/exportFormats/light/sql.svg | 10 +++++- src/core/formatters/Sql/Sql.tsx | 8 ++++- 13 files changed, 94 insertions(+), 53 deletions(-) create mode 100644 public/images/exportFormats/dark/C#.svg create mode 100644 public/images/exportFormats/dark/Firebase.svg create mode 100644 public/images/exportFormats/dark/Typescript.svg create mode 100644 public/images/exportFormats/light/C#.svg create mode 100644 public/images/exportFormats/light/Firebase.svg create mode 100644 public/images/exportFormats/light/Typescript.svg diff --git a/public/images/exportFormats/dark/C#.svg b/public/images/exportFormats/dark/C#.svg new file mode 100644 index 0000000..4a71304 --- /dev/null +++ b/public/images/exportFormats/dark/C#.svg @@ -0,0 +1,7 @@ + + + + + + + \ No newline at end of file diff --git a/public/images/exportFormats/dark/CSV.svg b/public/images/exportFormats/dark/CSV.svg index e6a7a67..52af362 100644 --- a/public/images/exportFormats/dark/CSV.svg +++ b/public/images/exportFormats/dark/CSV.svg @@ -1,11 +1,12 @@ - - - - + - csv​ - + + + + + + \ No newline at end of file diff --git a/public/images/exportFormats/dark/Firebase.svg b/public/images/exportFormats/dark/Firebase.svg new file mode 100644 index 0000000..35b0585 --- /dev/null +++ b/public/images/exportFormats/dark/Firebase.svg @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/public/images/exportFormats/dark/JSON.svg b/public/images/exportFormats/dark/JSON.svg index 4b53600..64af8ac 100644 --- a/public/images/exportFormats/dark/JSON.svg +++ b/public/images/exportFormats/dark/JSON.svg @@ -3,7 +3,5 @@ - { } ​ - .csv - + \ No newline at end of file diff --git a/public/images/exportFormats/dark/Typescript.svg b/public/images/exportFormats/dark/Typescript.svg new file mode 100644 index 0000000..750c178 --- /dev/null +++ b/public/images/exportFormats/dark/Typescript.svg @@ -0,0 +1,7 @@ + + + + + + + \ No newline at end of file diff --git a/public/images/exportFormats/dark/sql.svg b/public/images/exportFormats/dark/sql.svg index dfab250..df3751d 100644 --- a/public/images/exportFormats/dark/sql.svg +++ b/public/images/exportFormats/dark/sql.svg @@ -1,32 +1,9 @@ - + - - - - - - - - - - - - - - - - - - - - - - - - - - + + + \ No newline at end of file diff --git a/public/images/exportFormats/light/C#.svg b/public/images/exportFormats/light/C#.svg new file mode 100644 index 0000000..3d0f49e --- /dev/null +++ b/public/images/exportFormats/light/C#.svg @@ -0,0 +1,7 @@ + + + + + + + \ No newline at end of file diff --git a/public/images/exportFormats/light/CSV.svg b/public/images/exportFormats/light/CSV.svg index afb87ab..6baf762 100644 --- a/public/images/exportFormats/light/CSV.svg +++ b/public/images/exportFormats/light/CSV.svg @@ -1,11 +1,12 @@ - - - - - - - - csv​ - + + + + + + + + + + \ No newline at end of file diff --git a/public/images/exportFormats/light/Firebase.svg b/public/images/exportFormats/light/Firebase.svg new file mode 100644 index 0000000..4515757 --- /dev/null +++ b/public/images/exportFormats/light/Firebase.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/public/images/exportFormats/light/JSON.svg b/public/images/exportFormats/light/JSON.svg index 4437557..50be2e1 100644 --- a/public/images/exportFormats/light/JSON.svg +++ b/public/images/exportFormats/light/JSON.svg @@ -1,9 +1,7 @@ - - - - { } ​ - .csv - + + + + \ No newline at end of file diff --git a/public/images/exportFormats/light/Typescript.svg b/public/images/exportFormats/light/Typescript.svg new file mode 100644 index 0000000..b5f55f0 --- /dev/null +++ b/public/images/exportFormats/light/Typescript.svg @@ -0,0 +1,7 @@ + + + + + + + \ No newline at end of file diff --git a/public/images/exportFormats/light/sql.svg b/public/images/exportFormats/light/sql.svg index 25fae6e..373a19f 100644 --- a/public/images/exportFormats/light/sql.svg +++ b/public/images/exportFormats/light/sql.svg @@ -1 +1,9 @@ - \ No newline at end of file + + + + + + + + + \ No newline at end of file diff --git a/src/core/formatters/Sql/Sql.tsx b/src/core/formatters/Sql/Sql.tsx index 79e2cf4..45483ea 100644 --- a/src/core/formatters/Sql/Sql.tsx +++ b/src/core/formatters/Sql/Sql.tsx @@ -128,11 +128,14 @@ const generateInsertStatements = (sqlType: SqlType, tableName: string, sortedFie batchValues.forEach((item, index) => { const valueString = sortedFieldIds.map(id => { + if (fields[id].isDraft) { + return "" + } let result = item[id]; // Assuming direct use of value; adapt as necessary return formatValueForSQL(result.value, sqlType); // Apply formatting function }).join(', '); - inserts += ` (${valueString})${index < batchValues.length - 1 ? ',' : ';'}\n`; + inserts += ` (${valueString})${index < batchValues.length - 1 ? ',' : ';\n'}\n`; }); } return inserts; @@ -140,11 +143,14 @@ const generateInsertStatements = (sqlType: SqlType, tableName: string, sortedFie // Modify the format function to adapt to different SQL dialects export const format = (request: FormatRequest): string => { + console.log(request) + const {fields, values, config, sortedFieldIds} = request; const {type, tableName, batchSize, dropTable, createTable, primaryKey, primaryKeyColumnName} = config; let sql = ''; + if (values.length === 0) { return sql; } From 632cb107d969d68e34286b53c9607bd542940883 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Fri, 8 Mar 2024 14:34:00 +1300 Subject: [PATCH 57/60] feat: add value type to DomainName and DomainSuffix generators --- src/core/generators/DomainName/DomainName.tsx | 2 -- src/core/generators/DomainName/index.ts | 7 ++++--- src/core/generators/DomainSuffix/DomainSuffix.tsx | 2 -- src/core/generators/DomainSuffix/index.ts | 5 +++-- src/locale/translations/en.ts | 4 ++-- 5 files changed, 9 insertions(+), 11 deletions(-) diff --git a/src/core/generators/DomainName/DomainName.tsx b/src/core/generators/DomainName/DomainName.tsx index 9c980f6..7c9dc39 100644 --- a/src/core/generators/DomainName/DomainName.tsx +++ b/src/core/generators/DomainName/DomainName.tsx @@ -1,7 +1,6 @@ import React from "react"; import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; import {faker} from "@faker-js/faker"; -import {ExportValueType} from "@/constants/enums"; // ------------------------------------------------------------------------------------------------------------- // types @@ -18,7 +17,6 @@ export const generate = (options: any): GenerateResult => { return { value: value, stringValue: value, - type: ExportValueType.STRING }; } diff --git a/src/core/generators/DomainName/index.ts b/src/core/generators/DomainName/index.ts index a275420..adda063 100644 --- a/src/core/generators/DomainName/index.ts +++ b/src/core/generators/DomainName/index.ts @@ -1,11 +1,12 @@ import {Generator} from "@/types/generator"; -import {DataType, DataTypeCategory} from "@/constants/enums"; -import { generate} from "./DomainName"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; +import {generate} from "./DomainName"; export const DomainNameGenerator: Generator = { type: DataType.DOMAINNAME, category: DataTypeCategory.NETWORK, generate: generate, - exampleLines: ["google.com", "wikipedia.org", "museum.info","aucklanduni.ac.nz","tech.startup.io"] + defaultValueType: ValueType.STRING, + exampleLines: ["google.com", "wikipedia.org", "museum.info"] } \ No newline at end of file diff --git a/src/core/generators/DomainSuffix/DomainSuffix.tsx b/src/core/generators/DomainSuffix/DomainSuffix.tsx index d4a94c6..1267826 100644 --- a/src/core/generators/DomainSuffix/DomainSuffix.tsx +++ b/src/core/generators/DomainSuffix/DomainSuffix.tsx @@ -1,5 +1,4 @@ import {GenerateResult, GeneratorOptionsComponentInterface} from "@/types/generator"; -import {ExportValueType} from "@/constants/enums"; import {faker} from "@faker-js/faker"; // ------------------------------------------------------------------------------------------------------------- @@ -14,7 +13,6 @@ export const generate = (options: any): GenerateResult => { return { value: value, stringValue: value, - type: ExportValueType.STRING }; } diff --git a/src/core/generators/DomainSuffix/index.ts b/src/core/generators/DomainSuffix/index.ts index 968f6d4..484b653 100644 --- a/src/core/generators/DomainSuffix/index.ts +++ b/src/core/generators/DomainSuffix/index.ts @@ -1,11 +1,12 @@ import {Generator} from "@/types/generator"; -import {DataType, DataTypeCategory} from "@/constants/enums"; +import {DataType, DataTypeCategory, ValueType} from "@/constants/enums"; import {generate} from "./DomainSuffix"; export const DomainSuffixGenerator: Generator = { type: DataType.DOMAINSUFFIX, category: DataTypeCategory.NETWORK, generate: generate, - exampleLines: [".com", ".edu", ".nz",".app"] + defaultValueType: ValueType.STRING, + exampleLines: [".com", ".edu", ".nz"] } \ No newline at end of file diff --git a/src/locale/translations/en.ts b/src/locale/translations/en.ts index 18ca0a6..21e5298 100644 --- a/src/locale/translations/en.ts +++ b/src/locale/translations/en.ts @@ -74,10 +74,10 @@ export const en = { // data types // domainsuffix - "dataType.domainsuffix": "DomainSuffix", + "dataType.domainsuffix": "Domain Suffix", // domainname - "dataType.domainname": "DomainName", + "dataType.domainname": "Domain Name", // accountnumber "dataType.accountnumber": "Account Number", From 06589e5b009aed7b1a1e6c10a1eb0a3f8a5725a3 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Sat, 9 Mar 2024 00:57:35 +1300 Subject: [PATCH 58/60] feat: add c-sharp formatter (#258) --- .../exportFormats/dark/{C#.svg => CSharp.svg} | 0 public/images/exportFormats/dark/Java.svg | 11 + .../light/{C#.svg => CSharp.svg} | 0 public/images/exportFormats/light/Java.svg | 13 ++ .../DevTools/src/GenerateResultsPreviewer.tsx | 14 +- .../ExportFormatConfiguratorModal.tsx | 2 +- .../src/components/ExportFormatSelect.tsx | 5 +- src/constants/enums.ts | 1 + src/core/formatters/CSharp/CSharp.tsx | 200 ++++++++++++++++++ .../formatters/CSharp/CSharpFormatterUtils.ts | 32 +++ src/core/formatters/CSharp/index.ts | 13 ++ src/core/formatters/Sql/Sql.tsx | 29 ++- src/core/formatters/index.ts | 2 + src/core/generators/Color/Color.tsx | 4 +- src/locale/translations/en.ts | 8 +- src/utils/formatterUtils.ts | 2 + 16 files changed, 318 insertions(+), 18 deletions(-) rename public/images/exportFormats/dark/{C#.svg => CSharp.svg} (100%) create mode 100644 public/images/exportFormats/dark/Java.svg rename public/images/exportFormats/light/{C#.svg => CSharp.svg} (100%) create mode 100644 public/images/exportFormats/light/Java.svg create mode 100644 src/core/formatters/CSharp/CSharp.tsx create mode 100644 src/core/formatters/CSharp/CSharpFormatterUtils.ts create mode 100644 src/core/formatters/CSharp/index.ts diff --git a/public/images/exportFormats/dark/C#.svg b/public/images/exportFormats/dark/CSharp.svg similarity index 100% rename from public/images/exportFormats/dark/C#.svg rename to public/images/exportFormats/dark/CSharp.svg diff --git a/public/images/exportFormats/dark/Java.svg b/public/images/exportFormats/dark/Java.svg new file mode 100644 index 0000000..5cbad9f --- /dev/null +++ b/public/images/exportFormats/dark/Java.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/public/images/exportFormats/light/C#.svg b/public/images/exportFormats/light/CSharp.svg similarity index 100% rename from public/images/exportFormats/light/C#.svg rename to public/images/exportFormats/light/CSharp.svg diff --git a/public/images/exportFormats/light/Java.svg b/public/images/exportFormats/light/Java.svg new file mode 100644 index 0000000..d4949d3 --- /dev/null +++ b/public/images/exportFormats/light/Java.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/components/DevTools/src/GenerateResultsPreviewer.tsx b/src/components/DevTools/src/GenerateResultsPreviewer.tsx index f75d3b9..595aa5a 100644 --- a/src/components/DevTools/src/GenerateResultsPreviewer.tsx +++ b/src/components/DevTools/src/GenerateResultsPreviewer.tsx @@ -10,7 +10,7 @@ import { import CodeMirror from "@uiw/react-codemirror"; import {darkTheme, lightTheme} from "@/components/PreviewPanel/src/components/RawPreviewer/RawPreviewer.themes"; import {EditorView} from "@codemirror/view"; -import {Card, Tag} from "@douyinfe/semi-ui"; +import {Card, Space, Tag} from "@douyinfe/semi-ui"; import {useSelector} from "react-redux"; import {selectColorMode} from "@/reducers/app/appSelectors"; import {Extension} from "@codemirror/state"; @@ -30,6 +30,7 @@ export const GenerateResultsPreviewer: React.FunctionComponent([]); React.useEffect(() => { @@ -53,6 +54,10 @@ export const GenerateResultsPreviewer: React.FunctionComponent - {formatType} + + {formatType} + {isError && ERROR} + diff --git a/src/components/ExportFormatConfigurator/src/components/ExportFormatSelect.tsx b/src/components/ExportFormatConfigurator/src/components/ExportFormatSelect.tsx index a20b081..f1b6c5e 100644 --- a/src/components/ExportFormatConfigurator/src/components/ExportFormatSelect.tsx +++ b/src/components/ExportFormatConfigurator/src/components/ExportFormatSelect.tsx @@ -9,6 +9,7 @@ import styles from './ExportFormatSelect.module.css'; import {doChangeExportFormat} from "@/reducers/workspace/workspaceActions"; import {selectExportFormat} from "@/reducers/workspace/workspaceSelectors"; import {selectColorMode} from "@/reducers/app/appSelectors"; +import {ExportFormat} from "@/constants/enums"; export interface ExportFormatSelectProps { @@ -34,7 +35,7 @@ export const ExportFormatSelect: React.FunctionComponent
{formatter.type} @@ -46,7 +47,7 @@ export const ExportFormatSelect: React.FunctionComponent (
{optionNode.value}
{optionNode.value} diff --git a/src/constants/enums.ts b/src/constants/enums.ts index 54cc9fc..36ad087 100644 --- a/src/constants/enums.ts +++ b/src/constants/enums.ts @@ -7,6 +7,7 @@ export enum ExportFormatCategory { } export enum ExportFormat { + CSHARP = "C#", SQL = "SQL", CSV = "CSV", JSON = "JSON", diff --git a/src/core/formatters/CSharp/CSharp.tsx b/src/core/formatters/CSharp/CSharp.tsx new file mode 100644 index 0000000..774bf00 --- /dev/null +++ b/src/core/formatters/CSharp/CSharp.tsx @@ -0,0 +1,200 @@ +import React from "react"; +import {FormatRequest, FormatterConfigComponentInterface} from "@/types/formatter"; +import {OptionsInput, OptionsSelect, SelectOption} from "@/components/Utils"; +import {FormattedMessage} from "@/locale"; +import {OptionsSwitch} from "@/components/Utils/src/OptionsSwitch"; +import {ValueType} from "@/constants/enums"; +import {GenerateResult} from "@/types/generator"; +import {hasValue} from "@/utils/typeUtils"; +import {formatValueForCSharp} from "@/core/formatters/CSharp/CSharpFormatterUtils"; + +// ------------------------------------------------------------------------------------------------------------- +// types + +export enum CSharpCollectionType { + GENERIC_LIST = "GENERIC_LIST", + ARRAY = "ARRAY", + ARRAY_LIST = "ARRAY_LIST", + HASHSET = "HASHSET" +} + +export type CSharpFormatterConfig = { + dtoClass: boolean, + dtoClassName: string, + collectionName: string, + collectionType: CSharpCollectionType +} + +// ------------------------------------------------------------------------------------------------------------- +// default options + +export const defaultCSharpFormatterConfig: CSharpFormatterConfig = { + dtoClass: false, + dtoClassName: "MyData", + collectionName: "myList", + collectionType: CSharpCollectionType.GENERIC_LIST +} + +// ------------------------------------------------------------------------------------------------------------- +// format method + +export const format = (request: FormatRequest): string => { + const {fields, values, sortedFieldIds, config} = request; + + let csharpCode = ''; + + // Create DTO class if required + if (config.dtoClass) { + csharpCode += `public class ${config.dtoClassName}\n{\n`; + sortedFieldIds.forEach(id => { + const field = fields[id]; + let fieldType = 'string'; // Default field type + switch (field.valueType) { + case ValueType.INT: + fieldType = `int${field.emptyRate !== 0 ? "?" : ""}`; + break; + case ValueType.DOUBLE: + fieldType = `double${field.emptyRate !== 0 ? "?" : ""}`; + break; + case ValueType.TEXT: + fieldType = 'string'; + break; + case ValueType.BOOLEAN: + fieldType = 'bool'; + break; + case ValueType.BIGINT: + fieldType = `long${field.emptyRate !== 0 ? "?" : ""}`; + break; + case ValueType.INT_LIST: + fieldType = 'List' + break; + case ValueType.STRING_LIST: + fieldType = 'List' + break; + case ValueType.ONE_BIT: + fieldType = `int${field.emptyRate !== 0 ? "?" : ""}` + break; + // Add more cases as necessary + } + csharpCode += ` public ${fieldType} ${field.fieldName} { get; set; }\n`; + }); + csharpCode += '}\n\n'; + } + + // Determine collection type + let collectionType = ''; + switch (config.collectionType) { + case CSharpCollectionType.GENERIC_LIST: + collectionType = 'List'; + break; + case CSharpCollectionType.ARRAY: + collectionType = 'Array'; + break; + case CSharpCollectionType.ARRAY_LIST: + collectionType = 'ArrayList'; + break; + case CSharpCollectionType.HASHSET: + collectionType = 'HashSet'; + break; + // Add more cases as necessary + } + let itemType = config.dtoClass ? config.dtoClassName : 'var'; // Use var for non-dto types for simplicity + + // Initialize collection + if (config.collectionType === CSharpCollectionType.ARRAY) { + // Array initialization is unique + csharpCode += `${itemType}[] ${config.collectionName} = new ${itemType}[${values.length}];\n`; + } else { + csharpCode += `${collectionType}<${itemType}> ${config.collectionName} = new ${collectionType}<${itemType}>();\n`; + } + + // Populate collection with values + values.forEach((value, index) => { + if (config.collectionType === CSharpCollectionType.ARRAY) { + // Array value assignment + csharpCode += `${config.collectionName}[${index}] = new ${itemType} { `; + } else { + // Other collections value addition + csharpCode += `${config.collectionName}.Add(new ${itemType} { `; + } + + csharpCode += sortedFieldIds.map(id => `${fields[id].fieldName} = ${formatValueForCSharp(value[id], fields[id].valueType)}`).join(', '); + + if (config.collectionType === CSharpCollectionType.ARRAY) { + csharpCode += ' };\n'; + } else { + csharpCode += ' });\n'; + } + }); + + return csharpCode; +}; + + +// ------------------------------------------------------------------------------------------------------------- +// config component + +export const CSharpConfigComponent: React.FC = ({...props}) => { + const {config, onConfigChange} = props as { + config: CSharpFormatterConfig, + onConfigChange: typeof props.onConfigChange + }; + + // action + const handleValueChange = (field: string, value: any) => { + onConfigChange({...config, [field]: value}) + } + + return ( +
+ } + selectOptions={CSharpCollectionTypeSelectOptions} + value={config.collectionType} + onChange={(v) => handleValueChange("collectionType", v)} + style={{width: "150px"}} + /> + + } + value={config.collectionName} + onChange={(v) => handleValueChange("collectionName", v)} + style={{width: "200px"}} + /> + + } + value={config.dtoClass} + onChange={(v) => handleValueChange("dtoClass", v)} + /> + + { + config.dtoClass && } + value={config.dtoClassName} + onChange={(v) => handleValueChange("dtoClassName", v)} + style={{width: "200px"}} + /> + } +
+ ); +} + +const CSharpCollectionTypeSelectOptions: SelectOption[] = [ + { + label: "List", + value: CSharpCollectionType.GENERIC_LIST + }, + { + label: "Array", + value: CSharpCollectionType.ARRAY + }, + { + label: "ArrayList", + value: CSharpCollectionType.ARRAY_LIST + }, + { + label: "HashSet", + value: CSharpCollectionType.HASHSET + } +] diff --git a/src/core/formatters/CSharp/CSharpFormatterUtils.ts b/src/core/formatters/CSharp/CSharpFormatterUtils.ts new file mode 100644 index 0000000..f3cfed2 --- /dev/null +++ b/src/core/formatters/CSharp/CSharpFormatterUtils.ts @@ -0,0 +1,32 @@ +import {GenerateResult} from "@/types/generator"; +import {ValueType} from "@/constants/enums"; +import {hasValue} from "@/utils/typeUtils"; + + +// Helper function to format field values into C# code, based on the field type. +// You would need to adapt this based on your data structure and needs. +export function formatValueForCSharp(generateResult: GenerateResult, valueType: ValueType): string { + const {value} = generateResult; + + if (!hasValue(value)) { + return 'null' + } + + switch (valueType) { + case ValueType.INT: + case ValueType.DOUBLE: + case ValueType.BIGINT: + case ValueType.BOOLEAN: + case ValueType.ONE_BIT: + return value.toString(); + case ValueType.STRING: + case ValueType.TEXT: + return `"${value.replace(/"/g, '\\"')}"`; // Escape double quotes in C# strings + case ValueType.INT_LIST: + return `new List { ${value.join(", ")} }` + case ValueType.STRING_LIST: + return `new List { ${value.map(item => `"${item}"`).join(', ')})} }` + default: + return 'null'; // Or some other default case + } +} \ No newline at end of file diff --git a/src/core/formatters/CSharp/index.ts b/src/core/formatters/CSharp/index.ts new file mode 100644 index 0000000..0854670 --- /dev/null +++ b/src/core/formatters/CSharp/index.ts @@ -0,0 +1,13 @@ +import {Formatter} from "@/types/formatter"; +import {ExportFormat, ExportFormatCategory} from "@/constants/enums"; +import {CSharpConfigComponent, format, defaultCSharpFormatterConfig} from "./CSharp"; + + +export const CSharpFormatter: Formatter = { + type: ExportFormat.CSHARP, + category: ExportFormatCategory.PROGRAMMING_LANGUAGES, + format: format, + fileExtension: 'cs', + configComponent: CSharpConfigComponent, + defaultConfig: defaultCSharpFormatterConfig, +} \ No newline at end of file diff --git a/src/core/formatters/Sql/Sql.tsx b/src/core/formatters/Sql/Sql.tsx index 45483ea..e94f1e9 100644 --- a/src/core/formatters/Sql/Sql.tsx +++ b/src/core/formatters/Sql/Sql.tsx @@ -104,18 +104,24 @@ const addCreateTableColumn = (field: DataField, sqlType: SqlType) => { return ` ${field.fieldName} ${fieldType} DEFAULT NULL`; }; -const formatValueForSQL = (value: any, sqlType: SqlType): string => { - if (typeof value === 'string') { - // String values need to be enclosed in single quotes, and single quotes within the value escaped - return `'${value.replace(/'/g, "''")}'`; - } else if (typeof value === 'boolean') { - return (value ? "1" : "0"); - } else if (value === null) { +const formatValueForSQL = (value: any, sqlType: SqlType, valueType: ValueType): string => { + if (value === null) { // Handle null values return 'NULL'; } - // Adapt this function for other data types and SQL dialects as needed - return value; + + switch (valueType) { + case ValueType.STRING: + return `'${value.replace(/'/g, "''")}'`; + case ValueType.BOOLEAN: + return (value ? "1" : "0"); + case ValueType.INT_LIST: + return `'${value.join(", ")}'` + case ValueType.STRING_LIST: + return `'${value.map(item => `"${item}"`).join(', ')}'` + default: + return value; + } }; const generateInsertStatements = (sqlType: SqlType, tableName: string, sortedFieldIds: string[], values: any[], fields: { @@ -128,11 +134,12 @@ const generateInsertStatements = (sqlType: SqlType, tableName: string, sortedFie batchValues.forEach((item, index) => { const valueString = sortedFieldIds.map(id => { - if (fields[id].isDraft) { + const field = fields[id]; + if (field.isDraft) { return "" } let result = item[id]; // Assuming direct use of value; adapt as necessary - return formatValueForSQL(result.value, sqlType); // Apply formatting function + return formatValueForSQL(result.value, sqlType, field.valueType); // Apply formatting function }).join(', '); inserts += ` (${valueString})${index < batchValues.length - 1 ? ',' : ';\n'}\n`; diff --git a/src/core/formatters/index.ts b/src/core/formatters/index.ts index 19d37ef..977032e 100644 --- a/src/core/formatters/index.ts +++ b/src/core/formatters/index.ts @@ -1,3 +1,4 @@ +import {CSharpFormatter} from "@/core/formatters/CSharp"; import {SqlFormatter} from "@/core/formatters/Sql"; import {CsvFormatter} from "@/core/formatters/Csv"; import {JsonFormatter} from "@/core/formatters/Json"; @@ -7,6 +8,7 @@ import {XmlFormatter} from "@/core/formatters/Xml"; export const formatters = { + [ExportFormat.CSHARP]: CSharpFormatter, [ExportFormat.SQL]: SqlFormatter, [ExportFormat.CSV]: CsvFormatter, [ExportFormat.JSON]: JsonFormatter, diff --git a/src/core/generators/Color/Color.tsx b/src/core/generators/Color/Color.tsx index e6981a1..b918ec6 100644 --- a/src/core/generators/Color/Color.tsx +++ b/src/core/generators/Color/Color.tsx @@ -91,7 +91,9 @@ export const ColorGeneratorOptionsComponent: React.FunctionComponent { if (kind === ColorGeneratorKind.RGB) { handleOptionValueChange("kind", kind, options.format === ColorGeneratorFormat.DECIMAL ? ValueType.INT_LIST : ValueType.STRING); - } else { + } else if (kind === ColorGeneratorKind.HSL) { + handleOptionValueChange("kind", kind, ValueType.INT_LIST); + } else if (kind === ColorGeneratorKind.HUMAN) { handleOptionValueChange("kind", kind, ValueType.STRING); } } diff --git a/src/locale/translations/en.ts b/src/locale/translations/en.ts index 21e5298..2345f7a 100644 --- a/src/locale/translations/en.ts +++ b/src/locale/translations/en.ts @@ -9,7 +9,7 @@ export const en = { "export.category.programmingLanguages": "Programming languages", // export format modal - "export.configurator.modal.title": "Generation Format", + "export.configurator.modal.title": "Format", "export.configurator.modal.confirmButton.text": "Confirm", "export.configurator.config.label": "Configurations", "export.configurator.config.empty": "Configuration of this export format is currently not available.", @@ -70,6 +70,12 @@ export const en = { "export.configurator.sql.includePrimaryKey": "Include primary key", "export.configurator.sql.primaryKeyColumnName": "Primary key column", + // c# + "export.configurator.csharp.collectionType": "Collection type", + "export.configurator.csharp.collectionName": "Collection name", + "export.configurator.csharp.dtoClass": "Create DTO class", + "export.configurator.csharp.dtoClassName": "Class name", + // ------------------------------------------------------------------------------------------------------------- // data types diff --git a/src/utils/formatterUtils.ts b/src/utils/formatterUtils.ts index da455a1..1bbae23 100644 --- a/src/utils/formatterUtils.ts +++ b/src/utils/formatterUtils.ts @@ -61,6 +61,8 @@ export const getCodemirrorLanguagePluginByFormat = (format: ExportFormat): any = return langs.javascript(); case ExportFormat.SQL: return langs.sql(); + case ExportFormat.CSHARP: + return langs.csharp(); default: return langs.mathematica(); } From 04ca147c4d84926a0758393b5d6cfcc57872a1fc Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Sat, 9 Mar 2024 01:27:33 +1300 Subject: [PATCH 59/60] fix: optimize format method (#260) --- src/core/formatters/Sql/Sql.tsx | 1 - src/utils/formatterUtils.ts | 25 ++++++++++++++++++++++++- 2 files changed, 24 insertions(+), 2 deletions(-) diff --git a/src/core/formatters/Sql/Sql.tsx b/src/core/formatters/Sql/Sql.tsx index e94f1e9..d5fdd17 100644 --- a/src/core/formatters/Sql/Sql.tsx +++ b/src/core/formatters/Sql/Sql.tsx @@ -22,7 +22,6 @@ export enum SqlType { SAPHANA = "SAPHANA" } - export type SqlFormatterConfig = { type: SqlType, tableName: string, diff --git a/src/utils/formatterUtils.ts b/src/utils/formatterUtils.ts index 1bbae23..999bbcd 100644 --- a/src/utils/formatterUtils.ts +++ b/src/utils/formatterUtils.ts @@ -5,7 +5,30 @@ import {langs} from '@uiw/codemirror-extensions-langs'; // format data export const formatData = (request: FormatRequest): string => { - return formatters[request.format].format(request); + const {fields, sortedFieldIds} = request; + + // Filter out field IDs where the corresponding field is a draft + const filteredFieldIds = sortedFieldIds.filter(fieldId => !fields[fieldId].isDraft); + + // Construct a new fields object without the draft fields + const filteredFields = {}; + filteredFieldIds.forEach(fieldId => { + filteredFields[fieldId] = fields[fieldId]; + }); + + // Replace the request fields with the filtered fields and sortedFieldIds with filteredFieldIds + const updatedRequest = { + ...request, + fields: filteredFields, + sortedFieldIds: filteredFieldIds, + }; + + if (filteredFieldIds.length === 0) { + return "" + } else { + return formatters[request.format].format(updatedRequest); + } + } // Get formatters grouped by category From 05f75beef8bb57400d38b2ffc5d74e296841a901 Mon Sep 17 00:00:00 2001 From: Zach Wang Date: Sat, 9 Mar 2024 01:48:00 +1300 Subject: [PATCH 60/60] feat: change page routing (#262) --- src/components/Navbar/src/NavBar.tsx | 3 ++- src/components/Toolbar/src/components/GenerateButton.tsx | 2 ++ src/pages/index.tsx | 7 ++----- src/pages/workspace/index.tsx | 1 - 4 files changed, 6 insertions(+), 7 deletions(-) diff --git a/src/components/Navbar/src/NavBar.tsx b/src/components/Navbar/src/NavBar.tsx index a975a8a..54336c5 100644 --- a/src/components/Navbar/src/NavBar.tsx +++ b/src/components/Navbar/src/NavBar.tsx @@ -14,6 +14,7 @@ import {Logo} from "@/components/Navbar/src/components/Logo"; import {LoginButton} from "./components/LoginButton"; import {User, UserLogin} from "./components/UserLogin"; import {SchemaSelector} from "@/components/SchemaSelector"; +import {inDevEnvironment} from "@/utils/devUtils"; export type NavBarProps = {} @@ -77,7 +78,7 @@ export const NavBar: FunctionComponent = () => { size={22} duration={0.6}/>
- + {inDevEnvironment && } diff --git a/src/components/Toolbar/src/components/GenerateButton.tsx b/src/components/Toolbar/src/components/GenerateButton.tsx index 46d5766..573df1c 100644 --- a/src/components/Toolbar/src/components/GenerateButton.tsx +++ b/src/components/Toolbar/src/components/GenerateButton.tsx @@ -6,6 +6,7 @@ import {FormattedMessage} from "@/locale"; import {ComponentSize} from "@/constants/enums"; import {useDispatch} from "react-redux"; import {doSetShowExportModal} from "@/reducers/export/exportActions"; +import {inDevEnvironment} from "@/utils/devUtils"; export type GenerateButtonProps = { size: ComponentSize; @@ -22,6 +23,7 @@ export const GenerateButton: React.FC = ({...props}) => { return (