Skip to content

Commit aa9ecc7

Browse files
jackcloudqueryjackcloudquery
authored
Update cloud ui with MUI to v7 (#92)
1 parent 076045d commit aa9ecc7

19 files changed

+1963
-1318
lines changed

‎etc/plugin-config-ui-lib.api.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -875,7 +875,7 @@ export type UploadJSONProps = {
875875
};
876876

877877
// @public (undocumented)
878-
export const useConfigUIForm: () => UseFormReturn<any, any, undefined>;
878+
export const useConfigUIForm: () => UseFormReturn<any, any, any>;
879879

880880
// @public
881881
export const useCoreFormSchema: ({ initialValues, fields, secretFields, stateFields, }: UseCoreFormSchemaProps) => yup.ObjectSchema<{

‎package-lock.json

+1,895-1,249
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

+47-47
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "@cloudquery/plugin-config-ui-lib",
33
"description": "Plugin configuration UI library for CloudQuery Cloud App",
4-
"version": "7.1.2",
4+
"version": "8.0.0",
55
"private": false,
66
"main": "dist/index.cjs.js",
77
"module": "dist/index.esm.js",
@@ -78,27 +78,27 @@
7878
"chromatic": "npx chromatic"
7979
},
8080
"dependencies": {
81-
"@babel/runtime": "^7.26.7",
82-
"@cloudquery/cloud-ui": "^3.1.0",
83-
"@rudderstack/analytics-js": "^3.14.0",
81+
"@babel/runtime": "^7.27.0",
82+
"@cloudquery/cloud-ui": "^4.0.0",
83+
"@rudderstack/analytics-js": "^3.16.1",
8484
"dayjs": "^1.11.13",
8585
"decamelize": "^6.0.0",
8686
"handlebars": "^4.7.8",
8787
"humanize-string": "^3.0.0",
88-
"inquirer": "^12.4.1",
89-
"react-hook-form": "^7.54.2",
90-
"react-virtuoso": "^4.12.5"
88+
"inquirer": "^12.5.0",
89+
"react-hook-form": "^7.55.0",
90+
"react-virtuoso": "^4.12.6"
9191
},
9292
"peerDependencies": {
9393
"@cloudquery/plugin-config-ui-connector": "^1.0.0",
9494
"@emotion/cache": "^11.11.4",
9595
"@emotion/react": "^11.11.4",
9696
"@emotion/styled": "^11.11.4",
9797
"@monaco-editor/react": "^4.7.0",
98-
"@mui/icons-material": "^6.0.0",
99-
"@mui/lab": "^6.0.0-beta.9",
100-
"@mui/material": "^6.0.0",
101-
"@mui/system": "^6.0.0",
98+
"@mui/icons-material": "^7.0.0",
99+
"@mui/lab": "^7.0.0-beta.10",
100+
"@mui/material": "^7.0.0",
101+
"@mui/system": "^7.0.0",
102102
"@mui/x-date-pickers": "^7.6.2",
103103
"@playwright/test": "^1.47.2",
104104
"monaco-editor": "^0.52.2",
@@ -109,70 +109,70 @@
109109
},
110110
"devDependencies": {
111111
"@babel/plugin-syntax-dynamic-import": "^7.8.3",
112-
"@babel/preset-env": "^7.26.7",
112+
"@babel/preset-env": "^7.26.9",
113113
"@babel/preset-flow": "^7.25.9",
114114
"@babel/preset-react": "^7.26.3",
115-
"@babel/preset-typescript": "^7.26.0",
116-
"@chromatic-com/storybook": "^3.2.4",
115+
"@babel/preset-typescript": "^7.27.0",
116+
"@chromatic-com/storybook": "^3.2.6",
117117
"@cloudquery/plugin-config-ui-connector": "^1.0.0",
118-
"@emotion/cache": "^11.11.4",
119-
"@emotion/react": "^11.11.4",
120-
"@emotion/styled": "^11.11.4",
121-
"@microsoft/api-extractor": "^7.49.2",
118+
"@emotion/cache": "^11.14.0",
119+
"@emotion/react": "^11.14.0",
120+
"@emotion/styled": "^11.14.0",
121+
"@microsoft/api-extractor": "^7.52.2",
122122
"@monaco-editor/react": "^4.7.0",
123-
"@mui/icons-material": "^6.0.0",
124-
"@mui/lab": "^6.0.0-beta.9",
125-
"@mui/material": "^6.0.0",
126-
"@mui/system": "^6.0.0",
127-
"@mui/x-date-pickers": "^7.6.2",
128-
"@rollup/plugin-commonjs": "^28.0.2",
129-
"@rollup/plugin-node-resolve": "^16.0.0",
123+
"@mui/icons-material": "^7.0.1",
124+
"@mui/lab": "^7.0.0-beta.10",
125+
"@mui/material": "^7.0.1",
126+
"@mui/system": "^7.0.1",
127+
"@mui/x-date-pickers": "^7.28.2",
128+
"@rollup/plugin-commonjs": "^28.0.3",
129+
"@rollup/plugin-node-resolve": "^16.0.1",
130130
"@rollup/plugin-terser": "^0.4.4",
131131
"@rollup/plugin-typescript": "^12.1.2",
132-
"@storybook/addon-essentials": "^8.5.3",
133-
"@storybook/addon-interactions": "^8.5.3",
134-
"@storybook/addon-links": "^8.5.3",
135-
"@storybook/addon-onboarding": "^8.5.3",
136-
"@storybook/blocks": "^8.5.3",
137-
"@storybook/react": "^8.5.3",
138-
"@storybook/react-vite": "^8.5.3",
139-
"@storybook/test": "^8.5.3",
132+
"@storybook/addon-essentials": "^8.6.11",
133+
"@storybook/addon-interactions": "^8.6.11",
134+
"@storybook/addon-links": "^8.6.11",
135+
"@storybook/addon-onboarding": "^8.6.11",
136+
"@storybook/blocks": "^8.6.11",
137+
"@storybook/react": "^8.6.11",
138+
"@storybook/react-vite": "^8.6.11",
139+
"@storybook/test": "^8.6.11",
140140
"@testing-library/jest-dom": "^6.6.3",
141141
"@testing-library/react": "^16.2.0",
142142
"@testing-library/user-event": "^14.6.1",
143143
"@types/jest": "^29.5.14",
144-
"@types/node": "^22.13.0",
144+
"@types/node": "^22.13.14",
145145
"@types/react": "^18.3.8",
146-
"@typescript-eslint/eslint-plugin": "^8.22.0",
147-
"@typescript-eslint/parser": "^8.22.0",
148-
"chromatic": "^11.25.2",
146+
"@typescript-eslint/eslint-plugin": "^8.28.0",
147+
"@typescript-eslint/parser": "^8.28.0",
148+
"chromatic": "^11.27.0",
149149
"eslint": "^8.57.0",
150-
"eslint-config-prettier": "^10.0.1",
151-
"eslint-import-resolver-typescript": "^3.7.0",
150+
"eslint-config-prettier": "^10.1.1",
151+
"eslint-import-resolver-typescript": "^4.3.1",
152152
"eslint-plugin-import": "^2.31.0",
153153
"eslint-plugin-jsx-a11y": "^6.10.2",
154-
"eslint-plugin-prettier": "^5.2.3",
154+
"eslint-plugin-prettier": "^5.2.5",
155155
"eslint-plugin-react": "^7.37.4",
156-
"eslint-plugin-react-hooks": "^5.1.0",
156+
"eslint-plugin-react-hooks": "^5.2.0",
157157
"eslint-plugin-sort-destructure-keys": "^2.0.0",
158-
"eslint-plugin-storybook": "^0.11.2",
158+
"eslint-plugin-storybook": "^0.12.0",
159159
"eslint-plugin-unicorn": "^56.0.1",
160160
"jest": "^29.7.0",
161161
"jest-environment-jsdom": "^29.7.0",
162162
"monaco-editor": "^0.52.2",
163163
"monaco-yaml": "^5.3.1",
164-
"prettier": "^3.4.2",
164+
"prettier": "^3.5.3",
165165
"react": "^18.3.1",
166166
"react-dom": "^18.3.1",
167-
"react-hot-toast": "^2.5.1",
167+
"react-hot-toast": "^2.5.2",
168168
"resize-observer-polyfill": "^1.5.1",
169169
"rimraf": "^6.0.1",
170-
"rollup": "^4.34.1",
170+
"rollup": "^4.38.0",
171171
"rollup-plugin-copy": "^3.5.0",
172172
"rollup-plugin-peer-deps-external": "^2.2.4",
173173
"source-map-explorer": "^2.5.3",
174-
"storybook": "^8.5.3",
175-
"typescript": "^5.7.3",
174+
"storybook": "^8.6.11",
175+
"typescript": "^5.8.2",
176176
"vite-plugin-monaco-editor": "^1.1.0",
177177
"yup": "^1.6.1"
178178
}

‎src/components/display/codeSnippet/index.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { useMemo } from 'react';
22

33
import Box from '@mui/material/Box';
4-
import useTheme from '@mui/material/styles/useTheme';
4+
import { useTheme } from '@mui/material/styles';
55

66
import { CopyToClipboardButton } from './copyToClipboard';
77
import { highlightSyntax } from './highlightSyntax';

‎src/components/display/formStepper.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import Step from '@mui/material/Step';
44
import { StepIconProps } from '@mui/material/StepIcon';
55
import StepLabel from '@mui/material/StepLabel';
66
import Stepper from '@mui/material/Stepper';
7-
import useTheme from '@mui/material/styles/useTheme';
7+
import { useTheme } from '@mui/material/styles';
88

99
/**
1010
* @public

‎src/components/display/logo.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { useState } from 'react';
22

33
import Box from '@mui/material/Box';
44
import CircularProgress from '@mui/material/CircularProgress';
5-
import useTheme from '@mui/material/styles/useTheme';
5+
import { useTheme } from '@mui/material/styles';
66

77
import { parseSrc } from '../../utils/parseSrc';
88

‎src/components/display/serviceList.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import Box, { BoxProps } from '@mui/material/Box';
55
import Button from '@mui/material/Button';
66
import Checkbox from '@mui/material/Checkbox';
77
import Stack from '@mui/material/Stack';
8-
import useTheme from '@mui/material/styles/useTheme';
8+
import { useTheme } from '@mui/material/styles';
99
import Tab from '@mui/material/Tab';
1010
import Tabs from '@mui/material/Tabs';
1111
import ToggleButton from '@mui/material/ToggleButton';

‎src/components/display/testConnectionLogs/index.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import Box from '@mui/material/Box';
66
import Button from '@mui/material/Button';
77
import MenuItem from '@mui/material/MenuItem';
88
import Stack from '@mui/material/Stack';
9-
import useTheme from '@mui/material/styles/useTheme';
9+
import { useTheme } from '@mui/material/styles';
1010
import Typography from '@mui/material/Typography';
1111

1212
import { Virtuoso, VirtuosoHandle } from 'react-virtuoso';

‎src/components/display/tree/node.tsx

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
11
import React, { FC, ReactNode } from 'react';
22

33
import ListItem, { ListItemProps } from '@mui/material/ListItem';
4-
import { alpha } from '@mui/material/styles';
5-
import useTheme from '@mui/material/styles/useTheme';
4+
import { alpha, useTheme } from '@mui/material/styles';
65

76
import { usePluginSectionTableListKeyboardNavigation } from './utils/useKeyboardNavigation';
87

‎src/components/form/configUIForm.tsx

+1-2
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,7 @@ import Box from '@mui/material/Box';
99
import CssBaseline from '@mui/material/CssBaseline';
1010
import FormHelperText from '@mui/material/FormHelperText';
1111
import Stack from '@mui/material/Stack';
12-
import createTheme from '@mui/material/styles/createTheme';
13-
import ThemeProvider from '@mui/material/styles/ThemeProvider';
12+
import { createTheme, ThemeProvider } from '@mui/material/styles';
1413

1514
import { FormProvider, Path } from 'react-hook-form';
1615

‎src/components/form/controls/controlTableSelectorField.tsx

+4-2
Original file line numberDiff line numberDiff line change
@@ -35,9 +35,11 @@ function InternalPluginTableSelector() {
3535

3636
const subscribeToTablesValueChange = useCallback(
3737
(callback: (value: Record<string, boolean>) => void) => {
38-
const { unsubscribe } = control._subjects.values.subscribe({
38+
const { unsubscribe } = control._subjects.state.subscribe({
3939
next(payload) {
40-
callback(payload.values.tables);
40+
if (payload.name === 'tables' && payload.values?.tables) {
41+
callback(payload.values?.tables);
42+
}
4143
},
4244
});
4345

‎src/components/form/sections/collapsibleSubSection.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@ import Accordion, { AccordionProps } from '@mui/material/Accordion';
55
import AccordionDetails from '@mui/material/AccordionDetails';
66
import AccordionSummary from '@mui/material/AccordionSummary';
77
import Stack from '@mui/material/Stack';
8-
import useTheme from '@mui/material/styles/useTheme';
9-
import Typography from '@mui/material/Typography/Typography';
8+
import { useTheme } from '@mui/material/styles';
9+
import Typography from '@mui/material/Typography';
1010

1111
import { SubSection } from './subSection';
1212

‎src/components/form/sections/subSection.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from 'react';
22

33
import Stack from '@mui/material/Stack';
4-
import Typography from '@mui/material/Typography/Typography';
4+
import Typography from '@mui/material/Typography';
55

66
/**
77
* @public

‎src/components/inputs/exclusiveToggle/index.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { forwardRef, ReactNode } from 'react';
22

33
import Radio from '@mui/material/Radio';
44
import Stack from '@mui/material/Stack';
5-
import useTheme from '@mui/material/styles/useTheme';
5+
import { useTheme } from '@mui/material/styles';
66
import ToggleButton from '@mui/material/ToggleButton';
77
import ToggleButtonGroup from '@mui/material/ToggleButtonGroup';
88
import Typography from '@mui/material/Typography';

‎src/components/inputs/searchInput.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import SearchIcon from '@mui/icons-material/Search';
2-
import styled from '@mui/material/styles/styled';
2+
import { styled } from '@mui/material/styles';
33
import TextField, { TextFieldProps } from '@mui/material/TextField';
44

55
const StyledTextField = styled(TextField)(({ theme }) => ({

‎src/components/inputs/tableSelector/filters.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import FormControlLabel from '@mui/material/FormControlLabel';
77
import Menu from '@mui/material/Menu';
88
import Radio from '@mui/material/Radio';
99
import RadioGroup from '@mui/material/RadioGroup';
10-
import useTheme from '@mui/material/styles/useTheme';
10+
import { useTheme } from '@mui/material/styles';
1111

1212
import { SearchInput } from '../searchInput';
1313

‎src/components/inputs/tableSelector/index.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import Box from '@mui/material/Box';
44
import Checkbox from '@mui/material/Checkbox';
55
import FormControlLabel from '@mui/material/FormControlLabel';
66
import Stack from '@mui/material/Stack';
7-
import useTheme from '@mui/material/styles/useTheme';
7+
import { useTheme } from '@mui/material/styles';
88

99
import { TableSelectorFilters } from './filters';
1010
import { TableSelectorListItem } from './listItem';

‎src/hooks/useGetTestConnectionLogs.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { ReactNode, useCallback, useEffect, useRef, useState } from 'react';
22

3-
import useTheme from '@mui/material/styles/useTheme';
3+
import { useTheme } from '@mui/material/styles';
44

55
import { SyncLogLevel } from '../types';
66
import customFetch from '../utils/customFetch';

‎src/utils/tests/renderWithTheme.tsx

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
11
import { ReactNode } from 'react';
22

33
import { createThemeOptions } from '@cloudquery/cloud-ui';
4-
import createTheme from '@mui/material/styles/createTheme';
5-
import ThemeProvider from '@mui/material/styles/ThemeProvider';
4+
import { createTheme, ThemeProvider } from '@mui/material/styles';
65

76
import { render as rtlRender } from '@testing-library/react';
87

0 commit comments

Comments
 (0)