mirrors/object-browser
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

React 18 initial migration (#2044)

Browse Source 
- Updated codemirror dependencies
- Updated react virtualized dependencies
- Fixed height of object actions buttons
- Fixed icon buttons styling
- Fixed boxIcon badge location
- Fixed actions panel buttons height
This commit is contained in:
Alex
2022-05-28 17:08:22 -05:00
committed by GitHub
parent dd4963e3aa
commit 45715293ea
13 changed files with 2003 additions and 2036 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
portal-ui/package.json
View File

@@ -4,56 +4,56 @@
"homepage": ".",
"private": true,
"dependencies": {
"@codemirror/lang-json": "^0.19.1",
"@codemirror/legacy-modes": "^0.19.0",
"@codemirror/stream-parser": "^0.19.3",
"@codemirror/lang-json": "^0.20.0",
"@codemirror/legacy-modes": "^0.20.0",
"@codemirror/stream-parser": "^0.19.9",
"@date-io/moment": "1.x",
"@emotion/react": "^11.4.1",
"@emotion/styled": "^11.3.0",
"@hot-loader/react-dom": "17.0.1",
"@mui/icons-material": "^5.3.1",
"@mui/lab": "^5.0.0-alpha.67",
"@mui/material": "^5.4.0",
"@mui/styled-engine-sc": "^5.3.0",
"@mui/styles": "^5.3.0",
"@emotion/react": "^11.9.0",
"@emotion/styled": "^11.8.1",
"@hot-loader/react-dom": "^17.0.2",
"@mui/icons-material": "^5.8.0",
"@mui/lab": "^5.0.0-alpha.83",
"@mui/material": "^5.8.1",
"@mui/styled-engine-sc": "^5.8.0",
"@mui/styles": "^5.8.0",
"@reduxjs/toolkit": "^1.8.1",
"@types/history": "^4.7.3",
"@types/jest": "27.4.0",
"@types/lodash": "^4.14.149",
"@types/minio": "^7.0.11",
"@types/node": "17.0.14",
"@types/react": "17.0.0",
"@types/react": "18.0.9",
"@types/react-copy-to-clipboard": "^5.0.2",
"@types/react-dom": "17.0.11",
"@types/react-dom": "18.0.5",
"@types/react-grid-layout": "^1.1.1",
"@types/react-redux": "^7.1.24",
"@types/react-router": "^5.1.3",
"@types/react-router-dom": "^5.1.2",
"@types/react-virtualized": "^9.21.10",
"@types/react-virtualized": "^9.21.21",
"@types/superagent": "^4.1.12",
"@types/webpack-env": "^1.14.1",
"@types/websocket": "^1.0.0",
"@uiw/react-codemirror": "^4.3.2",
"@uiw/react-codemirror": "^4.7.0",
"chart.js": "^2.9.3",
"codemirror": "^5.52.2",
"codemirror": "^5.65.4",
"history": "^4.10.1",
"kbar": "^0.1.0-beta.27",
"kbar": "^0.1.0-beta.34",
"local-storage-fallback": "^4.1.1",
"lodash": "^4.17.21",
"minio": "^7.0.28",
"moment": "^2.29.2",
"react": "^17.0.2",
"react": "^18.1.0",
"react-chartjs-2": "^2.9.0",
"react-copy-to-clipboard": "^5.0.2",
"react-dom": "17.0.1",
"react-dom": "^18.1.0",
"react-dropzone": "^11.4.2",
"react-grid-layout": "^1.2.0",
"react-hot-loader": "^4.13.0",
"react-moment": "^1.1.1",
"react-redux": "^7.1.3",
"react-router-dom": "^5.1.2",
"react-virtualized": "^9.22.2",
"react-window": "^1.8.6",
"react-virtualized": "^9.22.3",
"react-window": "^1.8.7",
"react-window-infinite-loader": "^1.0.7",
"recharts": "^2.1.1",
"redux": "^4.0.5",
@@ -64,7 +64,7 @@
"websocket": "^1.0.31"
},
"scripts": {
"start": "PORT=5005 react-app-rewired start",
"start": "PORT=5005 react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
@@ -87,11 +87,9 @@
"proxy": "http://localhost:9090/",
"devDependencies": {
"@types/react-window": "^1.8.5",
"@types/react-window-infinite-loader": "^1.0.5",
"@types/react-window-infinite-loader": "^1.0.6",
"@types/recharts": "^1.8.22",
"prettier": "2.6.2",
"react-app-rewire-hot-loader": "^2.0.1",
"react-app-rewired": "^2.1.6",
"react-scripts": "5.0.1",
"testcafe": "^1.18.6",
"typescript": "^4.4.3"

30
portal-ui/src/index.tsx
View File

@@ -15,7 +15,7 @@
// along with this program. If not, see <http://www.gnu.org/licenses/>.
import React from "react";
import ReactDOM from "react-dom";
import ReactDOM from "react-dom/client";
import { Provider } from "react-redux";
import Routes from "./Routes";
import { store } from "./store";
@@ -44,6 +44,7 @@ const GlobalCss = withStyles({
body: {
height: "100vh",
width: "100vw",
fontFamily: "Lato, sans-serif",
},
"#root": {
height: "100%",
@@ -63,7 +64,7 @@ const GlobalCss = withStyles({
},
},
// You should target [class*="MuiButton-root"] instead if you nest themes.
".MuiButton-root": {
".MuiButton-root:not(.noDefaultHeight)": {
height: 38,
},
".MuiButton-contained": {
@@ -126,16 +127,21 @@ const GlobalCss = withStyles({
},
})(() => null);
ReactDOM.render(
<Provider store={store}>
<GlobalCss />
<StyledEngineProvider injectFirst>
<ThemeProvider theme={theme}>
<Routes />
</ThemeProvider>
</StyledEngineProvider>
</Provider>,
document.getElementById("root")
const root = ReactDOM.createRoot(
document.getElementById("root") as HTMLElement
);
root.render(
<React.StrictMode>
<Provider store={store}>
<GlobalCss />
<StyledEngineProvider injectFirst>
<ThemeProvider theme={theme}>
<Routes />
</ThemeProvider>
</StyledEngineProvider>
</Provider>
</React.StrictMode>
);
// If you want your app to work offline and load faster, you can change

11
portal-ui/src/screens/Console/Buckets/BucketDetails/SummaryItems/RBIconButton.tsx
View File

@@ -14,7 +14,7 @@
// You should have received a copy of the GNU Affero General Public License
// along with this program. If not, see <http://www.gnu.org/licenses/>.
import React from "react";
import React, { Fragment } from "react";
import BoxIconButton from "../../../Common/BoxIconButton/BoxIconButton";
import { IconButtonProps } from "@mui/material";
import makeStyles from "@mui/styles/makeStyles";
@@ -93,10 +93,8 @@ const RBIconButton = (props: RBIconProps) => {
variant="outlined"
onClick={onClick}
disabled={disabled}
color="secondary"
size="medium"
sx={{
border: "1px solid #f44336",
"& span": {
fontSize: 14,
"@media (max-width: 900px)": {
@@ -109,7 +107,12 @@ const RBIconButton = (props: RBIconProps) => {
}}
{...restProps}
>
<span>{text}</span> {icon}
{text !== "" && (
<Fragment>
<span>{text}</span>
</Fragment>
)}
{icon}
</BoxIconButton>
);
};

1
portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/ListObjects.tsx
View File

@@ -1016,6 +1016,7 @@ const ListObjects = ({ match, history }: IListObjectsProps) => {
[bucketName, dispatch, simplePath]
);
const onDrop = useCallback(
(acceptedFiles: any[]) => {
if (acceptedFiles && acceptedFiles.length > 0) {

6
portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/ObjectActionButton.tsx
View File

@@ -19,6 +19,7 @@ import { Button } from "@mui/material";
import { Theme } from "@mui/material/styles";
import createStyles from "@mui/styles/createStyles";
import withStyles from "@mui/styles/withStyles";
import clsx from "clsx";
type ObjectActionButtonProps = {
disabled?: boolean;
@@ -67,8 +68,11 @@ const ObjectActionButton = ({
{...restProps}
disabled={disabled}
onClick={onClick}
className={classes.root}
className={clsx(classes.root, "noDefaultHeight")}
startIcon={icon}
sx={{
height: "initial"
}}
>
<span className={"buttonItem"}>{label}</span>
</Button>

1
portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ObjectDetails/VersionsNavigator.tsx
View File

@@ -599,6 +599,7 @@ const VersionsNavigator = ({
</Grid>
<Grid item xs={12} className={classes.versionsVirtualPanel}>
{actualInfo.version_id && actualInfo.version_id !== "null" && (
// @ts-ignore
<List
style={{
width: "100%",

5
portal-ui/src/screens/Console/Common/BoxIconButton/BoxIconButton.tsx
View File

@@ -27,8 +27,6 @@ const styles = (theme: Theme) =>
padding: 8,
marginLeft: 8,
borderWidth: 1,
borderColor: "#696969",
color: "#696969",
borderStyle: "solid",
borderRadius: 3,
"& .min-icon": {
@@ -44,6 +42,9 @@ const styles = (theme: Theme) =>
color: "#EBEBEB",
borderColor: "#EBEBEB",
},
"& > span:not(.BaseBadge-root)": {
paddingRight: 8,
}
},
contained: {
borderColor: theme.palette.primary.main,

2
portal-ui/src/screens/Console/Common/Components/withSuspense.tsx
View File

@@ -23,7 +23,7 @@ function withSuspense<P extends string | number | object>(
function ComponentWithSuspense(props: P) {
return (
<Suspense fallback={fallback}>
<WrappedComponent {...props} />
<WrappedComponent {...props as any} />
</Suspense>
);
}

2
portal-ui/src/screens/Console/Common/FormComponents/CodeMirrorWrapper/CodeMirrorWrapper.tsx
View File

@@ -54,7 +54,7 @@ const styles = (theme: Theme) =>
const langHighlight: Record<string, any> = {
json,
yaml: () => StreamLanguage.define(yaml),
yaml: () => StreamLanguage.define(yaml as any),
};
const lightTheme = EditorView.theme(

6
portal-ui/src/screens/Console/Common/TableWrapper/TableWrapper.tsx
View File

@@ -330,6 +330,7 @@ const generateColumnsMap = (
const disableSort = column.enableSort ? !column.enableSort : true;
return (
// @ts-ignore
<Column
key={`col-tb-${index.toString()}`}
dataKey={column.elementKey!}
@@ -581,6 +582,7 @@ const TableWrapper = ({
</div>
)}
{records && !isLoading && records.length > 0 ? (
// @ts-ignore
<InfiniteLoader
isRowLoaded={({ index }) => !!records[index]}
loadMoreRows={
@@ -595,6 +597,7 @@ const TableWrapper = ({
}
>
{({ onRowsRendered, registerChild }) => (
// @ts-ignore
<AutoSizer>
{({ width, height }: any) => {
const optionsWidth = calculateOptionsSize(
@@ -611,6 +614,7 @@ const TableWrapper = ({
itemActions[0].type !== "view")
);
return (
// @ts-ignore
<Table
ref={registerChild}
disableHeader={false}
@@ -659,6 +663,7 @@ const TableWrapper = ({
}}
>
{hasSelect && (
// @ts-ignore
<Column
headerRenderer={() => (
<Fragment>
@@ -742,6 +747,7 @@ const TableWrapper = ({
sortConfig ? sortConfig.currentDirection : undefined
)}
{hasOptions && (
// @ts-ignore
<Column
dataKey={idField}
width={optionsWidth}

1
portal-ui/src/screens/Console/Common/VirtualizedList/VirtualizedList.tsx
View File

@@ -58,6 +58,7 @@ const VirtualizedList = ({
itemCount={totalItems}
>
{({ onItemsRendered, ref }) => (
// @ts-ignore
<AutoSizer>
{({ width, height }) => {
return (

3
portal-ui/src/screens/Console/Tenants/TenantDetails/pods/PodLogs.tsx
View File

@@ -179,6 +179,7 @@ const PodLogs = ({
function cellRenderer({ columnIndex, key, parent, index, style }: any) {
return (
// @ts-ignore
<CellMeasurer
cache={cache}
columnIndex={columnIndex}
@@ -226,8 +227,10 @@ const PodLogs = ({
<Paper>
<div className={classes.logList}>
{logLines.length >= 1 && (
// @ts-ignore
<AutoSizer>
{({ width, height }) => (
// @ts-ignore
<List
rowHeight={(item) => cache.rowHeight(item)}
overscanRowCount={15}

3923
portal-ui/yarn.lock
View File

File diff suppressed because it is too large Load Diff