From 6c5bff906ab79451a0f5d2382f21898034239ccb Mon Sep 17 00:00:00 2001 From: Ezequiel Vega Date: Sat, 2 Oct 2021 16:16:20 +0000 Subject: [PATCH] Merged in migration (pull request #4) Migration * README.md was updated and the webpack was modified in package web2d * README.md was updated and the webpack was modified in package mindplot * Merge branch 'develop' of https://bitbucket.org/lilabyus/wisemapping-frontend into develop * Mindplot module script correction * Pull branch develop remote * Webcomponent module webpack correction * Pull branch develop * Material-ui library correction and cypress test correction * Script correction * Cypress test correction --- packages/mindplot/package.json | 2 +- packages/web2d/package.json | 2 +- packages/webapp/src/app.tsx | 4 +- .../action-dispatcher/create-dialog/index.tsx | 2 +- .../webapp/src/components/maps-page/index.tsx | 40 +-- .../components/maps-page/maps-list/index.tsx | 273 ++++++++++-------- .../components/maps-page/maps-list/styled.ts | 2 +- .../webapp/src/components/maps-page/style.ts | 6 +- packages/webapp/src/theme/index.ts | 14 +- packages/webcomponent/.gitignore | 3 + 10 files changed, 189 insertions(+), 159 deletions(-) diff --git a/packages/mindplot/package.json b/packages/mindplot/package.json index 151dedc8..dbdc6e3c 100644 --- a/packages/mindplot/package.json +++ b/packages/mindplot/package.json @@ -21,7 +21,7 @@ }, "scripts": { "build": "webpack --config webpack.prod.js", - "test": "webpack serve --config webpack.test.js", + "tests": "webpack serve --config webpack.test.js", "start": "webpack serve --config webpack.dev.js" }, "dependencies": { diff --git a/packages/web2d/package.json b/packages/web2d/package.json index a76f996b..6fe97a42 100644 --- a/packages/web2d/package.json +++ b/packages/web2d/package.json @@ -22,7 +22,7 @@ "scripts": { "start": "nodemon --watch lib", "build": "webpack --config webpack.prod.js", - "test": "webpack serve --config webpack.test.js" + "tests": "webpack serve --config webpack.test.js" }, "devDependencies": { "@babel/core": "^7.14.6", diff --git a/packages/webapp/src/app.tsx b/packages/webapp/src/app.tsx index 1c4edb02..1d403f0e 100644 --- a/packages/webapp/src/app.tsx +++ b/packages/webapp/src/app.tsx @@ -72,8 +72,8 @@ const App = (): ReactElement => { ) : ( -
Loading ...
- ); +
Loading ...
+ ); }; export default App; diff --git a/packages/webapp/src/components/maps-page/action-dispatcher/create-dialog/index.tsx b/packages/webapp/src/components/maps-page/action-dispatcher/create-dialog/index.tsx index 6c26c9e2..e4f05a4b 100644 --- a/packages/webapp/src/components/maps-page/action-dispatcher/create-dialog/index.tsx +++ b/packages/webapp/src/components/maps-page/action-dispatcher/create-dialog/index.tsx @@ -66,7 +66,7 @@ const CreateDialog = ({ onClose }: CreateProps): React.ReactElement => { error={error} title={intl.formatMessage({ id: 'create.title', - defaultMessage: 'Create a new mindmap.', + defaultMessage: 'Create a new mindmap', })} description={intl.formatMessage({ id: 'create.description', diff --git a/packages/webapp/src/components/maps-page/index.tsx b/packages/webapp/src/components/maps-page/index.tsx index 4ef4557c..6804e1b7 100644 --- a/packages/webapp/src/components/maps-page/index.tsx +++ b/packages/webapp/src/components/maps-page/index.tsx @@ -67,7 +67,10 @@ const MapsPage = (): ReactElement => { const intl = useIntl(); useEffect(() => { - document.title = intl.formatMessage({ id: 'maps.page-title', defaultMessage: 'My Maps | WiseMapping' }); + document.title = intl.formatMessage({ + id: 'maps.page-title', + defaultMessage: 'My Maps | WiseMapping', + }); }, []); const mutation = useMutation((id: number) => client.deleteLabel(id), { @@ -94,27 +97,27 @@ const MapsPage = (): ReactElement => { const filterButtons: ToolbarButtonInfo[] = [ { filter: { type: 'all' }, - label: intl.formatMessage({ id: 'maps.nav-all', defaultMessage:'All' }), + label: intl.formatMessage({ id: 'maps.nav-all', defaultMessage: 'All' }), icon: , }, { filter: { type: 'owned' }, - label: intl.formatMessage({ id: 'maps.nav-onwned', defaultMessage:'Owned' }), + label: intl.formatMessage({ id: 'maps.nav-onwned', defaultMessage: 'Owned' }), icon: , }, { filter: { type: 'starred' }, - label: intl.formatMessage({ id: 'maps.nav-starred', defaultMessage:'Starred' }), + label: intl.formatMessage({ id: 'maps.nav-starred', defaultMessage: 'Starred' }), icon: , }, { filter: { type: 'shared' }, - label: intl.formatMessage({ id: 'maps.nav-shared', defaultMessage:'Shared with me' }), + label: intl.formatMessage({ id: 'maps.nav-shared', defaultMessage: 'Shared with me' }), icon: , }, { filter: { type: 'public' }, - label: intl.formatMessage({ id: 'maps.nav-public', defaultMessage:'Public' }), + label: intl.formatMessage({ id: 'maps.nav-public', defaultMessage: 'Public' }), icon: , }, ]; @@ -219,18 +222,19 @@ const MapsPage = (): ReactElement => { - {filterButtons.map(buttonInfo => { - return () - } - )} + {filterButtons.map((buttonInfo) => { + return ( + + ); + })}
( order: Order, orderBy: Key ): ( - a: { [key in Key]: number | string | boolean | Label[] | undefined }, - b: { [key in Key]: number | string | Label[] | boolean } - ) => number { + a: { [key in Key]: number | string | boolean | Label[] | undefined }, + b: { [key in Key]: number | string | Label[] | boolean } +) => number { return order === 'desc' ? (a, b) => descendingComparator(a, b, orderBy) : (a, b) => -descendingComparator(a, b, orderBy); @@ -95,15 +95,8 @@ interface EnhancedTableProps { function EnhancedTableHead(props: EnhancedTableProps) { const intl = useIntl(); - const { - classes, - onSelectAllClick, - order, - orderBy, - numSelected, - rowCount, - onRequestSort, - } = props; + const { classes, onSelectAllClick, order, orderBy, numSelected, rowCount, onRequestSort } = + props; const createSortHandler = (property: keyof MapInfo) => (event: React.MouseEvent) => { onRequestSort(event, property); @@ -117,7 +110,7 @@ function EnhancedTableHead(props: EnhancedTableProps) { }, { id: 'labels', - numeric: false + numeric: false, }, { id: 'createdBy', @@ -222,7 +215,8 @@ const mapsFilter = (filter: Filter, search: string): ((mapInfo: MapInfo) => bool break; case 'label': result = - !mapInfo.labels || mapInfo.labels.some((label) => label.id === (filter as LabelFilter).label.id) + !mapInfo.labels || + mapInfo.labels.some((label) => label.id === (filter as LabelFilter).label.id); break; case 'public': result = mapInfo.isPublic; @@ -336,19 +330,18 @@ export const MapsList = (props: MapsListProps): React.ReactElement => { event.stopPropagation(); }; }; - 9 + 9; const starredMultation = useMutation( (id: number) => { const map = mapsInfo.find((m) => m.id == id); - const starred = !(map?.starred); + const starred = !map?.starred; // Follow a optimistic update approach ... - queryClient.setQueryData('maps', mapsInfo => { + queryClient.setQueryData('maps', (mapsInfo) => { if (map) { map.starred = starred; } return mapsInfo || []; - }); return client.updateStarred(id, starred); }, @@ -404,7 +397,13 @@ export const MapsList = (props: MapsListProps): React.ReactElement => {
{selected.length > 0 && ( - +
{ ) : ( - stableSort(mapsInfo, getComparator(order, orderBy)) - .slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage) - .map((row: MapInfo) => { - const isItemSelected = isSelected(row.id); - const labelId = row.id; + stableSort(mapsInfo, getComparator(order, orderBy)) + .slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage) + .map((row: MapInfo) => { + const isItemSelected = isSelected(row.id); + const labelId = row.id; - return ( - handleRowClick(event, row.id)} - role="checkbox" - aria-checked={isItemSelected} - tabIndex={-1} - key={row.id} - selected={isItemSelected} - style={{ border: '0' }} + return ( + handleRowClick(event, row.id)} + role="checkbox" + aria-checked={isItemSelected} + tabIndex={-1} + key={row.id} + selected={isItemSelected} + style={{ border: '0' }} + > + + + + + + - + handleStarred(e, row.id) + } > - - + + + - + + e.stopPropagation()} > - - - handleStarred(e, row.id) - } - > - - - - + {row.title} + + + - - - e.stopPropagation()} - > - {row.title} - - - + + + - - - + + {row.createdBy} + - - {row.createdBy} - + + + + {dayjs( + row.lastModificationTime + ).fromNow()} + + + - - - - {dayjs( - row.lastModificationTime - ).fromNow()} - - - - - - - - - - - - - ); - }) - )} + + + + + + + + + ); + }) + )} @@ -601,6 +624,6 @@ export const MapsList = (props: MapsListProps): React.ReactElement => { onClose={() => setActiveDialog(undefined)} mapsId={activeDialog ? activeDialog.mapsId : []} /> -
+ ); }; diff --git a/packages/webapp/src/components/maps-page/maps-list/styled.ts b/packages/webapp/src/components/maps-page/maps-list/styled.ts index 8a444b4c..2a4932c9 100644 --- a/packages/webapp/src/components/maps-page/maps-list/styled.ts +++ b/packages/webapp/src/components/maps-page/maps-list/styled.ts @@ -1,5 +1,5 @@ import { fade } from '@material-ui/core/styles'; -import { Theme } from '@material-ui/core/styles/createMuiTheme'; +import { Theme } from '@material-ui/core/styles/createTheme'; import createStyles from '@material-ui/core/styles/createStyles'; import makeStyles from '@material-ui/core/styles/makeStyles'; diff --git a/packages/webapp/src/components/maps-page/style.ts b/packages/webapp/src/components/maps-page/style.ts index c2bc7a72..ab6f4746 100644 --- a/packages/webapp/src/components/maps-page/style.ts +++ b/packages/webapp/src/components/maps-page/style.ts @@ -1,4 +1,4 @@ -import { Theme } from '@material-ui/core/styles/createMuiTheme'; +import { Theme } from '@material-ui/core/styles/createTheme'; import createStyles from '@material-ui/core/styles/createStyles'; import makeStyles from '@material-ui/core/styles/makeStyles'; @@ -27,11 +27,11 @@ export const useStyles = makeStyles((theme: Theme) => }, newMapButton: { marginRight: 10, - minWidth: '130px' + minWidth: '130px', }, importButton: { marginRight: 10, - minWidth: '130px' + minWidth: '130px', }, rightButtonGroup: { marginRight: 10, diff --git a/packages/webapp/src/theme/index.ts b/packages/webapp/src/theme/index.ts index 44950279..332b2588 100644 --- a/packages/webapp/src/theme/index.ts +++ b/packages/webapp/src/theme/index.ts @@ -1,4 +1,4 @@ -import createMuiTheme from '@material-ui/core/styles/createMuiTheme'; +import createMuiTheme from '@material-ui/core/styles/createTheme'; const theme = createMuiTheme({ overrides: { @@ -6,8 +6,8 @@ const theme = createMuiTheme({ '@global': { body: { backgroundColor: 'white', - // Important: This size is the min to diplay all pages except maps list. - minWidth: '450px' + // Important: This size is the min to diplay all pages except maps list. + minWidth: '450px', }, }, }, @@ -28,9 +28,9 @@ const theme = createMuiTheme({ root: { color: '#f9a826', }, - outlined:{ - zIndex: 'inherit' - } + outlined: { + zIndex: 'inherit', + }, }, MuiButton: { root: { @@ -47,7 +47,7 @@ const theme = createMuiTheme({ '&:hover': { backgroundColor: 'rgba(249, 168, 38, 0.91)', }, - } + }, }, }, typography: { diff --git a/packages/webcomponent/.gitignore b/packages/webcomponent/.gitignore index e69de29b..b7433c5b 100644 --- a/packages/webcomponent/.gitignore +++ b/packages/webcomponent/.gitignore @@ -0,0 +1,3 @@ +lib/ +node_module/ +