implement twake mui

This commit is contained in:
lenhanphung
2025-12-29 14:27:06 +07:00
parent 9ff75056c7
commit 5f0479e34a
53 changed files with 235 additions and 259 deletions
+29 -24
View File
@@ -1,19 +1,24 @@
import { fireEvent, render, screen } from "@testing-library/react"; import { fireEvent, render, screen } from "@testing-library/react";
import React from "react"; import React from "react";
import { ResponsiveDialog } from "../../src/components/Dialog"; import { ResponsiveDialog } from "../../src/components/Dialog";
import { Button, TextField } from "@mui/material"; import { Button, TextField } from "twake-mui";
import { TwakeMuiThemeProvider } from "twake-mui";
describe("ResponsiveDialog", () => { describe("ResponsiveDialog", () => {
const mockOnClose = jest.fn(); const mockOnClose = jest.fn();
const mockOnExpandToggle = jest.fn(); const mockOnExpandToggle = jest.fn();
const renderWithTheme = (ui: React.ReactElement) => {
return render(<TwakeMuiThemeProvider>{ui}</TwakeMuiThemeProvider>);
};
beforeEach(() => { beforeEach(() => {
mockOnClose.mockClear(); mockOnClose.mockClear();
mockOnExpandToggle.mockClear(); mockOnExpandToggle.mockClear();
}); });
it("renders in normal mode by default", () => { it("renders in normal mode by default", () => {
render( renderWithTheme(
<ResponsiveDialog open={true} onClose={mockOnClose} title="Test Dialog"> <ResponsiveDialog open={true} onClose={mockOnClose} title="Test Dialog">
<TextField label="Name" /> <TextField label="Name" />
</ResponsiveDialog> </ResponsiveDialog>
@@ -24,7 +29,7 @@ describe("ResponsiveDialog", () => {
}); });
it("renders title in normal mode", () => { it("renders title in normal mode", () => {
render( renderWithTheme(
<ResponsiveDialog <ResponsiveDialog
open={true} open={true}
onClose={mockOnClose} onClose={mockOnClose}
@@ -40,7 +45,7 @@ describe("ResponsiveDialog", () => {
}); });
it("renders back arrow in extended mode", () => { it("renders back arrow in extended mode", () => {
render( renderWithTheme(
<ResponsiveDialog <ResponsiveDialog
open={true} open={true}
onClose={mockOnClose} onClose={mockOnClose}
@@ -57,7 +62,7 @@ describe("ResponsiveDialog", () => {
}); });
it("calls onExpandToggle when back arrow is clicked", () => { it("calls onExpandToggle when back arrow is clicked", () => {
render( renderWithTheme(
<ResponsiveDialog <ResponsiveDialog
open={true} open={true}
onClose={mockOnClose} onClose={mockOnClose}
@@ -76,7 +81,7 @@ describe("ResponsiveDialog", () => {
}); });
it("renders actions when provided", () => { it("renders actions when provided", () => {
render( renderWithTheme(
<ResponsiveDialog <ResponsiveDialog
open={true} open={true}
onClose={mockOnClose} onClose={mockOnClose}
@@ -91,7 +96,7 @@ describe("ResponsiveDialog", () => {
}); });
it("does not render actions when not provided", () => { it("does not render actions when not provided", () => {
const { container } = render( const { container } = renderWithTheme(
<ResponsiveDialog open={true} onClose={mockOnClose} title="Test"> <ResponsiveDialog open={true} onClose={mockOnClose} title="Test">
<div>Content</div> <div>Content</div>
</ResponsiveDialog> </ResponsiveDialog>
@@ -102,7 +107,7 @@ describe("ResponsiveDialog", () => {
}); });
it("calls onClose when backdrop is clicked", () => { it("calls onClose when backdrop is clicked", () => {
render( renderWithTheme(
<ResponsiveDialog open={true} onClose={mockOnClose} title="Test"> <ResponsiveDialog open={true} onClose={mockOnClose} title="Test">
<div>Content</div> <div>Content</div>
</ResponsiveDialog> </ResponsiveDialog>
@@ -117,7 +122,7 @@ describe("ResponsiveDialog", () => {
}); });
it("applies custom normalMaxWidth", () => { it("applies custom normalMaxWidth", () => {
render( renderWithTheme(
<ResponsiveDialog <ResponsiveDialog
open={true} open={true}
onClose={mockOnClose} onClose={mockOnClose}
@@ -132,7 +137,7 @@ describe("ResponsiveDialog", () => {
}); });
it("wraps children in Stack component", () => { it("wraps children in Stack component", () => {
render( renderWithTheme(
<ResponsiveDialog open={true} onClose={mockOnClose} title="Test"> <ResponsiveDialog open={true} onClose={mockOnClose} title="Test">
<TextField label="Field 1" /> <TextField label="Field 1" />
<TextField label="Field 2" /> <TextField label="Field 2" />
@@ -144,7 +149,7 @@ describe("ResponsiveDialog", () => {
}); });
it("uses correct spacing in normal mode", () => { it("uses correct spacing in normal mode", () => {
render( renderWithTheme(
<ResponsiveDialog <ResponsiveDialog
open={true} open={true}
onClose={mockOnClose} onClose={mockOnClose}
@@ -160,7 +165,7 @@ describe("ResponsiveDialog", () => {
}); });
it("uses correct spacing in extended mode", () => { it("uses correct spacing in extended mode", () => {
render( renderWithTheme(
<ResponsiveDialog <ResponsiveDialog
open={true} open={true}
onClose={mockOnClose} onClose={mockOnClose}
@@ -176,7 +181,7 @@ describe("ResponsiveDialog", () => {
}); });
it("applies contentSx custom styles", () => { it("applies contentSx custom styles", () => {
render( renderWithTheme(
<ResponsiveDialog <ResponsiveDialog
open={true} open={true}
onClose={mockOnClose} onClose={mockOnClose}
@@ -191,7 +196,7 @@ describe("ResponsiveDialog", () => {
}); });
it("applies titleSx custom styles", () => { it("applies titleSx custom styles", () => {
const { container } = render( const { container } = renderWithTheme(
<ResponsiveDialog <ResponsiveDialog
open={true} open={true}
onClose={mockOnClose} onClose={mockOnClose}
@@ -207,7 +212,7 @@ describe("ResponsiveDialog", () => {
}); });
it("shows dividers when dividers prop is true", () => { it("shows dividers when dividers prop is true", () => {
render( renderWithTheme(
<ResponsiveDialog <ResponsiveDialog
open={true} open={true}
onClose={mockOnClose} onClose={mockOnClose}
@@ -222,7 +227,7 @@ describe("ResponsiveDialog", () => {
}); });
it("does not show back arrow when onExpandToggle is not provided", () => { it("does not show back arrow when onExpandToggle is not provided", () => {
render( renderWithTheme(
<ResponsiveDialog <ResponsiveDialog
open={true} open={true}
onClose={mockOnClose} onClose={mockOnClose}
@@ -238,7 +243,7 @@ describe("ResponsiveDialog", () => {
}); });
it("accepts custom headerHeight", () => { it("accepts custom headerHeight", () => {
render( renderWithTheme(
<ResponsiveDialog <ResponsiveDialog
open={true} open={true}
onClose={mockOnClose} onClose={mockOnClose}
@@ -254,7 +259,7 @@ describe("ResponsiveDialog", () => {
}); });
it("renders with custom expandedContentMaxWidth", () => { it("renders with custom expandedContentMaxWidth", () => {
render( renderWithTheme(
<ResponsiveDialog <ResponsiveDialog
open={true} open={true}
onClose={mockOnClose} onClose={mockOnClose}
@@ -270,7 +275,7 @@ describe("ResponsiveDialog", () => {
}); });
it("does not render dialog content when open is false", () => { it("does not render dialog content when open is false", () => {
render( renderWithTheme(
<ResponsiveDialog open={false} onClose={mockOnClose} title="Test"> <ResponsiveDialog open={false} onClose={mockOnClose} title="Test">
<div>Test Content</div> <div>Test Content</div>
</ResponsiveDialog> </ResponsiveDialog>
@@ -280,7 +285,7 @@ describe("ResponsiveDialog", () => {
}); });
it("renders correctly in extended mode", () => { it("renders correctly in extended mode", () => {
render( renderWithTheme(
<ResponsiveDialog <ResponsiveDialog
open={true} open={true}
onClose={mockOnClose} onClose={mockOnClose}
@@ -297,7 +302,7 @@ describe("ResponsiveDialog", () => {
}); });
it("renders expand and close icons in normal mode when showHeaderActions is true", () => { it("renders expand and close icons in normal mode when showHeaderActions is true", () => {
render( renderWithTheme(
<ResponsiveDialog <ResponsiveDialog
open={true} open={true}
onClose={mockOnClose} onClose={mockOnClose}
@@ -315,7 +320,7 @@ describe("ResponsiveDialog", () => {
}); });
it("does not render header icons when showHeaderActions is false", () => { it("does not render header icons when showHeaderActions is false", () => {
render( renderWithTheme(
<ResponsiveDialog <ResponsiveDialog
open={true} open={true}
onClose={mockOnClose} onClose={mockOnClose}
@@ -334,7 +339,7 @@ describe("ResponsiveDialog", () => {
}); });
it("calls onClose when close icon is clicked", () => { it("calls onClose when close icon is clicked", () => {
render( renderWithTheme(
<ResponsiveDialog <ResponsiveDialog
open={true} open={true}
onClose={mockOnClose} onClose={mockOnClose}
@@ -353,7 +358,7 @@ describe("ResponsiveDialog", () => {
}); });
it("calls onExpandToggle when expand icon is clicked", () => { it("calls onExpandToggle when expand icon is clicked", () => {
render( renderWithTheme(
<ResponsiveDialog <ResponsiveDialog
open={true} open={true}
onClose={mockOnClose} onClose={mockOnClose}
+25 -22
View File
@@ -4,6 +4,7 @@ import React, { PropsWithChildren } from "react";
import { Provider } from "react-redux"; import { Provider } from "react-redux";
import { MemoryRouter } from "react-router-dom"; import { MemoryRouter } from "react-router-dom";
import { I18nContext } from "twake-i18n"; import { I18nContext } from "twake-i18n";
import { TwakeMuiThemeProvider } from "twake-mui";
import type { AppStore, RootState } from "../../src/app/store"; import type { AppStore, RootState } from "../../src/app/store";
import { setupStore } from "../../src/app/store"; import { setupStore } from "../../src/app/store";
interface ExtendedRenderOptions extends Omit<RenderOptions, "queries"> { interface ExtendedRenderOptions extends Omit<RenderOptions, "queries"> {
@@ -21,28 +22,30 @@ export function renderWithProviders(
const Wrapper = ({ children }: PropsWithChildren) => { const Wrapper = ({ children }: PropsWithChildren) => {
return ( return (
<I18nContext.Provider <TwakeMuiThemeProvider>
value={{ <I18nContext.Provider
t: (key: string, vars?: Record<string, string>) => { value={{
if (key === "locale") { t: (key: string, vars?: Record<string, string>) => {
return "en"; if (key === "locale") {
} return "en";
if (vars) { }
const params = Object.entries(vars) if (vars) {
.map(([k, v]) => `${k}=${v}`) const params = Object.entries(vars)
.join(","); .map(([k, v]) => `${k}=${v}`)
return `${key}(${params})`; .join(",");
} return `${key}(${params})`;
return key; }
}, return key;
f: (date: Date, formatStr: string) => date.toString(), },
lang: "en", f: (date: Date, formatStr: string) => date.toString(),
}} lang: "en",
> }}
<MemoryRouter initialEntries={["/"]}> >
<Provider store={store}>{children}</Provider> <MemoryRouter initialEntries={["/"]}>
</MemoryRouter> <Provider store={store}>{children}</Provider>
</I18nContext.Provider> </MemoryRouter>
</I18nContext.Provider>
</TwakeMuiThemeProvider>
); );
}; };
+5 -1
View File
@@ -37,7 +37,11 @@ const config: Config = {
"/node_modules/(?!(preact|@fullcalendar|react-calendar|get-user-locale|memoize|mimic-function|@wojtekmaj|ky|cozy-ui)/)", "/node_modules/(?!(preact|@fullcalendar|react-calendar|get-user-locale|memoize|mimic-function|@wojtekmaj|ky|cozy-ui)/)",
], ],
moduleNameMapper: { "^preact(/(.*)|$)": "preact$1" }, moduleNameMapper: {
"^preact(/(.*)|$)": "preact$1",
"^react$": "<rootDir>/node_modules/react",
"^react-dom$": "<rootDir>/node_modules/react-dom",
},
setupFilesAfterEnv: ["<rootDir>/src/setupTests.ts"], setupFilesAfterEnv: ["<rootDir>/src/setupTests.ts"],
}, },
{ {
+31 -38
View File
@@ -35,6 +35,7 @@
"react-router-dom": "^6.23.1", "react-router-dom": "^6.23.1",
"redux-first-history": "^5.2.0", "redux-first-history": "^5.2.0",
"twake-i18n": "^0.3.0", "twake-i18n": "^0.3.0",
"twake-mui": "file:../twake-ui/packages/twake-mui",
"web-vitals": "^2.1.4" "web-vitals": "^2.1.4"
}, },
"devDependencies": { "devDependencies": {
@@ -77,6 +78,29 @@
"node": "24.x" "node": "24.x"
} }
}, },
"../twake-ui/packages/twake-mui": {
"version": "1.0.0",
"license": "MIT",
"dependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0"
},
"devDependencies": {
"@types/react": "^18.3.26",
"@types/react-dom": "^18.3.7",
"typescript": "^4.9.5"
},
"engines": {
"node": "24.x"
},
"peerDependencies": {
"@emotion/react": "^11.14.0",
"@emotion/styled": "^11.14.1",
"@mui/material": "^7.1.2",
"react": "^18.2.0",
"react-dom": "^18.2.0"
}
},
"node_modules/@adobe/css-tools": { "node_modules/@adobe/css-tools": {
"version": "4.4.4", "version": "4.4.4",
"resolved": "https://registry.npmjs.org/@adobe/css-tools/-/css-tools-4.4.4.tgz", "resolved": "https://registry.npmjs.org/@adobe/css-tools/-/css-tools-4.4.4.tgz",
@@ -135,7 +159,6 @@
"integrity": "sha512-e7jT4DxYvIDLk1ZHmU/m/mB19rex9sv0c2ftBtjSBv+kVM/902eh0fINUzD7UwLLNR+jU585GxUJ8/EBfAM5fw==", "integrity": "sha512-e7jT4DxYvIDLk1ZHmU/m/mB19rex9sv0c2ftBtjSBv+kVM/902eh0fINUzD7UwLLNR+jU585GxUJ8/EBfAM5fw==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@babel/code-frame": "^7.27.1", "@babel/code-frame": "^7.27.1",
"@babel/generator": "^7.28.5", "@babel/generator": "^7.28.5",
@@ -2046,7 +2069,6 @@
} }
], ],
"license": "MIT", "license": "MIT",
"peer": true,
"engines": { "engines": {
"node": ">=18" "node": ">=18"
}, },
@@ -2070,7 +2092,6 @@
} }
], ],
"license": "MIT", "license": "MIT",
"peer": true,
"engines": { "engines": {
"node": ">=18" "node": ">=18"
} }
@@ -2173,7 +2194,6 @@
"resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.14.0.tgz", "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.14.0.tgz",
"integrity": "sha512-O000MLDBDdk/EohJPFUqvnp4qnHeYkVP5B0xEG0D/L7cOKP9kefu2DXn8dj74cQfsEzUqh+sr1RzFqiL1o+PpA==", "integrity": "sha512-O000MLDBDdk/EohJPFUqvnp4qnHeYkVP5B0xEG0D/L7cOKP9kefu2DXn8dj74cQfsEzUqh+sr1RzFqiL1o+PpA==",
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@babel/runtime": "^7.18.3", "@babel/runtime": "^7.18.3",
"@emotion/babel-plugin": "^11.13.5", "@emotion/babel-plugin": "^11.13.5",
@@ -2217,7 +2237,6 @@
"resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.14.1.tgz", "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.14.1.tgz",
"integrity": "sha512-qEEJt42DuToa3gurlH4Qqc1kVpNq8wO8cJtDzU46TjlzWjDlsVyevtYCRijVq3SrHsROS+gVQ8Fnea108GnKzw==", "integrity": "sha512-qEEJt42DuToa3gurlH4Qqc1kVpNq8wO8cJtDzU46TjlzWjDlsVyevtYCRijVq3SrHsROS+gVQ8Fnea108GnKzw==",
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@babel/runtime": "^7.18.3", "@babel/runtime": "^7.18.3",
"@emotion/babel-plugin": "^11.13.5", "@emotion/babel-plugin": "^11.13.5",
@@ -2490,7 +2509,6 @@
"resolved": "https://registry.npmjs.org/@fullcalendar/core/-/core-6.1.19.tgz", "resolved": "https://registry.npmjs.org/@fullcalendar/core/-/core-6.1.19.tgz",
"integrity": "sha512-z0aVlO5e4Wah6p6mouM0UEqtRf1MZZPt4mwzEyU6kusaNL+dlWQgAasF2cK23hwT4cmxkEmr4inULXgpyeExdQ==", "integrity": "sha512-z0aVlO5e4Wah6p6mouM0UEqtRf1MZZPt4mwzEyU6kusaNL+dlWQgAasF2cK23hwT4cmxkEmr4inULXgpyeExdQ==",
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"preact": "~10.12.1" "preact": "~10.12.1"
} }
@@ -3213,7 +3231,6 @@
"resolved": "https://registry.npmjs.org/@mui/material/-/material-7.3.6.tgz", "resolved": "https://registry.npmjs.org/@mui/material/-/material-7.3.6.tgz",
"integrity": "sha512-R4DaYF3dgCQCUAkr4wW1w26GHXcf5rCmBRHVBuuvJvaGLmZdD8EjatP80Nz5JCw0KxORAzwftnHzXVnjR8HnFw==", "integrity": "sha512-R4DaYF3dgCQCUAkr4wW1w26GHXcf5rCmBRHVBuuvJvaGLmZdD8EjatP80Nz5JCw0KxORAzwftnHzXVnjR8HnFw==",
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@babel/runtime": "^7.28.4", "@babel/runtime": "^7.28.4",
"@mui/core-downloads-tracker": "^7.3.6", "@mui/core-downloads-tracker": "^7.3.6",
@@ -3324,7 +3341,6 @@
"resolved": "https://registry.npmjs.org/@mui/system/-/system-7.3.6.tgz", "resolved": "https://registry.npmjs.org/@mui/system/-/system-7.3.6.tgz",
"integrity": "sha512-8fehAazkHNP1imMrdD2m2hbA9sl7Ur6jfuNweh5o4l9YPty4iaZzRXqYvBCWQNwFaSHmMEj2KPbyXGp7Bt73Rg==", "integrity": "sha512-8fehAazkHNP1imMrdD2m2hbA9sl7Ur6jfuNweh5o4l9YPty4iaZzRXqYvBCWQNwFaSHmMEj2KPbyXGp7Bt73Rg==",
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@babel/runtime": "^7.28.4", "@babel/runtime": "^7.28.4",
"@mui/private-theming": "^7.3.6", "@mui/private-theming": "^7.3.6",
@@ -3683,7 +3699,6 @@
"integrity": "sha512-7Isd9G6ufIK5+kPCH8OhvVAVD5clsak9bp9IfhyEWT8SH43cLuXsUpK+4w0a6JA/kM98ea7KJEigIuCHJ5wAag==", "integrity": "sha512-7Isd9G6ufIK5+kPCH8OhvVAVD5clsak9bp9IfhyEWT8SH43cLuXsUpK+4w0a6JA/kM98ea7KJEigIuCHJ5wAag==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@rspack/core": "1.6.6", "@rspack/core": "1.6.6",
"@rspack/lite-tapable": "~1.1.0", "@rspack/lite-tapable": "~1.1.0",
@@ -3911,7 +3926,6 @@
"integrity": "sha512-2mR+2YBydlgZ7Q0Rpd6bCC3MBnV9TS0x857K0zIhbDj4BQOqaWVy1n7fx/B3MrS8TR0QCuzKfyDAjNz+XTyJVQ==", "integrity": "sha512-2mR+2YBydlgZ7Q0Rpd6bCC3MBnV9TS0x857K0zIhbDj4BQOqaWVy1n7fx/B3MrS8TR0QCuzKfyDAjNz+XTyJVQ==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@module-federation/runtime-tools": "0.21.6", "@module-federation/runtime-tools": "0.21.6",
"@rspack/binding": "1.6.6", "@rspack/binding": "1.6.6",
@@ -4171,7 +4185,6 @@
"integrity": "sha512-8QqtOQT5ACVlmsvKOJNEaWmRPmcojMOzCz4Hs2BGG/toAp/K38LcsMRyLp349glq5AzJbCEeimEoxaX6v/fLrA==", "integrity": "sha512-8QqtOQT5ACVlmsvKOJNEaWmRPmcojMOzCz4Hs2BGG/toAp/K38LcsMRyLp349glq5AzJbCEeimEoxaX6v/fLrA==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@babel/core": "^7.21.3", "@babel/core": "^7.21.3",
"@svgr/babel-preset": "8.1.0", "@svgr/babel-preset": "8.1.0",
@@ -4256,7 +4269,6 @@
"integrity": "sha512-5IKx/Y13RsYd+sauPb2x+U/xZikHjolzfuDgTAl/Tdf3Q8rslRvC19NKDLgAJQ6wsqADk10ntlv08nPFw/gO/A==", "integrity": "sha512-5IKx/Y13RsYd+sauPb2x+U/xZikHjolzfuDgTAl/Tdf3Q8rslRvC19NKDLgAJQ6wsqADk10ntlv08nPFw/gO/A==",
"dev": true, "dev": true,
"license": "Apache-2.0", "license": "Apache-2.0",
"peer": true,
"dependencies": { "dependencies": {
"tslib": "^2.8.0" "tslib": "^2.8.0"
} }
@@ -4267,7 +4279,6 @@
"integrity": "sha512-o4PXJQidqJl82ckFaXUeoAW+XysPLauYI43Abki5hABd853iMhitooc6znOnczgbTYmEP6U6/y1ZyKAIsvMKGg==", "integrity": "sha512-o4PXJQidqJl82ckFaXUeoAW+XysPLauYI43Abki5hABd853iMhitooc6znOnczgbTYmEP6U6/y1ZyKAIsvMKGg==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@babel/code-frame": "^7.10.4", "@babel/code-frame": "^7.10.4",
"@babel/runtime": "^7.12.5", "@babel/runtime": "^7.12.5",
@@ -4560,7 +4571,6 @@
"resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.27.tgz", "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.27.tgz",
"integrity": "sha512-cisd7gxkzjBKU2GgdYrTdtQx1SORymWyaAFhaxQPK9bYO9ot3Y5OikQRvY0VYQtvwjeQnizCINJAenh/V7MK2w==", "integrity": "sha512-cisd7gxkzjBKU2GgdYrTdtQx1SORymWyaAFhaxQPK9bYO9ot3Y5OikQRvY0VYQtvwjeQnizCINJAenh/V7MK2w==",
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@types/prop-types": "*", "@types/prop-types": "*",
"csstype": "^3.2.2" "csstype": "^3.2.2"
@@ -4572,7 +4582,6 @@
"integrity": "sha512-MEe3UeoENYVFXzoXEWsvcpg6ZvlrFNlOQ7EOsvhI3CfAXwzPfO8Qwuxd40nepsYKqyyVQnTdEfv68q91yLcKrQ==", "integrity": "sha512-MEe3UeoENYVFXzoXEWsvcpg6ZvlrFNlOQ7EOsvhI3CfAXwzPfO8Qwuxd40nepsYKqyyVQnTdEfv68q91yLcKrQ==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"peerDependencies": { "peerDependencies": {
"@types/react": "^18.0.0" "@types/react": "^18.0.0"
} }
@@ -4629,7 +4638,6 @@
"integrity": "sha512-X63hI1bxl5ohelzr0LY5coufyl0LJNthld+abwxpCoo6Gq+hSqhKwci7MUWkXo67mzgUK6YFByhmaHmUcuBJmA==", "integrity": "sha512-X63hI1bxl5ohelzr0LY5coufyl0LJNthld+abwxpCoo6Gq+hSqhKwci7MUWkXo67mzgUK6YFByhmaHmUcuBJmA==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@eslint-community/regexpp": "^4.10.0", "@eslint-community/regexpp": "^4.10.0",
"@typescript-eslint/scope-manager": "8.48.1", "@typescript-eslint/scope-manager": "8.48.1",
@@ -4660,7 +4668,6 @@
"integrity": "sha512-PC0PDZfJg8sP7cmKe6L3QIL8GZwU5aRvUFedqSIpw3B+QjRSUZeeITC2M5XKeMXEzL6wccN196iy3JLwKNvDVA==", "integrity": "sha512-PC0PDZfJg8sP7cmKe6L3QIL8GZwU5aRvUFedqSIpw3B+QjRSUZeeITC2M5XKeMXEzL6wccN196iy3JLwKNvDVA==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@typescript-eslint/scope-manager": "8.48.1", "@typescript-eslint/scope-manager": "8.48.1",
"@typescript-eslint/types": "8.48.1", "@typescript-eslint/types": "8.48.1",
@@ -5167,7 +5174,6 @@
"integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==", "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"bin": { "bin": {
"acorn": "bin/acorn" "acorn": "bin/acorn"
}, },
@@ -5909,7 +5915,6 @@
} }
], ],
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"baseline-browser-mapping": "^2.9.0", "baseline-browser-mapping": "^2.9.0",
"caniuse-lite": "^1.0.30001759", "caniuse-lite": "^1.0.30001759",
@@ -6615,7 +6620,6 @@
"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.30.0.tgz", "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.30.0.tgz",
"integrity": "sha512-fnULvOpxnC5/Vg3NCiWelDsLiUc9bRwAPs/+LfTLNvetFCtCTN+yQz15C/fs4AwX1R9K5GLtLfn8QW+dWisaAw==", "integrity": "sha512-fnULvOpxnC5/Vg3NCiWelDsLiUc9bRwAPs/+LfTLNvetFCtCTN+yQz15C/fs4AwX1R9K5GLtLfn8QW+dWisaAw==",
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@babel/runtime": "^7.21.0" "@babel/runtime": "^7.21.0"
}, },
@@ -6631,8 +6635,7 @@
"version": "1.11.19", "version": "1.11.19",
"resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.19.tgz", "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.19.tgz",
"integrity": "sha512-t5EcLVS6QPBNqM2z8fakk/NKel+Xzshgt8FFKAn+qwlD1pzZWxh0nVCrvFK7ZDb6XucZeF9z8C7CBWTRIVApAw==", "integrity": "sha512-t5EcLVS6QPBNqM2z8fakk/NKel+Xzshgt8FFKAn+qwlD1pzZWxh0nVCrvFK7ZDb6XucZeF9z8C7CBWTRIVApAw==",
"license": "MIT", "license": "MIT"
"peer": true
}, },
"node_modules/debug": { "node_modules/debug": {
"version": "4.4.3", "version": "4.4.3",
@@ -7222,7 +7225,6 @@
"integrity": "sha512-BhHmn2yNOFA9H9JmmIVKJmd288g9hrVRDkdoIgRCRuSySRUHH7r/DI6aAXW9T1WwUuY3DFgrcaqB+deURBLR5g==", "integrity": "sha512-BhHmn2yNOFA9H9JmmIVKJmd288g9hrVRDkdoIgRCRuSySRUHH7r/DI6aAXW9T1WwUuY3DFgrcaqB+deURBLR5g==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@eslint-community/eslint-utils": "^4.8.0", "@eslint-community/eslint-utils": "^4.8.0",
"@eslint-community/regexpp": "^4.12.1", "@eslint-community/regexpp": "^4.12.1",
@@ -8584,7 +8586,6 @@
"resolved": "https://registry.npmjs.org/history/-/history-5.3.0.tgz", "resolved": "https://registry.npmjs.org/history/-/history-5.3.0.tgz",
"integrity": "sha512-ZqaKwjjrAYUYfLG+htGaIIZ4nioX2L70ZUMIFysS3xvBsSG4x/n1V6TXV3N8ZYNuFGlDirFg32T7B6WOUPDYcQ==", "integrity": "sha512-ZqaKwjjrAYUYfLG+htGaIIZ4nioX2L70ZUMIFysS3xvBsSG4x/n1V6TXV3N8ZYNuFGlDirFg32T7B6WOUPDYcQ==",
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@babel/runtime": "^7.7.6" "@babel/runtime": "^7.7.6"
} }
@@ -9559,7 +9560,6 @@
"integrity": "sha512-F26gjC0yWN8uAA5m5Ss8ZQf5nDHWGlN/xWZIh8S5SRbsEKBovwZhxGd6LJlbZYxBgCYOtreSUyb8hpXyGC5O4A==", "integrity": "sha512-F26gjC0yWN8uAA5m5Ss8ZQf5nDHWGlN/xWZIh8S5SRbsEKBovwZhxGd6LJlbZYxBgCYOtreSUyb8hpXyGC5O4A==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@jest/core": "30.2.0", "@jest/core": "30.2.0",
"@jest/types": "30.2.0", "@jest/types": "30.2.0",
@@ -10324,7 +10324,6 @@
"integrity": "sha512-/xdLSWxK5QkqG524ONSjvg3V/FkNyCv538OIBdQqPNaAta3AsXj/Bd2FbvR87yMbXO2hFSWiAe/Q6IkVPDw+mw==", "integrity": "sha512-/xdLSWxK5QkqG524ONSjvg3V/FkNyCv538OIBdQqPNaAta3AsXj/Bd2FbvR87yMbXO2hFSWiAe/Q6IkVPDw+mw==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@babel/core": "^7.19.6", "@babel/core": "^7.19.6",
"@svgr/babel-preset": "^6.5.1", "@svgr/babel-preset": "^6.5.1",
@@ -10783,7 +10782,6 @@
"integrity": "sha512-Cvc9WUhxSMEo4McES3P7oK3QaXldCfNWp7pl2NNeiIFlCoLr3kfq9kb1fxftiwk1FLV7CvpvDfonxtzUDeSOPg==", "integrity": "sha512-Cvc9WUhxSMEo4McES3P7oK3QaXldCfNWp7pl2NNeiIFlCoLr3kfq9kb1fxftiwk1FLV7CvpvDfonxtzUDeSOPg==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"cssstyle": "^4.2.1", "cssstyle": "^4.2.1",
"data-urls": "^5.0.0", "data-urls": "^5.0.0",
@@ -11220,7 +11218,6 @@
"resolved": "https://registry.npmjs.org/moment/-/moment-2.30.1.tgz", "resolved": "https://registry.npmjs.org/moment/-/moment-2.30.1.tgz",
"integrity": "sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==", "integrity": "sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==",
"license": "MIT", "license": "MIT",
"peer": true,
"engines": { "engines": {
"node": "*" "node": "*"
} }
@@ -11230,7 +11227,6 @@
"resolved": "https://registry.npmjs.org/moment-timezone/-/moment-timezone-0.5.48.tgz", "resolved": "https://registry.npmjs.org/moment-timezone/-/moment-timezone-0.5.48.tgz",
"integrity": "sha512-f22b8LV1gbTO2ms2j2z13MuPogNoh5UzxL3nzNAYKGraILnbGc9NEE6dyiiiLv46DGRb8A4kg8UKWLjPthxBHw==", "integrity": "sha512-f22b8LV1gbTO2ms2j2z13MuPogNoh5UzxL3nzNAYKGraILnbGc9NEE6dyiiiLv46DGRb8A4kg8UKWLjPthxBHw==",
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"moment": "^2.29.4" "moment": "^2.29.4"
}, },
@@ -11266,6 +11262,7 @@
} }
], ],
"license": "MIT", "license": "MIT",
"peer": true,
"bin": { "bin": {
"nanoid": "bin/nanoid.cjs" "nanoid": "bin/nanoid.cjs"
}, },
@@ -12202,7 +12199,6 @@
"resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz", "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
"integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==", "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==",
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"loose-envify": "^1.1.0" "loose-envify": "^1.1.0"
}, },
@@ -12225,7 +12221,6 @@
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz", "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
"integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==", "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==",
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"loose-envify": "^1.1.0", "loose-envify": "^1.1.0",
"scheduler": "^0.23.2" "scheduler": "^0.23.2"
@@ -12245,7 +12240,6 @@
"resolved": "https://registry.npmjs.org/react-redux/-/react-redux-9.2.0.tgz", "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-9.2.0.tgz",
"integrity": "sha512-ROY9fvHhwOD9ySfrF0wmvu//bKCQ6AeZZq1nJNtbDC+kk5DuSuNX/n6YWYF/SYy7bSba4D4FSz8DJeKY/S/r+g==", "integrity": "sha512-ROY9fvHhwOD9ySfrF0wmvu//bKCQ6AeZZq1nJNtbDC+kk5DuSuNX/n6YWYF/SYy7bSba4D4FSz8DJeKY/S/r+g==",
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@types/use-sync-external-store": "^0.0.6", "@types/use-sync-external-store": "^0.0.6",
"use-sync-external-store": "^1.4.0" "use-sync-external-store": "^1.4.0"
@@ -12270,7 +12264,6 @@
"integrity": "sha512-QgT5//D3jfjJb6Gsjxv0Slpj23ip+HtOpnNgnb2S5zU3CB26G/IDPGoy4RJB42wzFE46DRsstbW6tKHoKbhAxw==", "integrity": "sha512-QgT5//D3jfjJb6Gsjxv0Slpj23ip+HtOpnNgnb2S5zU3CB26G/IDPGoy4RJB42wzFE46DRsstbW6tKHoKbhAxw==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"engines": { "engines": {
"node": ">=0.10.0" "node": ">=0.10.0"
} }
@@ -12371,8 +12364,7 @@
"version": "5.0.1", "version": "5.0.1",
"resolved": "https://registry.npmjs.org/redux/-/redux-5.0.1.tgz", "resolved": "https://registry.npmjs.org/redux/-/redux-5.0.1.tgz",
"integrity": "sha512-M9/ELqF6fy8FwmkpnF0S3YKOqMyoWJ4+CS5Efg2ct3oY9daQvd/Pc71FpGZsVsbl3Cpb+IIcjBDUnnyBdQbq4w==", "integrity": "sha512-M9/ELqF6fy8FwmkpnF0S3YKOqMyoWJ4+CS5Efg2ct3oY9daQvd/Pc71FpGZsVsbl3Cpb+IIcjBDUnnyBdQbq4w==",
"license": "MIT", "license": "MIT"
"peer": true
}, },
"node_modules/redux-first-history": { "node_modules/redux-first-history": {
"version": "5.2.0", "version": "5.2.0",
@@ -13599,7 +13591,6 @@
"integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==", "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"engines": { "engines": {
"node": ">=12" "node": ">=12"
}, },
@@ -13833,6 +13824,10 @@
"react-dom": "^16 || ^17 || ^18" "react-dom": "^16 || ^17 || ^18"
} }
}, },
"node_modules/twake-mui": {
"resolved": "../twake-ui/packages/twake-mui",
"link": true
},
"node_modules/type-check": { "node_modules/type-check": {
"version": "0.4.0", "version": "0.4.0",
"resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz", "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",
@@ -13953,7 +13948,6 @@
"integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==", "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==",
"dev": true, "dev": true,
"license": "Apache-2.0", "license": "Apache-2.0",
"peer": true,
"bin": { "bin": {
"tsc": "bin/tsc", "tsc": "bin/tsc",
"tsserver": "bin/tsserver" "tsserver": "bin/tsserver"
@@ -14746,7 +14740,6 @@
"integrity": "sha512-AvvthqfqrAhNH9dnfmrfKzX5upOdjUVJYFqNSlkmGf64gRaTzlPwz99IHYnVs28qYAybvAlBV+H7pn0saFY4Ig==", "integrity": "sha512-AvvthqfqrAhNH9dnfmrfKzX5upOdjUVJYFqNSlkmGf64gRaTzlPwz99IHYnVs28qYAybvAlBV+H7pn0saFY4Ig==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"peer": true,
"funding": { "funding": {
"url": "https://github.com/sponsors/colinhacks" "url": "https://github.com/sponsors/colinhacks"
} }
+1
View File
@@ -30,6 +30,7 @@
"react-router-dom": "^6.23.1", "react-router-dom": "^6.23.1",
"redux-first-history": "^5.2.0", "redux-first-history": "^5.2.0",
"twake-i18n": "^0.3.0", "twake-i18n": "^0.3.0",
"twake-mui": "file:../twake-ui/packages/twake-mui",
"web-vitals": "^2.1.4" "web-vitals": "^2.1.4"
}, },
"scripts": { "scripts": {
+11
View File
@@ -23,4 +23,15 @@ export default defineConfig({
}, },
minify: false, minify: false,
}, },
resolve: {
alias: {
react: require.resolve("react"),
"react-dom": require.resolve("react-dom"),
},
},
performance: {
chunkOverflow: {
maxAssetSize: 2000000,
},
},
}); });
+3 -3
View File
@@ -8,7 +8,7 @@ import { Loading } from "./components/Loading/Loading";
import HandleLogin from "./features/User/HandleLogin"; import HandleLogin from "./features/User/HandleLogin";
import CalendarLayout from "./components/Calendar/CalendarLayout"; import CalendarLayout from "./components/Calendar/CalendarLayout";
import { Error } from "./components/Error/Error"; import { Error } from "./components/Error/Error";
import { CustomThemeProvider } from "./theme/ThemeProvider"; import { TwakeMuiThemeProvider } from "twake-mui";
import { useAppDispatch, useAppSelector } from "./app/hooks"; import { useAppDispatch, useAppSelector } from "./app/hooks";
import { push } from "redux-first-history"; import { push } from "redux-first-history";
import { ErrorSnackbar } from "./components/Error/ErrorSnackbar"; import { ErrorSnackbar } from "./components/Error/ErrorSnackbar";
@@ -61,7 +61,7 @@ function App() {
}, [error, dispatch]); }, [error, dispatch]);
return ( return (
<CustomThemeProvider> <TwakeMuiThemeProvider>
<I18n <I18n
dictRequire={(lang: keyof typeof locale) => locale[lang]} dictRequire={(lang: keyof typeof locale) => locale[lang]}
lang={lang} lang={lang}
@@ -79,7 +79,7 @@ function App() {
<ErrorSnackbar error={error} type="user" /> <ErrorSnackbar error={error} type="user" />
</Suspense> </Suspense>
</I18n> </I18n>
</CustomThemeProvider> </TwakeMuiThemeProvider>
); );
} }
+12 -12
View File
@@ -1,12 +1,13 @@
import Autocomplete, { import {
AutocompleteRenderInputParams, Autocomplete,
} from "@mui/material/Autocomplete"; type AutocompleteRenderInputParams,
import Avatar from "@mui/material/Avatar"; Avatar,
import CircularProgress from "@mui/material/CircularProgress"; CircularProgress,
import ListItem from "@mui/material/ListItem"; ListItem,
import ListItemAvatar from "@mui/material/ListItemAvatar"; ListItemAvatar,
import ListItemText from "@mui/material/ListItemText"; ListItemText,
import TextField from "@mui/material/TextField"; TextField,
} from "twake-mui";
import { import {
type ReactNode, type ReactNode,
useCallback, useCallback,
@@ -16,12 +17,11 @@ import {
} from "react"; } from "react";
import { searchUsers } from "../../features/User/userAPI"; import { searchUsers } from "../../features/User/userAPI";
import PeopleOutlineOutlinedIcon from "@mui/icons-material/PeopleOutlineOutlined"; import PeopleOutlineOutlinedIcon from "@mui/icons-material/PeopleOutlineOutlined";
import Chip from "@mui/material/Chip"; import { Chip, useTheme } from "twake-mui";
import { useTheme } from "@mui/material/styles";
import { getAccessiblePair } from "../Calendar/utils/calendarColorsUtils"; import { getAccessiblePair } from "../Calendar/utils/calendarColorsUtils";
import { useI18n } from "twake-i18n"; import { useI18n } from "twake-i18n";
import { SnackbarAlert } from "../Loading/SnackBarAlert"; import { SnackbarAlert } from "../Loading/SnackBarAlert";
import { PopperProps, PaperProps } from "@mui/material"; import { PopperProps, PaperProps } from "twake-mui";
export interface User { export interface User {
email: string; email: string;
+1 -1
View File
@@ -9,7 +9,7 @@ import {
InputAdornment, InputAdornment,
Backdrop, Backdrop,
CircularProgress, CircularProgress,
} from "@mui/material"; } from "twake-mui";
import { useState, useEffect } from "react"; import { useState, useEffect } from "react";
import { import {
exportCalendar, exportCalendar,
+2 -3
View File
@@ -20,8 +20,7 @@ import { push } from "redux-first-history";
import EventPreviewModal from "../../features/Events/EventDisplayPreview"; import EventPreviewModal from "../../features/Events/EventDisplayPreview";
import AddIcon from "@mui/icons-material/Add"; import AddIcon from "@mui/icons-material/Add";
import { TempCalendarsInput } from "./TempCalendarsInput"; import { TempCalendarsInput } from "./TempCalendarsInput";
import Button from "@mui/material/Button"; import { Button, Box } from "twake-mui";
import { Box } from "@mui/material";
import { import {
updateSlotLabelVisibility, updateSlotLabelVisibility,
eventToFullCalendarFormat, eventToFullCalendarFormat,
@@ -36,7 +35,7 @@ import momentTimezonePlugin from "@fullcalendar/moment-timezone";
import { TimezoneSelector } from "./TimezoneSelector"; import { TimezoneSelector } from "./TimezoneSelector";
import { MiniCalendar } from "./MiniCalendar"; import { MiniCalendar } from "./MiniCalendar";
import { User } from "../Attendees/PeopleSearch"; import { User } from "../Attendees/PeopleSearch";
import { useTheme } from "@mui/material/styles"; import { useTheme } from "twake-mui";
import { updateDarkColor } from "./utils/calendarColorsUtils"; import { updateDarkColor } from "./utils/calendarColorsUtils";
import { useI18n } from "twake-i18n"; import { useI18n } from "twake-i18n";
import frLocale from "@fullcalendar/core/locales/fr"; import frLocale from "@fullcalendar/core/locales/fr";
@@ -7,7 +7,7 @@ import {
TextField, TextField,
Typography, Typography,
useTheme, useTheme,
} from "@mui/material"; } from "twake-mui";
import { useState } from "react"; import { useState } from "react";
import { HexColorPicker } from "react-colorful"; import { HexColorPicker } from "react-colorful";
import { useI18n } from "twake-i18n"; import { useI18n } from "twake-i18n";
+3 -3
View File
@@ -1,10 +1,10 @@
import React from "react"; import React from "react";
import { MenuItem } from "@mui/material"; import { MenuItem } from "@linagora/twake-mui";
import { Calendar } from "../../features/Calendars/CalendarTypes"; import { Calendars } from "../../features/Calendars/CalendarTypes";
import { CalendarName } from "./CalendarName"; import { CalendarName } from "./CalendarName";
export function CalendarItemList( export function CalendarItemList(
userPersonalCalendars: Calendar[] userPersonalCalendars: Calendars[]
): React.ReactNode { ): React.ReactNode {
return Object.values(userPersonalCalendars).map((calendar) => ( return Object.values(userPersonalCalendars).map((calendar) => (
<MenuItem key={calendar.id} value={calendar.id}> <MenuItem key={calendar.id} value={calendar.id}>
+3 -3
View File
@@ -1,4 +1,4 @@
import { Button, DialogActions, Tab, Tabs } from "@mui/material"; import { Button, Tab, Tabs } from "twake-mui";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { useAppDispatch, useAppSelector } from "../../app/hooks"; import { useAppDispatch, useAppSelector } from "../../app/hooks";
import { import {
@@ -198,7 +198,7 @@ function CalendarPopover({
</Tabs> </Tabs>
} }
actions={ actions={
<DialogActions> <>
<Button <Button
variant="outlined" variant="outlined"
onClick={(e) => handleClose({}, "backdropClick")} onClick={(e) => handleClose({}, "backdropClick")}
@@ -216,7 +216,7 @@ function CalendarPopover({
? t("actions.save") ? t("actions.save")
: t("actions.create")} : t("actions.create")}
</Button> </Button>
</DialogActions> </>
} }
> >
{tab === "import" && ( {tab === "import" && (
+3 -3
View File
@@ -1,7 +1,7 @@
import { Box, Typography } from "@mui/material"; import { Box, Typography } from "@linagora/twake-mui";
import { Calendar } from "../../features/Calendars/CalendarTypes"; import { Calendars } from "../../features/Calendars/CalendarTypes";
import SquareRoundedIcon from "@mui/icons-material/SquareRounded"; import SquareRoundedIcon from "@mui/icons-material/SquareRounded";
export function CalendarName({ calendar }: { calendar: Calendar }) { export function CalendarName({ calendar }: { calendar: Calendars }) {
return ( return (
<Box style={{ display: "flex", flexDirection: "row", gap: 8 }}> <Box style={{ display: "flex", flexDirection: "row", gap: 8 }}>
<SquareRoundedIcon <SquareRoundedIcon
+11 -9
View File
@@ -1,17 +1,19 @@
import CloseIcon from "@mui/icons-material/Close"; import CloseIcon from "@mui/icons-material/Close";
import Avatar from "@mui/material/Avatar"; import {
import Box from "@mui/material/Box"; Avatar,
import Button from "@mui/material/Button"; Box,
import IconButton from "@mui/material/IconButton"; Button,
import { useTheme } from "@mui/material/styles"; IconButton,
import Typography from "@mui/material/Typography"; Typography,
TextField,
useTheme,
} from "@linagora/twake-mui";
import { useI18n } from "twake-i18n"; import { useI18n } from "twake-i18n";
import { useState } from "react"; import { useState } from "react";
import { useAppDispatch, useAppSelector } from "../../app/hooks"; import { useAppDispatch, useAppSelector } from "../../app/hooks";
import { getCalendars } from "../../features/Calendars/CalendarApi"; import { getCalendars } from "../../features/Calendars/CalendarApi";
import { addSharedCalendarAsync } from "../../features/Calendars/CalendarSlice"; import { addSharedCalendarAsync } from "../../features/Calendars/CalendarSlice";
import { Calendar } from "../../features/Calendars/CalendarTypes"; import { Calendars } from "../../features/Calendars/CalendarTypes";
import TextField from "@mui/material/TextField";
import { PeopleSearch, User } from "../Attendees/PeopleSearch"; import { PeopleSearch, User } from "../Attendees/PeopleSearch";
import { ResponsiveDialog } from "../Dialog"; import { ResponsiveDialog } from "../Dialog";
import { ColorPicker } from "./CalendarColorPicker"; import { ColorPicker } from "./CalendarColorPicker";
@@ -93,7 +95,7 @@ function SelectedCalendarsList({
onRemove, onRemove,
onColorChange, onColorChange,
}: { }: {
calendars: Record<string, Calendar>; calendars: Record<string, Calendars>;
selectedCal: CalendarWithOwner[]; selectedCal: CalendarWithOwner[];
onRemove: (cal: CalendarWithOwner) => void; onRemove: (cal: CalendarWithOwner) => void;
onColorChange: ( onColorChange: (
+12 -7
View File
@@ -1,18 +1,23 @@
import Accordion from "@mui/material/Accordion"; import {
import AccordionDetails from "@mui/material/AccordionDetails"; Accordion,
import AccordionSummary from "@mui/material/AccordionSummary"; AccordionDetails,
import Typography from "@mui/material/Typography"; AccordionSummary,
Typography,
IconButton,
Checkbox,
Divider,
ListItem,
Menu,
MenuItem,
} from "twake-mui";
import { useAppDispatch, useAppSelector } from "../../app/hooks"; import { useAppDispatch, useAppSelector } from "../../app/hooks";
import AddIcon from "@mui/icons-material/Add"; import AddIcon from "@mui/icons-material/Add";
import { useState, useMemo, useEffect } from "react"; import { useState, useMemo, useEffect } from "react";
import CalendarPopover from "./CalendarModal"; import CalendarPopover from "./CalendarModal";
import { Calendar } from "../../features/Calendars/CalendarTypes"; import { Calendar } from "../../features/Calendars/CalendarTypes";
import MoreVertIcon from "@mui/icons-material/MoreVert"; import MoreVertIcon from "@mui/icons-material/MoreVert";
import IconButton from "@mui/material/IconButton";
import Checkbox from "@mui/material/Checkbox";
import ExpandMoreIcon from "@mui/icons-material/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import CalendarSearch from "./CalendarSearch"; import CalendarSearch from "./CalendarSearch";
import { Divider, ListItem, Menu, MenuItem } from "@mui/material";
import { removeCalendarAsync } from "../../features/Calendars/CalendarSlice"; import { removeCalendarAsync } from "../../features/Calendars/CalendarSlice";
import { DeleteCalendarDialog } from "./DeleteCalendarDialog"; import { DeleteCalendarDialog } from "./DeleteCalendarDialog";
import { trimLongTextWithoutSpace } from "../../utils/textUtils"; import { trimLongTextWithoutSpace } from "../../utils/textUtils";
@@ -1,10 +1,12 @@
import Dialog from "@mui/material/Dialog"; import {
import { Calendar } from "../../features/Calendars/CalendarTypes"; Dialog,
import DialogTitle from "@mui/material/DialogTitle"; DialogTitle,
import DialogContent from "@mui/material/DialogContent"; DialogContent,
import DialogContentText from "@mui/material/DialogContentText"; DialogContentText,
import DialogActions from "@mui/material/DialogActions"; DialogActions,
import Button from "@mui/material/Button"; Button,
} from "@linagora/twake-mui";
import { Calendars } from "../../features/Calendars/CalendarTypes";
import { useI18n } from "twake-i18n"; import { useI18n } from "twake-i18n";
export function DeleteCalendarDialog({ export function DeleteCalendarDialog({
@@ -17,7 +19,7 @@ export function DeleteCalendarDialog({
}: { }: {
deletePopupOpen: boolean; deletePopupOpen: boolean;
setDeletePopupOpen: (e: boolean) => void; setDeletePopupOpen: (e: boolean) => void;
calendars: Record<string, Calendar>; calendars: Record<string, Calendars>;
id: string; id: string;
isPersonal: boolean; isPersonal: boolean;
handleDeleteConfirm: () => void; handleDeleteConfirm: () => void;
+1 -1
View File
@@ -9,7 +9,7 @@ import {
ToggleButton, ToggleButton,
ToggleButtonGroup, ToggleButtonGroup,
Typography, Typography,
} from "@mui/material"; } from "twake-mui";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { useAppSelector } from "../../app/hooks"; import { useAppSelector } from "../../app/hooks";
import { CalendarItemList } from "./CalendarItemList"; import { CalendarItemList } from "./CalendarItemList";
+1 -1
View File
@@ -8,7 +8,7 @@ import {
ToggleButton, ToggleButton,
ToggleButtonGroup, ToggleButtonGroup,
Typography, Typography,
} from "@mui/material"; } from "twake-mui";
import { useI18n } from "twake-i18n"; import { useI18n } from "twake-i18n";
import { useState, useEffect } from "react"; import { useState, useEffect } from "react";
import { useAppSelector } from "../../app/hooks"; import { useAppSelector } from "../../app/hooks";
@@ -1,4 +1,4 @@
import { useTheme } from "@mui/material/styles"; import { useTheme } from "twake-mui";
import { useRef } from "react"; import { useRef } from "react";
import { useI18n } from "twake-i18n"; import { useI18n } from "twake-i18n";
import { useAppDispatch, useAppSelector } from "../../app/hooks"; import { useAppDispatch, useAppSelector } from "../../app/hooks";
@@ -8,7 +8,7 @@ import {
} from "../../features/Calendars/CalendarSlice"; } from "../../features/Calendars/CalendarSlice";
import { Calendar } from "../../features/Calendars/CalendarTypes"; import { Calendar } from "../../features/Calendars/CalendarTypes";
import { setView } from "../../features/Settings/SettingsSlice"; import { setView } from "../../features/Settings/SettingsSlice";
import TextField from "@mui/material/TextField"; import { TextField } from "twake-mui";
import { User, PeopleSearch } from "../Attendees/PeopleSearch"; import { User, PeopleSearch } from "../Attendees/PeopleSearch";
import { getAccessiblePair } from "./utils/calendarColorsUtils"; import { getAccessiblePair } from "./utils/calendarColorsUtils";
+1 -1
View File
@@ -1,4 +1,4 @@
import { Button, Popover } from "@mui/material"; import { Button, Popover } from "twake-mui";
import { useI18n } from "twake-i18n"; import { useI18n } from "twake-i18n";
import moment from "moment"; import moment from "moment";
import { MouseEvent, useMemo, useState } from "react"; import { MouseEvent, useMemo, useState } from "react";
@@ -1,4 +1,4 @@
import { darken, getContrastRatio, lighten, Theme } from "@mui/material"; import { darken, getContrastRatio, lighten, Theme } from "twake-mui";
import { ThunkDispatch } from "@reduxjs/toolkit"; import { ThunkDispatch } from "@reduxjs/toolkit";
import { updateCalColor } from "../../../features/Calendars/CalendarSlice"; import { updateCalColor } from "../../../features/Calendars/CalendarSlice";
import { Calendar } from "../../../features/Calendars/CalendarTypes"; import { Calendar } from "../../../features/Calendars/CalendarTypes";
+2 -5
View File
@@ -11,7 +11,7 @@ import {
SxProps, SxProps,
Theme, Theme,
Box, Box,
} from "@mui/material"; } from "twake-mui";
import ArrowBackIcon from "@mui/icons-material/ArrowBack"; import ArrowBackIcon from "@mui/icons-material/ArrowBack";
import CloseIcon from "@mui/icons-material/Close"; import CloseIcon from "@mui/icons-material/Close";
import OpenInFullIcon from "@mui/icons-material/OpenInFull"; import OpenInFullIcon from "@mui/icons-material/OpenInFull";
@@ -132,7 +132,7 @@ function ResponsiveDialog({
"& .MuiDialogActions-root .MuiBox-root": { "& .MuiDialogActions-root .MuiBox-root": {
maxWidth: isExpanded ? expandedContentMaxWidth : undefined, maxWidth: isExpanded ? expandedContentMaxWidth : undefined,
margin: isExpanded ? "0 auto" : undefined, margin: isExpanded ? "0 auto" : undefined,
padding: isExpanded ? "0 12px" : undefined, padding: "0",
width: isExpanded ? "100%" : undefined, width: isExpanded ? "100%" : undefined,
justifyContent: isExpanded ? "flex-end" : undefined, justifyContent: isExpanded ? "flex-end" : undefined,
}, },
@@ -140,7 +140,6 @@ function ResponsiveDialog({
const baseContentSx: SxProps<Theme> = { const baseContentSx: SxProps<Theme> = {
width: "100%", width: "100%",
padding: isExpanded ? "16px" : undefined,
}; };
const contentWrapperSx: SxProps<Theme> = { const contentWrapperSx: SxProps<Theme> = {
@@ -239,8 +238,6 @@ function ResponsiveDialog({
? (theme) => `1px solid ${theme.palette.divider}` ? (theme) => `1px solid ${theme.palette.divider}`
: undefined, : undefined,
justifyContent: actionsJustifyContent, justifyContent: actionsJustifyContent,
paddingTop: "18px",
paddingBottom: "18px",
}} }}
> >
{actions} {actions}
+1 -1
View File
@@ -1,6 +1,6 @@
import ErrorOutlineIcon from "@mui/icons-material/ErrorOutline"; import ErrorOutlineIcon from "@mui/icons-material/ErrorOutline";
import ReplayIcon from "@mui/icons-material/Replay"; import ReplayIcon from "@mui/icons-material/Replay";
import { Box, Button, Fade, Paper, Stack, Typography } from "@mui/material"; import { Box, Button, Fade, Paper, Stack, Typography } from "twake-mui";
import { useEffect, useRef } from "react"; import { useEffect, useRef } from "react";
import { push } from "redux-first-history"; import { push } from "redux-first-history";
import { useAppDispatch, useAppSelector } from "../../app/hooks"; import { useAppDispatch, useAppSelector } from "../../app/hooks";
+1 -3
View File
@@ -1,6 +1,4 @@
import Snackbar from "@mui/material/Snackbar"; import { Snackbar, Alert, Button } from "twake-mui";
import Alert from "@mui/material/Alert";
import Button from "@mui/material/Button";
import { useAppDispatch } from "../../app/hooks"; import { useAppDispatch } from "../../app/hooks";
import { clearError as calendarClearError } from "../../features/Calendars/CalendarSlice"; import { clearError as calendarClearError } from "../../features/Calendars/CalendarSlice";
import { clearError as userClearError } from "../../features/User/userSlice"; import { clearError as userClearError } from "../../features/User/userSlice";
+1 -1
View File
@@ -1,4 +1,4 @@
import { Box, Button, TextField } from "@mui/material"; import { Box, Button, TextField } from "twake-mui";
import { useI18n } from "twake-i18n"; import { useI18n } from "twake-i18n";
import { FieldWithLabel } from "./components/FieldWithLabel"; import { FieldWithLabel } from "./components/FieldWithLabel";
import { Description as DescriptionIcon } from "@mui/icons-material"; import { Description as DescriptionIcon } from "@mui/icons-material";
+1 -1
View File
@@ -8,7 +8,7 @@ import {
FormControlLabel, FormControlLabel,
Radio, Radio,
RadioGroup, RadioGroup,
} from "@mui/material"; } from "twake-mui";
import { CalendarEvent } from "../../features/Events/EventsTypes"; import { CalendarEvent } from "../../features/Events/EventsTypes";
import { useState } from "react"; import { useState } from "react";
import { useI18n } from "twake-i18n"; import { useI18n } from "twake-i18n";
@@ -1,4 +1,4 @@
import { Card, Typography } from "@mui/material"; import { Card, Typography } from "twake-mui";
import { useRef, useEffect } from "react"; import { useRef, useEffect } from "react";
import { EventErrorHandler } from "../../Error/EventErrorHandler"; import { EventErrorHandler } from "../../Error/EventErrorHandler";
+1 -1
View File
@@ -5,7 +5,7 @@ import {
CardContent, CardContent,
CardHeader, CardHeader,
Typography, Typography,
} from "@mui/material"; } from "twake-mui";
import React, { useEffect, useRef, useState } from "react"; import React, { useEffect, useRef, useState } from "react";
import { stringAvatar } from "../utils/eventUtils"; import { stringAvatar } from "../utils/eventUtils";
import { ErrorEventChip } from "./ErrorEventChip"; import { ErrorEventChip } from "./ErrorEventChip";
@@ -1,7 +1,7 @@
import CancelIcon from "@mui/icons-material/Cancel"; import CancelIcon from "@mui/icons-material/Cancel";
import HelpOutlineIcon from "@mui/icons-material/HelpOutline"; import HelpOutlineIcon from "@mui/icons-material/HelpOutline";
import LockOutlineIcon from "@mui/icons-material/LockOutline"; import LockOutlineIcon from "@mui/icons-material/LockOutline";
import { Box, getContrastRatio } from "@mui/material"; import { Box, getContrastRatio } from "twake-mui";
import moment from "moment"; import moment from "moment";
import React, { useLayoutEffect, useState } from "react"; import React, { useLayoutEffect, useState } from "react";
import { Calendar } from "../../../features/Calendars/CalendarTypes"; import { Calendar } from "../../../features/Calendars/CalendarTypes";
@@ -1,5 +1,5 @@
import React from "react"; import React from "react";
import { Card, Typography } from "@mui/material"; import { Card, Typography } from "twake-mui";
export function SimpleEventChip({ title }: { title: string }) { export function SimpleEventChip({ title }: { title: string }) {
return ( return (
+1 -1
View File
@@ -1,4 +1,4 @@
import { MenuItem } from "@mui/material"; import { MenuItem } from "twake-mui";
import { CalendarEvent } from "../../features/Events/EventsTypes"; import { CalendarEvent } from "../../features/Events/EventsTypes";
import { useI18n } from "twake-i18n"; import { useI18n } from "twake-i18n";
+1 -1
View File
@@ -13,7 +13,7 @@ import {
TextField, TextField,
ToggleButtonGroup, ToggleButtonGroup,
ToggleButton, ToggleButton,
} from "@mui/material"; } from "twake-mui";
import { import {
Description as DescriptionIcon, Description as DescriptionIcon,
Public as PublicIcon, Public as PublicIcon,
+1 -1
View File
@@ -12,7 +12,7 @@ import {
FormGroup, FormGroup,
Radio, Radio,
RadioGroup, RadioGroup,
} from "@mui/material"; } from "twake-mui";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { RepetitionObject } from "../../features/Events/EventsTypes"; import { RepetitionObject } from "../../features/Events/EventsTypes";
import { useI18n } from "twake-i18n"; import { useI18n } from "twake-i18n";
+1 -1
View File
@@ -1,5 +1,5 @@
import React from "react"; import React from "react";
import { Box, Typography, Link } from "@mui/material"; import { Box, Typography, Link } from "twake-mui";
type InfoRowProps = { type InfoRowProps = {
icon: React.ReactNode; icon: React.ReactNode;
@@ -1,6 +1,6 @@
import React, { useMemo } from "react"; import React, { useMemo } from "react";
import { Box, Typography } from "@mui/material"; import { Box, Typography } from "twake-mui";
import { TextFieldProps } from "@mui/material/TextField"; import { TextFieldProps } from "twake-mui";
import { DatePicker } from "@mui/x-date-pickers/DatePicker"; import { DatePicker } from "@mui/x-date-pickers/DatePicker";
import { DatePickerFieldProps } from "@mui/x-date-pickers/DatePicker"; import { DatePickerFieldProps } from "@mui/x-date-pickers/DatePicker";
import { TimePicker } from "@mui/x-date-pickers/TimePicker"; import { TimePicker } from "@mui/x-date-pickers/TimePicker";
@@ -1,5 +1,5 @@
import React, { useState, useRef, useEffect, useCallback } from "react"; import React, { useState, useRef, useEffect, useCallback } from "react";
import TextField from "@mui/material/TextField"; import { TextField } from "twake-mui";
import { import {
PickerFieldAdapter, PickerFieldAdapter,
PickerValidationScope, PickerValidationScope,
@@ -1,5 +1,5 @@
import React from "react"; import React from "react";
import { Box, Typography } from "@mui/material"; import { Box, Typography } from "twake-mui";
/** /**
* Helper component for field with label * Helper component for field with label
@@ -1,5 +1,5 @@
import React from "react"; import React from "react";
import TextField from "@mui/material/TextField"; import { TextField } from "twake-mui";
import { import {
PickerFieldAdapter, PickerFieldAdapter,
PickerValidationScope, PickerValidationScope,
+1 -4
View File
@@ -1,9 +1,6 @@
import CancelIcon from "@mui/icons-material/Cancel"; import CancelIcon from "@mui/icons-material/Cancel";
import CheckCircleIcon from "@mui/icons-material/CheckCircle"; import CheckCircleIcon from "@mui/icons-material/CheckCircle";
import Avatar from "@mui/material/Avatar"; import { Avatar, Badge, Box, Typography } from "twake-mui";
import Badge from "@mui/material/Badge";
import Box from "@mui/material/Box";
import Typography from "@mui/material/Typography";
import { ThunkDispatch } from "@reduxjs/toolkit"; import { ThunkDispatch } from "@reduxjs/toolkit";
import { import {
emptyEventsCal, emptyEventsCal,
+2 -2
View File
@@ -1,5 +1,5 @@
import Alert, { AlertColor } from "@mui/material/Alert"; import { Alert, Snackbar } from "twake-mui";
import Snackbar from "@mui/material/Snackbar"; import type { AlertColor } from "twake-mui";
export function SnackbarAlert({ export function SnackbarAlert({
open, open,
+2 -2
View File
@@ -14,8 +14,8 @@ import {
Stack, Stack,
TextField, TextField,
Typography, Typography,
} from "@mui/material"; } from "twake-mui";
import { type AutocompleteRenderInputParams } from "@mui/material/Autocomplete"; import { type AutocompleteRenderInputParams } from "twake-mui";
import { useRef, useState, useEffect } from "react"; import { useRef, useState, useEffect } from "react";
import HighlightOffIcon from "@mui/icons-material/HighlightOff"; import HighlightOffIcon from "@mui/icons-material/HighlightOff";
import SearchIcon from "@mui/icons-material/Search"; import SearchIcon from "@mui/icons-material/Search";
+2 -2
View File
@@ -22,7 +22,7 @@ import {
Typography, Typography,
Box, Box,
Divider, Divider,
} from "@mui/material"; } from "twake-mui";
import { push } from "redux-first-history"; import { push } from "redux-first-history";
import { CalendarApi } from "@fullcalendar/core"; import { CalendarApi } from "@fullcalendar/core";
import { useI18n } from "twake-i18n"; import { useI18n } from "twake-i18n";
@@ -194,7 +194,7 @@ export function Menubar({
</div> </div>
<div className="menu-items"> <div className="menu-items">
<div className="current-date-time"> <div className="current-date-time">
<Typography variant="h6" component="div"> <Typography variant="h3" component="div">
{dateLabel} {dateLabel}
</Typography> </Typography>
</div> </div>
@@ -1,4 +1,4 @@
import { Autocomplete, TextField } from "@mui/material"; import { Autocomplete, TextField } from "twake-mui";
import { PublicOutlined as TimezoneIcon } from "@mui/icons-material"; import { PublicOutlined as TimezoneIcon } from "@mui/icons-material";
import { useMemo } from "react"; import { useMemo } from "react";
@@ -1,4 +1,4 @@
import { Box, Typography } from "@mui/material"; import { Box, Typography } from "@linagora/twake-mui";
import { Dispatch, SetStateAction } from "react"; import { Dispatch, SetStateAction } from "react";
import { useI18n } from "twake-i18n"; import { useI18n } from "twake-i18n";
import { Calendar } from "../../Calendars/CalendarTypes"; import { Calendar } from "../../Calendars/CalendarTypes";
@@ -1,4 +1,4 @@
import { Button } from "@mui/material"; import { Button } from "@linagora/twake-mui";
import { Dispatch, SetStateAction } from "react"; import { Dispatch, SetStateAction } from "react";
import { useI18n } from "twake-i18n"; import { useI18n } from "twake-i18n";
import { useAppDispatch } from "../../../app/hooks"; import { useAppDispatch } from "../../../app/hooks";
+33 -16
View File
@@ -13,7 +13,7 @@ import PeopleAltOutlinedIcon from "@mui/icons-material/PeopleAltOutlined";
import RepeatIcon from "@mui/icons-material/Repeat"; import RepeatIcon from "@mui/icons-material/Repeat";
import SubjectIcon from "@mui/icons-material/Subject"; import SubjectIcon from "@mui/icons-material/Subject";
import VideocamIcon from "@mui/icons-material/Videocam"; import VideocamIcon from "@mui/icons-material/Videocam";
import { Box, Typography } from "@mui/material"; import { Box, Typography } from "@linagora/twake-mui";
import EventPopover from "./EventModal"; import EventPopover from "./EventModal";
import { import {
Button, Button,
@@ -23,8 +23,8 @@ import {
Menu, Menu,
MenuItem, MenuItem,
Tooltip, Tooltip,
} from "@mui/material"; } from "@linagora/twake-mui";
import AvatarGroup from "@mui/material/AvatarGroup"; import { AvatarGroup } from "@linagora/twake-mui";
import { useEffect, useState, useRef } from "react"; import { useEffect, useState, useRef } from "react";
import { useAppDispatch, useAppSelector } from "../../app/hooks"; import { useAppDispatch, useAppSelector } from "../../app/hooks";
import { CalendarName } from "../../components/Calendar/CalendarName"; import { CalendarName } from "../../components/Calendar/CalendarName";
@@ -49,7 +49,6 @@ import { userAttendee } from "../User/models/attendee";
import { browserDefaultTimeZone } from "../../utils/timezone"; import { browserDefaultTimeZone } from "../../utils/timezone";
import { AttendanceValidation } from "./AttendanceValidation/AttendanceValidation"; import { AttendanceValidation } from "./AttendanceValidation/AttendanceValidation";
import { Calendar } from "../Calendars/CalendarTypes"; import { Calendar } from "../Calendars/CalendarTypes";
import { userData } from "../User/userDataTypes";
import { createEventContext } from "./createEventContext"; import { createEventContext } from "./createEventContext";
export default function EventPreviewModal({ export default function EventPreviewModal({
@@ -100,7 +99,7 @@ export default function EventPreviewModal({
const attendeePreview = makeAttendeePreview(event.attendee, t); const attendeePreview = makeAttendeePreview(event.attendee, t);
const hasCheckedSessionStorageRef = useRef(false); const hasCheckedSessionStorageRef = useRef(false);
const [toggleActionMenu, setToggleActionMenu] = useState<Element | null>( const [toggleActionMenu, setToggleActionMenu] = useState<HTMLElement | null>(
null null
); );
const mailSpaUrl = (window as any).MAIL_SPA_URL ?? null; const mailSpaUrl = (window as any).MAIL_SPA_URL ?? null;
@@ -369,7 +368,7 @@ export default function EventPreviewModal({
`${mailSpaUrl}/mailto/?uri=mailto:${event.attendee `${mailSpaUrl}/mailto/?uri=mailto:${event.attendee
.map((a) => a.cal_address) .map((a) => a.cal_address)
.filter((mail) => mail !== user.email) .filter((mail) => mail !== user.email)
.join(",")}?subject=${event.title}` .join(",")}?subject=${encodeURIComponent(event.title ?? "")}`
) )
} }
> >
@@ -402,18 +401,28 @@ export default function EventPreviewModal({
eventId eventId
) )
); );
setOpenEditModePopup("edit"); setOpenEditModePopup("delete");
} else { } else {
onClose({}, "backdropClick"); onClose({}, "backdropClick");
await dispatch( try {
deleteEventAsync({ const result = await dispatch(
calId, deleteEventAsync({
eventId, calId,
eventURL: event.URL, eventId,
}) eventURL: event.URL,
); })
);
// For compatibility with tests that may not mock unwrap
if (result && typeof result.unwrap === "function") {
await result.unwrap();
}
updateTempList();
} catch (error) {
console.error("Failed to delete event:", error);
}
} }
updateTempList();
}} }}
> >
{t("eventPreview.deleteEvent")} {t("eventPreview.deleteEvent")}
@@ -616,7 +625,15 @@ export default function EventPreviewModal({
} }
text={t("eventPreview.alarmText", { text={t("eventPreview.alarmText", {
trigger: t(`event.form.notifications.${event.alarm.trigger}`), trigger: t(`event.form.notifications.${event.alarm.trigger}`),
action: t(`event.form.notifications.${event.alarm.action}`), action: (() => {
if (!event.alarm.action) return "";
const translationKey = `event.form.notifications.${event.alarm.action}`;
const translated = t(translationKey);
// If translation returns the key itself, it means translation not found, use raw value
return translated === translationKey
? event.alarm.action
: translated;
})(),
})} })}
style={{ style={{
fontSize: "16px", fontSize: "16px",
+1 -1
View File
@@ -1,5 +1,5 @@
import { CalendarApi, DateSelectArg } from "@fullcalendar/core"; import { CalendarApi, DateSelectArg } from "@fullcalendar/core";
import { Box, Button } from "@mui/material"; import { Box, Button } from "twake-mui";
import AddIcon from "@mui/icons-material/Add"; import AddIcon from "@mui/icons-material/Add";
import React, { import React, {
useEffect, useEffect,
+1 -1
View File
@@ -1,4 +1,4 @@
import { Box, Button } from "@mui/material"; import { Box, Button } from "twake-mui";
import AddIcon from "@mui/icons-material/Add"; import AddIcon from "@mui/icons-material/Add";
import { useEffect, useState, useMemo, useCallback, useRef } from "react"; import { useEffect, useState, useMemo, useCallback, useRef } from "react";
import { useAppDispatch, useAppSelector } from "../../app/hooks"; import { useAppDispatch, useAppSelector } from "../../app/hooks";
+1 -2
View File
@@ -2,8 +2,7 @@ import ArrowBackIcon from "@mui/icons-material/ArrowBack";
import RepeatIcon from "@mui/icons-material/Repeat"; import RepeatIcon from "@mui/icons-material/Repeat";
import SquareRoundedIcon from "@mui/icons-material/SquareRounded"; import SquareRoundedIcon from "@mui/icons-material/SquareRounded";
import VideocamIcon from "@mui/icons-material/Videocam"; import VideocamIcon from "@mui/icons-material/Videocam";
import { Box, Button, IconButton, Stack, Typography } from "@mui/material"; import { Box, Button, IconButton, Stack, Typography, CircularProgress } from "twake-mui";
import CircularProgress from "@mui/material/CircularProgress";
import { useI18n } from "twake-i18n"; import { useI18n } from "twake-i18n";
import { useState } from "react"; import { useState } from "react";
import { useAppDispatch, useAppSelector } from "../../app/hooks"; import { useAppDispatch, useAppSelector } from "../../app/hooks";
+1 -1
View File
@@ -15,7 +15,7 @@ import {
Snackbar, Snackbar,
Switch, Switch,
FormControlLabel, FormControlLabel,
} from "@mui/material"; } from "twake-mui";
import ArrowBackIcon from "@mui/icons-material/ArrowBack"; import ArrowBackIcon from "@mui/icons-material/ArrowBack";
import SettingsIcon from "@mui/icons-material/Settings"; import SettingsIcon from "@mui/icons-material/Settings";
// import SyncIcon from "@mui/icons-material/Sync"; // import SyncIcon from "@mui/icons-material/Sync";
-19
View File
@@ -1,19 +0,0 @@
import React from "react";
import { ThemeProvider } from "@mui/material/styles";
import { CssBaseline } from "@mui/material";
import { customTheme } from "./theme";
interface CustomThemeProviderProps {
children: React.ReactNode;
}
export function CustomThemeProvider({ children }: CustomThemeProviderProps) {
return (
<ThemeProvider theme={customTheme}>
<CssBaseline />
{children}
</ThemeProvider>
);
}
export { customTheme };
-38
View File
@@ -1,38 +0,0 @@
import { createTheme } from "@mui/material/styles";
// Custom theme for Twake Calendar
export const customTheme = createTheme({
palette: {
text: {
primary: "#000000",
secondary: "#717D96",
secondaryContainer: "#243B55",
},
},
typography: {
caption: {
fontSize: "0.75rem",
fontWeight: 400,
lineHeight: 1.4,
color: "#8C9CAF", // Custom secondary text color
},
},
components: {
// Custom Typography component
MuiTypography: {
styleOverrides: {
// Custom variant for event info text
caption: {
fontSize: "13px",
color: "#717D96",
},
},
},
// Custom Button component
// Custom Dialog component
// Custom DialogActions component
},
});
// Export theme type for TypeScript
export type CustomTheme = typeof customTheme;