Infrastructure/logto
0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2024-12-16 20:26:19 -05:00
Code Issues Activity

refactor(console): use vite

Browse source
This commit is contained in:
Gao Sun 2024-07-24 17:47:02 +08:00
parent 98dbead1bb
commit 6c1f4283a9
No known key found for this signature in database
GPG key ID: 13EBE123E4773688
482 changed files with 2041 additions and 1562 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
package.json
View file

@ -31,7 +31,8 @@
"@types/pg": "^8.6.6",
"husky": "^9.0.0",
"pg": "^8.8.0",
"typescript": "^5.0.0"
"typescript": "^5.0.0",
"vite": "^5.3.4"
},
"engines": {
"node": "^20.9.0",

12
packages/console/.eslintrc.cjs
View file

@ -49,5 +49,17 @@ module.exports = {
],
},
},
{
files: ['*.config.js', '*.config.ts', '*.d.ts'],
rules: {
'import/no-unused-modules': 'off',
},
},
{
files: ['*.d.ts'],
rules: {
'import/no-unassigned-import': 'off',
},
},
],
};

19
packages/console/.parcelrc
View file

@ -1,19 +0,0 @@
{
"extends": "@parcel/config-default",
"transformers": {
"raw:*": ["@parcel/transformer-raw"],
"**/assets/**/*.svg": [
"@parcel/transformer-svg-react"
],
"*.{md,mdx}": [
"./parcel-transformer-mdx2.js"
]
},
"compressors": {
"*.{html,css,js,svg,map}": [
"...",
"@parcel/compressor-gzip",
"@parcel/compressor-brotli"
]
}
}

23
packages/console/.parcelrc.arm64
View file

@ -1,23 +0,0 @@
{
"extends": "@parcel/config-default",
"optimizers": {
// Disable optimizers in arm64 arch https://github.com/parcel-bundler/parcel/issues/7402
"*.{jpg,jpeg,png}": []
},
"transformers": {
"raw:*": ["@parcel/transformer-raw"],
"**/assets/**/*.svg": [
"@parcel/transformer-svg-react"
],
"*.{md,mdx}": [
"./parcel-transformer-mdx2.js"
]
},
"compressors": {
"*.{html,css,js,svg,map}": [
"...",
"@parcel/compressor-gzip",
"@parcel/compressor-brotli"
]
}
}

2
packages/console/src/index.html → packages/console/index.html
View file

@ -10,7 +10,7 @@
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="app"></div>
<script type="module" src="index.tsx"></script>
<script type="module" src="src/index.tsx"></script>
</body>
</html>

43
packages/console/package.json
View file

@ -14,10 +14,10 @@
"prepack": "pnpm generate",
"generate": "./generate.sh",
"precommit": "lint-staged",
"start": "parcel src/index.html",
"dev": "cross-env PORT=5002 parcel src/index.html --public-url ${CONSOLE_PUBLIC_URL:-/console} --no-cache --hmr-port 6002",
"start": "vite",
"dev": "vite",
"check": "tsc --noEmit",
"build": "pnpm generate && pnpm check && rm -rf dist && parcel build src/index.html --no-autoinstall --no-cache --public-url ${CONSOLE_PUBLIC_URL:-/console}",
"build": "pnpm generate && pnpm check && vite build",
"lint": "eslint --ext .ts --ext .tsx src",
"lint:report": "pnpm lint --format json --output-file report.json",
"stylelint": "stylelint \"src/**/*.scss\"",
@ -39,12 +39,8 @@
"@logto/shared": "workspace:^3.1.1",
"@mdx-js/mdx": "^3.0.1",
"@mdx-js/react": "^3.0.1",
"@mdx-js/rollup": "^3.0.1",
"@monaco-editor/react": "^4.6.0",
"@parcel/compressor-brotli": "2.9.3",
"@parcel/compressor-gzip": "2.9.3",
"@parcel/core": "2.9.3",
"@parcel/transformer-sass": "2.9.3",
"@parcel/transformer-svg-react": "2.9.3",
"@silverhand/eslint-config": "6.0.1",
"@silverhand/eslint-config-react": "6.0.2",
"@silverhand/essentials": "^2.9.1",
@ -63,20 +59,19 @@
"@types/react-helmet": "^6.1.6",
"@types/react-modal": "^3.13.1",
"@types/react-syntax-highlighter": "^15.5.1",
"@vitejs/plugin-react": "^4.3.1",
"@withtyped/client": "^0.8.7",
"buffer": "^6.0.0",
"classnames": "^2.3.1",
"clean-deep": "^3.4.0",
"cross-env": "^7.0.3",
"csstype": "^3.0.11",
"date-fns": "^2.29.3",
"dayjs": "^1.10.5",
"debug": "^4.3.4",
"deep-object-diff": "^1.1.9",
"deepmerge": "^4.2.2",
"dnd-core": "^16.0.0",
"dotenv": "^16.4.5",
"eslint": "^8.56.0",
"history": "^5.3.0",
"find-up": "^7.0.0",
"i18next": "^22.4.15",
"i18next-browser-languagedetector": "^8.0.0",
"identity-obj-proxy": "^3.0.0",
@ -92,11 +87,9 @@
"nanoid": "^5.0.1",
"overlayscrollbars": "^2.0.2",
"overlayscrollbars-react": "^0.5.0",
"parcel": "2.9.3",
"postcss": "^8.4.31",
"postcss": "^8.4.39",
"postcss-modules": "^4.3.0",
"prettier": "^3.0.0",
"process": "^0.11.10",
"prop-types": "^15.8.1",
"property-information": "^6.2.0",
"react": "^18.3.1",
@ -114,7 +107,7 @@
"react-markdown": "^9.0.0",
"react-modal": "^3.15.1",
"react-paginate": "^8.1.3",
"react-router-dom": "^6.10.0",
"react-router-dom": "^6.25.1",
"react-syntax-highlighter": "^15.5.0",
"react-timer-hook": "^3.0.5",
"recharts": "^2.1.13",
@ -122,27 +115,17 @@
"remark-gfm": "^4.0.0",
"stylelint": "^15.0.0",
"swr": "^2.2.0",
"ts-node": "^10.9.2",
"tslib": "^2.4.1",
"typescript": "^5.5.3",
"vite": "^5.3.4",
"vite-plugin-compression": "^0.5.1",
"vite-plugin-prebundle": "^0.0.4",
"vite-plugin-svgr": "^4.2.0",
"zod": "^3.23.8",
"zod-to-ts": "^1.2.0"
},
"engines": {
"node": "^20.9.0"
},
"//": "https://github.com/parcel-bundler/parcel/issues/7636",
"targets": {
"default": {
"engines": {
"browsers": "defaults"
}
}
},
"alias": {
"@/*": "./src/$1",
"@cloud/*": "./src/cloud/$1"
},
"stylelint": {
"extends": "@silverhand/eslint-config-react/.stylelintrc"
},

61
packages/console/parcel-transformer-mdx2.js
View file

@ -1,61 +0,0 @@
// https://github.com/parcel-bundler/parcel/pull/7922#issuecomment-1750704973
import { compile } from '@mdx-js/mdx';
import { default as ThrowableDiagnostic } from '@parcel/diagnostic';
import { Transformer } from '@parcel/plugin';
import rehypeMdxCodeProps from 'rehype-mdx-code-props';
import remarkGfm from 'remark-gfm';
export default new Transformer({
async transform({ asset }) {
const source = await asset.getCode();
let codeVFile;
try {
codeVFile = await compile(source, {
development: true,
jsx: true,
providerImportSource: '@mdx-js/react',
remarkPlugins: [remarkGfm],
rehypePlugins: [[rehypeMdxCodeProps, { tagName: 'code' }]],
});
} catch (error) {
const { start, end } = error.position;
const highlight = {
message: error.reason,
start,
end,
};
if (!(end.line && end.column)) {
highlight.end = { ...start };
}
// Adjust for parser and reporter differences
highlight.start.column -= 1;
highlight.end.column -= 1;
throw new ThrowableDiagnostic({
diagnostic: {
message: 'Unable to compile MDX',
codeFrames: [
{
filePath: asset.filePath,
code: source,
codeHighlights: [highlight],
},
],
},
});
}
const code = String(codeVFile);
asset.type = 'jsx';
asset.setCode(code);
return [asset];
},
});

66
packages/console/src/assets/docs/guides/index.tsx
View file

@ -43,126 +43,126 @@ export const guides: Readonly<Guide[]> = Object.freeze([
{
order: 1,
id: 'web-next-app-router',
Logo: lazy(async () => import('./web-next-app-router/logo.svg')),
Logo: lazy(async () => import('./web-next-app-router/logo.svg?react')),
Component: lazy(async () => import('./web-next-app-router/README.mdx')),
metadata: webNextAppRouter,
},
{
order: 1.1,
id: 'native-expo',
Logo: lazy(async () => import('./native-expo/logo.svg')),
Logo: lazy(async () => import('./native-expo/logo.svg?react')),
Component: lazy(async () => import('./native-expo/README.mdx')),
metadata: nativeExpo,
},
{
order: 1.1,
id: 'spa-angular',
Logo: lazy(async () => import('./spa-angular/logo.svg')),
Logo: lazy(async () => import('./spa-angular/logo.svg?react')),
Component: lazy(async () => import('./spa-angular/README.mdx')),
metadata: spaAngular,
},
{
order: 1.1,
id: 'spa-chrome-extension',
Logo: lazy(async () => import('./spa-chrome-extension/logo.svg')),
Logo: lazy(async () => import('./spa-chrome-extension/logo.svg?react')),
Component: lazy(async () => import('./spa-chrome-extension/README.mdx')),
metadata: spaChromeExtension,
},
{
order: 1.1,
id: 'spa-react',
Logo: lazy(async () => import('./spa-react/logo.svg')),
Logo: lazy(async () => import('./spa-react/logo.svg?react')),
Component: lazy(async () => import('./spa-react/README.mdx')),
metadata: spaReact,
},
{
order: 1.2,
id: 'm2m-general',
Logo: lazy(async () => import('./m2m-general/logo.svg')),
Logo: lazy(async () => import('./m2m-general/logo.svg?react')),
Component: lazy(async () => import('./m2m-general/README.mdx')),
metadata: m2mGeneral,
},
{
order: 1.2,
id: 'web-express',
Logo: lazy(async () => import('./web-express/logo.svg')),
Logo: lazy(async () => import('./web-express/logo.svg?react')),
Component: lazy(async () => import('./web-express/README.mdx')),
metadata: webExpress,
},
{
order: 1.2,
id: 'web-next',
Logo: lazy(async () => import('./web-next/logo.svg')),
Logo: lazy(async () => import('./web-next/logo.svg?react')),
Component: lazy(async () => import('./web-next/README.mdx')),
metadata: webNext,
},
{
order: 1.2,
id: 'web-sveltekit',
Logo: lazy(async () => import('./web-sveltekit/logo.svg')),
Logo: lazy(async () => import('./web-sveltekit/logo.svg?react')),
Component: lazy(async () => import('./web-sveltekit/README.mdx')),
metadata: webSveltekit,
},
{
order: 1.3,
id: 'web-go',
Logo: lazy(async () => import('./web-go/logo.svg')),
Logo: lazy(async () => import('./web-go/logo.svg?react')),
Component: lazy(async () => import('./web-go/README.mdx')),
metadata: webGo,
},
{
order: 1.3,
id: 'web-next-auth',
Logo: lazy(async () => import('./web-next-auth/logo.svg')),
Logo: lazy(async () => import('./web-next-auth/logo.svg?react')),
Component: lazy(async () => import('./web-next-auth/README.mdx')),
metadata: webNextAuth,
},
{
order: 1.4,
id: 'web-java-spring-boot',
Logo: lazy(async () => import('./web-java-spring-boot/logo.svg')),
Logo: lazy(async () => import('./web-java-spring-boot/logo.svg?react')),
Component: lazy(async () => import('./web-java-spring-boot/README.mdx')),
metadata: webJavaSpringBoot,
},
{
order: 1.6,
id: 'spa-vue',
Logo: lazy(async () => import('./spa-vue/logo.svg')),
Logo: lazy(async () => import('./spa-vue/logo.svg?react')),
Component: lazy(async () => import('./spa-vue/README.mdx')),
metadata: spaVue,
},
{
order: 1.7,
id: 'native-ios-swift',
Logo: lazy(async () => import('./native-ios-swift/logo.svg')),
Logo: lazy(async () => import('./native-ios-swift/logo.svg?react')),
Component: lazy(async () => import('./native-ios-swift/README.mdx')),
metadata: nativeIosSwift,
},
{
order: 2,
id: 'native-android',
Logo: lazy(async () => import('./native-android/logo.svg')),
Logo: lazy(async () => import('./native-android/logo.svg?react')),
Component: lazy(async () => import('./native-android/README.mdx')),
metadata: nativeAndroid,
},
{
order: 2,
id: 'spa-vanilla',
Logo: lazy(async () => import('./spa-vanilla/logo.svg')),
Logo: lazy(async () => import('./spa-vanilla/logo.svg?react')),
Component: lazy(async () => import('./spa-vanilla/README.mdx')),
metadata: spaVanilla,
},
{
order: 2,
id: 'web-nuxt',
Logo: lazy(async () => import('./web-nuxt/logo.svg')),
Logo: lazy(async () => import('./web-nuxt/logo.svg?react')),
Component: lazy(async () => import('./web-nuxt/README.mdx')),
metadata: webNuxt,
},
{
order: 2,
id: 'web-php',
Logo: lazy(async () => import('./web-php/logo.svg')),
Logo: lazy(async () => import('./web-php/logo.svg?react')),
Component: lazy(async () => import('./web-php/README.mdx')),
metadata: webPhp,
},
@ -178,105 +178,105 @@ export const guides: Readonly<Guide[]> = Object.freeze([
{
order: 2.1,
id: 'spa-webflow',
Logo: lazy(async () => import('./spa-webflow/logo.svg')),
Logo: lazy(async () => import('./spa-webflow/logo.svg?react')),
Component: lazy(async () => import('./spa-webflow/README.mdx')),
metadata: spaWebflow,
},
{
order: 2.2,
id: 'web-wordpress',
Logo: lazy(async () => import('./web-wordpress/logo.svg')),
Logo: lazy(async () => import('./web-wordpress/logo.svg?react')),
Component: lazy(async () => import('./web-wordpress/README.mdx')),
metadata: webWordpress,
},
{
order: 3,
id: 'web-python',
Logo: lazy(async () => import('./web-python/logo.svg')),
Logo: lazy(async () => import('./web-python/logo.svg?react')),
Component: lazy(async () => import('./web-python/README.mdx')),
metadata: webPython,
},
{
order: 4,
id: 'native-capacitor',
Logo: lazy(async () => import('./native-capacitor/logo.svg')),
Logo: lazy(async () => import('./native-capacitor/logo.svg?react')),
Component: lazy(async () => import('./native-capacitor/README.mdx')),
metadata: nativeCapacitor,
},
{
order: 5,
id: 'native-flutter',
Logo: lazy(async () => import('./native-flutter/logo.svg')),
Logo: lazy(async () => import('./native-flutter/logo.svg?react')),
Component: lazy(async () => import('./native-flutter/README.mdx')),
metadata: nativeFlutter,
},
{
order: 5,
id: 'web-dotnet-core',
Logo: lazy(async () => import('./web-dotnet-core/logo.svg')),
Logo: lazy(async () => import('./web-dotnet-core/logo.svg?react')),
Component: lazy(async () => import('./web-dotnet-core/README.mdx')),
metadata: webDotnetCore,
},
{
order: 5.1,
id: 'web-dotnet-core-mvc',
Logo: lazy(async () => import('./web-dotnet-core-mvc/logo.svg')),
Logo: lazy(async () => import('./web-dotnet-core-mvc/logo.svg?react')),
Component: lazy(async () => import('./web-dotnet-core-mvc/README.mdx')),
metadata: webDotnetCoreMvc,
},
{
order: 5.2,
id: 'web-dotnet-core-blazor-server',
Logo: lazy(async () => import('./web-dotnet-core-blazor-server/logo.svg')),
Logo: lazy(async () => import('./web-dotnet-core-blazor-server/logo.svg?react')),
Component: lazy(async () => import('./web-dotnet-core-blazor-server/README.mdx')),
metadata: webDotnetCoreBlazorServer,
},
{
order: 5.3,
id: 'web-dotnet-core-blazor-wasm',
Logo: lazy(async () => import('./web-dotnet-core-blazor-wasm/logo.svg')),
Logo: lazy(async () => import('./web-dotnet-core-blazor-wasm/logo.svg?react')),
Component: lazy(async () => import('./web-dotnet-core-blazor-wasm/README.mdx')),
metadata: webDotnetCoreBlazorWasm,
},
{
order: 6,
id: 'web-outline',
Logo: lazy(async () => import('./web-outline/logo.svg')),
Logo: lazy(async () => import('./web-outline/logo.svg?react')),
Component: lazy(async () => import('./web-outline/README.mdx')),
metadata: webOutline,
},
{
order: 999,
id: 'web-gpt-plugin',
Logo: lazy(async () => import('./web-gpt-plugin/logo.svg')),
Logo: lazy(async () => import('./web-gpt-plugin/logo.svg?react')),
Component: lazy(async () => import('./web-gpt-plugin/README.mdx')),
metadata: webGptPlugin,
},
{
order: Number.POSITIVE_INFINITY,
id: 'api-express',
Logo: lazy(async () => import('./api-express/logo.svg')),
Logo: lazy(async () => import('./api-express/logo.svg?react')),
Component: lazy(async () => import('./api-express/README.mdx')),
metadata: apiExpress,
},
{
order: Number.POSITIVE_INFINITY,
id: 'api-python',
Logo: lazy(async () => import('./api-python/logo.svg')),
Logo: lazy(async () => import('./api-python/logo.svg?react')),
Component: lazy(async () => import('./api-python/README.mdx')),
metadata: apiPython,
},
{
order: Number.POSITIVE_INFINITY,
id: 'api-spring-boot',
Logo: lazy(async () => import('./api-spring-boot/logo.svg')),
Logo: lazy(async () => import('./api-spring-boot/logo.svg?react')),
Component: lazy(async () => import('./api-spring-boot/README.mdx')),
metadata: apiSpringBoot,
},
{
order: Number.POSITIVE_INFINITY,
id: 'third-party-oidc',
Logo: lazy(async () => import('./third-party-oidc/logo.svg')),
Logo: lazy(async () => import('./third-party-oidc/logo.svg?react')),
Component: lazy(async () => import('./third-party-oidc/README.mdx')),
metadata: thirdPartyOidc,
},

2
packages/console/src/assets/docs/guides/web-gpt-plugin/components/ClientBasics/index.tsx
View file

@ -4,7 +4,7 @@ import { GuideContext } from '@/components/Guide';
import CopyToClipboard from '@/ds-components/CopyToClipboard';
import FormField from '@/ds-components/FormField';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
export default function ClientBasics() {
const { app } = useContext(GuideContext);

2
packages/console/src/cloud/AppRoutes.tsx
View file

@ -9,7 +9,7 @@ import CheckoutSuccessCallback from '@/pages/CheckoutSuccessCallback';
import Profile from '@/pages/Profile';
import HandleSocialCallback from '@/pages/Profile/containers/HandleSocialCallback';
import * as styles from './AppRoutes.module.scss';
import styles from './AppRoutes.module.scss';
import Main from './pages/Main';
import SocialDemoCallback from './pages/SocialDemoCallback';

4
packages/console/src/cloud/pages/Main/InvitationList/index.tsx
View file

@ -2,7 +2,7 @@ import { OrganizationInvitationStatus, getTenantIdFromOrganizationId } from '@lo
import { useContext, useState } from 'react';
import { useTranslation } from 'react-i18next';
import OrganizationIcon from '@/assets/icons/organization-preview.svg';
import OrganizationIcon from '@/assets/icons/organization-preview.svg?react';
import { useCloudApi } from '@/cloud/hooks/use-cloud-api';
import { type InvitationListResponse } from '@/cloud/types/router';
import TenantEnvTag from '@/components/TenantEnvTag';
@ -13,7 +13,7 @@ import Spacer from '@/ds-components/Spacer';
import useTenantPathname from '@/hooks/use-tenant-pathname';
import useUserOnboardingData from '@/onboarding/hooks/use-user-onboarding-data';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly invitations: InvitationListResponse;

8
packages/console/src/cloud/pages/Main/TenantLandingPage/TenantLandingPageContent/index.tsx
View file

@ -2,9 +2,9 @@ import { Theme } from '@logto/schemas';
import classNames from 'classnames';
import { useContext, useState } from 'react';
import Plus from '@/assets/icons/plus.svg';
import TenantLandingPageImageDark from '@/assets/images/tenant-landing-page-dark.svg';
import TenantLandingPageImage from '@/assets/images/tenant-landing-page.svg';
import Plus from '@/assets/icons/plus.svg?react';
import TenantLandingPageImageDark from '@/assets/images/tenant-landing-page-dark.svg?react';
import TenantLandingPageImage from '@/assets/images/tenant-landing-page.svg?react';
import { type TenantResponse } from '@/cloud/types/router';
import CreateTenantModal from '@/components/CreateTenantModal';
import { TenantsContext } from '@/contexts/TenantsProvider';
@ -12,7 +12,7 @@ import Button from '@/ds-components/Button';
import DynamicT from '@/ds-components/DynamicT';
import useTheme from '@/hooks/use-theme';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly className?: string;

2
packages/console/src/cloud/pages/Main/TenantLandingPage/index.tsx
View file

@ -1,7 +1,7 @@
import Topbar from '@/components/Topbar';
import TenantLandingPageContent from './TenantLandingPageContent';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
function TenantLandingPage() {
return (

6
packages/console/src/cloud/pages/SocialDemoCallback/index.tsx
View file

@ -3,12 +3,12 @@ import { useEffect } from 'react';
import { useTranslation } from 'react-i18next';
import { useSearchParams } from 'react-router-dom';
import CongratsDark from '@/assets/images/congrats-dark.svg';
import Congrats from '@/assets/images/congrats.svg';
import CongratsDark from '@/assets/images/congrats-dark.svg?react';
import Congrats from '@/assets/images/congrats.svg?react';
import Card from '@/ds-components/Card';
import useTheme from '@/hooks/use-theme';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
function SocialDemoCallback() {
const theme = useTheme();

2
packages/console/src/components/ActionBar/index.tsx
View file

@ -2,7 +2,7 @@ import type { ReactNode } from 'react';
import ProgressBar from '../ProgressBar';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly step: number;

8
packages/console/src/components/ActionsButton/index.tsx
View file

@ -2,15 +2,15 @@ import { type AdminConsoleKey } from '@logto/phrases';
import { useCallback, useState } from 'react';
import { useTranslation } from 'react-i18next';
import Delete from '@/assets/icons/delete.svg';
import Edit from '@/assets/icons/edit.svg';
import More from '@/assets/icons/more.svg';
import Delete from '@/assets/icons/delete.svg?react';
import Edit from '@/assets/icons/edit.svg?react';
import More from '@/assets/icons/more.svg?react';
import ActionMenu, { ActionMenuItem } from '@/ds-components/ActionMenu';
import ConfirmModal from '@/ds-components/ConfirmModal';
import DynamicT from '@/ds-components/DynamicT';
import useActionTranslation from '@/hooks/use-action-translation';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
/** A function that will be called when the user confirms the deletion. If not provided,

10
packages/console/src/components/AppError/index.tsx
View file

@ -3,15 +3,15 @@ import { Theme } from '@logto/schemas';
import { useState } from 'react';
import { useTranslation } from 'react-i18next';
import KeyboardArrowDown from '@/assets/icons/keyboard-arrow-down.svg';
import KeyboardArrowUp from '@/assets/icons/keyboard-arrow-up.svg';
import ErrorDark from '@/assets/images/error-dark.svg';
import Error from '@/assets/images/error.svg';
import KeyboardArrowDown from '@/assets/icons/keyboard-arrow-down.svg?react';
import KeyboardArrowUp from '@/assets/icons/keyboard-arrow-up.svg?react';
import ErrorDark from '@/assets/images/error-dark.svg?react';
import Error from '@/assets/images/error.svg?react';
import Button from '@/ds-components/Button';
import useTheme from '@/hooks/use-theme';
import { onKeyDownHandler } from '@/utils/a11y';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly title?: string;

4
packages/console/src/components/AppLoading/index.tsx
View file

@ -1,7 +1,7 @@
import Logo from '@/assets/images/logo.svg';
import Logo from '@/assets/images/logo.svg?react';
import { Daisy as Spinner } from '@/ds-components/Spinner';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
function AppLoading() {
return (

4
packages/console/src/components/ApplicationCreation/CreateForm/index.tsx
View file

@ -17,12 +17,12 @@ import TextInput from '@/ds-components/TextInput';
import useApi from '@/hooks/use-api';
import useCurrentUser from '@/hooks/use-current-user';
import TypeDescription from '@/pages/Applications/components/TypeDescription';
import * as modalStyles from '@/scss/modal.module.scss';
import modalStyles from '@/scss/modal.module.scss';
import { applicationTypeI18nKey } from '@/types/applications';
import { trySubmitSafe } from '@/utils/form';
import Footer from './Footer';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type FormData = {
type: ApplicationType;

2
packages/console/src/components/ApplicationName/index.tsx
View file

@ -10,7 +10,7 @@ import useSwrFetcher from '@/hooks/use-swr-fetcher';
import useTenantPathname from '@/hooks/use-tenant-pathname';
import { shouldRetryOnError } from '@/utils/request';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly applicationId: string;

6
packages/console/src/components/AuditLogTable/components/EventName/index.tsx
View file

@ -1,13 +1,13 @@
import classNames from 'classnames';
import { Link } from 'react-router-dom';
import Failed from '@/assets/icons/failed.svg';
import Success from '@/assets/icons/success.svg';
import Failed from '@/assets/icons/failed.svg?react';
import Success from '@/assets/icons/success.svg?react';
import { logEventTitle } from '@/consts/logs';
import Tag from '@/ds-components/Tag';
import useTenantPathname from '@/hooks/use-tenant-pathname';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly eventKey: string;

2
packages/console/src/components/AuditLogTable/index.tsx
View file

@ -19,7 +19,7 @@ import EmptyDataPlaceholder from '../EmptyDataPlaceholder';
import ApplicationSelector from './components/ApplicationSelector';
import EventName from './components/EventName';
import EventSelector from './components/EventSelector';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
const auditLogEventOptions = Object.entries(auditLogEventTitle).map(([value, title]) => ({
value,

2
packages/console/src/components/BasicWebhookForm/index.tsx
View file

@ -14,7 +14,7 @@ import FormField from '@/ds-components/FormField';
import TextInput from '@/ds-components/TextInput';
import { uriValidator } from '@/utils/validator';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
const hookEventGroups: Array<CheckboxOptionGroup<HookEvent>> = [
...schemaGroupedDataHookEvents.map(([schema, events]) => ({

4
packages/console/src/components/BillInfo/index.tsx
View file

@ -1,7 +1,7 @@
import { useContext, useState } from 'react';
import { Trans, useTranslation } from 'react-i18next';
import Tip from '@/assets/icons/tip.svg';
import Tip from '@/assets/icons/tip.svg?react';
import { newPlansBlogLink } from '@/consts';
import { TenantsContext } from '@/contexts/TenantsProvider';
import Button from '@/ds-components/Button';
@ -11,7 +11,7 @@ import TextLink from '@/ds-components/TextLink';
import { ToggleTip } from '@/ds-components/Tip';
import useSubscribe from '@/hooks/use-subscribe';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly cost: number;

2
packages/console/src/components/Breakable/index.tsx
View file

@ -1,4 +1,4 @@
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly children: React.ReactNode;

4
packages/console/src/components/ConnectorForm/BasicForm/index.tsx
View file

@ -2,7 +2,7 @@ import { Theme } from '@logto/schemas';
import { Controller, useFormContext } from 'react-hook-form';
import { Trans, useTranslation } from 'react-i18next';
import Error from '@/assets/icons/toast-error.svg';
import Error from '@/assets/icons/toast-error.svg?react';
import ImageInputs from '@/components/ImageInputs';
import UnnamedTrans from '@/components/UnnamedTrans';
import FormField from '@/ds-components/FormField';
@ -13,7 +13,7 @@ import useDocumentationUrl from '@/hooks/use-documentation-url';
import type { ConnectorFormType } from '@/types/connector';
import { SyncProfileMode } from '@/types/connector';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
const themeToField = Object.freeze({
[Theme.Light]: 'logo',

2
packages/console/src/components/ConnectorForm/ConfigForm/ConfigFormFields/index.tsx
View file

@ -15,7 +15,7 @@ import Textarea from '@/ds-components/Textarea';
import type { ConnectorFormType } from '@/types/connector';
import { jsonValidator } from '@/utils/validator';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly formItems: ConnectorConfigFormItem[];

2
packages/console/src/components/ConnectorForm/ConfigForm/index.tsx
View file

@ -16,7 +16,7 @@ import type { ConnectorFormType } from '@/types/connector';
import { jsonValidator } from '@/utils/validator';
import ConfigFormFields from './ConfigFormFields';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly formItems?: ConnectorConfigFormItem[];

2
packages/console/src/components/ConnectorForm/GoogleOneTapCard/index.tsx
View file

@ -12,7 +12,7 @@ import useTheme from '@/hooks/use-theme';
import figureDark from './figure-dark.webp';
import figureLight from './figure-light.webp';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type FormContext = { rawConfig: { oneTap: GoogleConnectorConfig['oneTap'] } };

2
packages/console/src/components/ConnectorLogo/index.tsx
View file

@ -5,7 +5,7 @@ import classNames from 'classnames';
import ImageWithErrorFallback from '@/ds-components/ImageWithErrorFallback';
import useTheme from '@/hooks/use-theme';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly className?: string;

2
packages/console/src/components/ConnectorTester/index.tsx
View file

@ -15,7 +15,7 @@ import useApi from '@/hooks/use-api';
import { onKeyDownHandler } from '@/utils/a11y';
import { trySubmitSafe } from '@/utils/form';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly connectorFactoryId: string;

2
packages/console/src/components/CreateConnectorForm/ConnectorRadioGroup/ConnectorRadio/index.tsx
View file

@ -5,7 +5,7 @@ import ConnectorLogo from '@/components/ConnectorLogo';
import UnnamedTrans from '@/components/UnnamedTrans';
import { type ConnectorGroup } from '@/types/connector';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly data: ConnectorGroup<ConnectorFactoryResponse>;

2
packages/console/src/components/CreateConnectorForm/ConnectorRadioGroup/index.tsx
View file

@ -5,7 +5,7 @@ import RadioGroup, { Radio } from '@/ds-components/RadioGroup';
import { type ConnectorGroup } from '@/types/connector';
import ConnectorRadio from './ConnectorRadio';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
export type ConnectorRadioGroupSize = 'medium' | 'large' | 'xlarge';

2
packages/console/src/components/CreateConnectorForm/PlatformSelector/index.tsx
View file

@ -6,7 +6,7 @@ import { connectorPlatformLabel } from '@/consts/connectors';
import RadioGroup, { Radio } from '@/ds-components/RadioGroup';
import type { ConnectorGroup } from '@/types/connector';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly connectorGroup: ConnectorGroup<ConnectorFactoryResponse & { added: boolean }>;

6
packages/console/src/components/CreateConnectorForm/Skeleton/index.tsx
View file

@ -1,9 +1,9 @@
import classNames from 'classnames';
import * as radioStyles from '../ConnectorRadioGroup/ConnectorRadio/index.module.scss';
import * as radioGroupStyles from '../ConnectorRadioGroup/index.module.scss';
import radioStyles from '../ConnectorRadioGroup/ConnectorRadio/index.module.scss';
import radioGroupStyles from '../ConnectorRadioGroup/index.module.scss';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly numberOfLoadingConnectors?: number;

4
packages/console/src/components/CreateConnectorForm/index.tsx
View file

@ -10,7 +10,7 @@ import useSWR from 'swr';
import DynamicT from '@/ds-components/DynamicT';
import ModalLayout from '@/ds-components/ModalLayout';
import type { RequestError } from '@/hooks/use-api';
import * as modalStyles from '@/scss/modal.module.scss';
import modalStyles from '@/scss/modal.module.scss';
import { getConnectorGroups } from '../../pages/Connectors/utils';
@ -18,7 +18,7 @@ import ConnectorRadioGroup from './ConnectorRadioGroup';
import Footer from './Footer';
import PlatformSelector from './PlatformSelector';
import Skeleton from './Skeleton';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
import { compareConnectors, getConnectorRadioGroupSize, getModalTitle } from './utils';
type Props = {

2
packages/console/src/components/CreateTenantModal/EnvTagOptionContent/index.tsx
View file

@ -7,7 +7,7 @@ import DynamicT from '@/ds-components/DynamicT';
import Tag from '@/ds-components/Tag';
import { ReservedPlanName } from '@/types/subscriptions';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly tag: TenantTag;

6
packages/console/src/components/CreateTenantModal/SelectTenantPlanModal/PlanCardItem/FeaturedPlanContent/index.tsx
View file

@ -1,9 +1,9 @@
import classNames from 'classnames';
import Failed from '@/assets/icons/failed.svg';
import Success from '@/assets/icons/success.svg';
import Failed from '@/assets/icons/failed.svg?react';
import Success from '@/assets/icons/success.svg?react';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
import useFeaturedPlanContent from './use-featured-plan-content';
type Props = {

4
packages/console/src/components/CreateTenantModal/SelectTenantPlanModal/PlanCardItem/index.tsx
View file

@ -3,7 +3,7 @@ import classNames from 'classnames';
import { useContext, useMemo } from 'react';
import { Trans, useTranslation } from 'react-i18next';
import ArrowRight from '@/assets/icons/arrow-right.svg';
import ArrowRight from '@/assets/icons/arrow-right.svg?react';
import PlanDescription from '@/components/PlanDescription';
import PlanName from '@/components/PlanName';
import { pricingLink } from '@/consts';
@ -15,7 +15,7 @@ import TextLink from '@/ds-components/TextLink';
import { type SubscriptionPlan } from '@/types/subscriptions';
import FeaturedPlanContent from './FeaturedPlanContent';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly plan: SubscriptionPlan;

4
packages/console/src/components/CreateTenantModal/SelectTenantPlanModal/index.tsx
View file

@ -13,14 +13,14 @@ import ModalLayout from '@/ds-components/ModalLayout';
import TextLink from '@/ds-components/TextLink';
import useSubscribe from '@/hooks/use-subscribe';
import useSubscriptionPlans from '@/hooks/use-subscription-plans';
import * as modalStyles from '@/scss/modal.module.scss';
import modalStyles from '@/scss/modal.module.scss';
import { type SubscriptionPlan } from '@/types/subscriptions';
import { pickupFeaturedPlans } from '@/utils/subscription';
import { type CreateTenantData } from '../types';
import PlanCardItem from './PlanCardItem';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly tenantData?: CreateTenantData;

8
packages/console/src/components/CreateTenantModal/index.tsx
View file

@ -5,8 +5,8 @@ import { toast } from 'react-hot-toast';
import { useTranslation } from 'react-i18next';
import Modal from 'react-modal';
import CreateTenantHeaderIconDark from '@/assets/icons/create-tenant-header-dark.svg';
import CreateTenantHeaderIcon from '@/assets/icons/create-tenant-header.svg';
import CreateTenantHeaderIconDark from '@/assets/icons/create-tenant-header-dark.svg?react';
import CreateTenantHeaderIcon from '@/assets/icons/create-tenant-header.svg?react';
import { useCloudApi } from '@/cloud/hooks/use-cloud-api';
import { type TenantResponse } from '@/cloud/types/router';
import Region, { RegionName } from '@/components/Region';
@ -17,11 +17,11 @@ import ModalLayout from '@/ds-components/ModalLayout';
import RadioGroup, { Radio } from '@/ds-components/RadioGroup';
import TextInput from '@/ds-components/TextInput';
import useTheme from '@/hooks/use-theme';
import * as modalStyles from '@/scss/modal.module.scss';
import modalStyles from '@/scss/modal.module.scss';
import EnvTagOptionContent from './EnvTagOptionContent';
import SelectTenantPlanModal from './SelectTenantPlanModal';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
import { type CreateTenantData } from './types';
type Props = {

4
packages/console/src/components/CustomUiAssetsUploader/index.tsx
View file

@ -4,14 +4,14 @@ import { format } from 'date-fns/fp';
import { useCallback, useState } from 'react';
import { useTranslation } from 'react-i18next';
import DeleteIcon from '@/assets/icons/delete.svg';
import DeleteIcon from '@/assets/icons/delete.svg?react';
import IconButton from '@/ds-components/IconButton';
import FileUploader from '@/ds-components/Uploader/FileUploader';
import { formatBytes } from '@/utils/uploader';
import FileIcon from '../FileIcon';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
// eslint-disable-next-line react/boolean-prop-naming

2
packages/console/src/components/DetailsForm/index.tsx
View file

@ -3,7 +3,7 @@ import type { ReactNode } from 'react';
import SubmitFormChangesActionBar from '../SubmitFormChangesActionBar';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly autoComplete?: string;

4
packages/console/src/components/DetailsPage/DetailsPageHeader/index.tsx
View file

@ -10,7 +10,7 @@ import {
} from 'react';
import { useTranslation } from 'react-i18next';
import More from '@/assets/icons/more.svg';
import More from '@/assets/icons/more.svg?react';
import ActionMenu, { ActionMenuItem } from '@/ds-components/ActionMenu';
import Button from '@/ds-components/Button';
import Card from '@/ds-components/Card';
@ -20,7 +20,7 @@ import DynamicT from '@/ds-components/DynamicT';
import Tag, { type Props as TagProps } from '@/ds-components/Tag';
import useWindowResize from '@/hooks/use-window-resize';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type StatusTag = {
status: TagProps['status'];

2
packages/console/src/components/DetailsPage/Skeleton/index.tsx
View file

@ -1,7 +1,7 @@
import { FormCardSkeleton } from '@/components/FormCard';
import Spacer from '@/ds-components/Spacer';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
function Skeleton() {
return (

4
packages/console/src/components/DetailsPage/index.tsx
View file

@ -3,7 +3,7 @@ import classNames from 'classnames';
import type { ReactElement, ReactNode } from 'react';
import { type To } from 'react-router-dom';
import Back from '@/assets/icons/back.svg';
import Back from '@/assets/icons/back.svg?react';
import type DangerousRaw from '@/ds-components/DangerousRaw';
import DynamicT from '@/ds-components/DynamicT';
import TextLink from '@/ds-components/TextLink';
@ -12,7 +12,7 @@ import type { RequestError } from '@/hooks/use-api';
import RequestDataError from '../RequestDataError';
import Skeleton from './Skeleton';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly backLink: To;

4
packages/console/src/components/Drawer/index.tsx
View file

@ -1,12 +1,12 @@
import type { AdminConsoleKey } from '@logto/phrases';
import ReactModal from 'react-modal';
import Close from '@/assets/icons/close.svg';
import Close from '@/assets/icons/close.svg?react';
import CardTitle from '@/ds-components/CardTitle';
import IconButton from '@/ds-components/IconButton';
import Spacer from '@/ds-components/Spacer';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly title?: AdminConsoleKey;

2
packages/console/src/components/EditScopeModal/index.tsx
View file

@ -8,7 +8,7 @@ import Button from '@/ds-components/Button';
import FormField from '@/ds-components/FormField';
import ModalLayout from '@/ds-components/ModalLayout';
import TextInput from '@/ds-components/TextInput';
import * as modalStyles from '@/scss/modal.module.scss';
import modalStyles from '@/scss/modal.module.scss';
import { trySubmitSafe } from '@/utils/form';
export type EditScopeData = {

6
packages/console/src/components/EmptyDataPlaceholder/index.tsx
View file

@ -3,11 +3,11 @@ import classNames from 'classnames';
import { type ReactNode } from 'react';
import { useTranslation } from 'react-i18next';
import EmptyDark from '@/assets/images/table-empty-dark.svg';
import Empty from '@/assets/images/table-empty.svg';
import EmptyDark from '@/assets/images/table-empty-dark.svg?react';
import Empty from '@/assets/images/table-empty.svg?react';
import useTheme from '@/hooks/use-theme';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly title?: ReactNode;

2
packages/console/src/components/EntitiesTransfer/components/EntityItem/index.tsx
View file

@ -5,7 +5,7 @@ import UserAvatar from '@/components/UserAvatar';
import SuspendedTag from '@/pages/Users/components/SuspendedTag';
import { getUserTitle } from '@/utils/user';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type UserItemProps = {
readonly entity: User;

6
packages/console/src/components/EntitiesTransfer/components/SourceEntitiesBox/index.tsx
View file

@ -6,7 +6,7 @@ import { useState } from 'react';
import { useTranslation } from 'react-i18next';
import useSWR from 'swr';
import Search from '@/assets/icons/search.svg';
import Search from '@/assets/icons/search.svg?react';
import EmptyDataPlaceholder from '@/components/EmptyDataPlaceholder';
import { defaultPageSize } from '@/consts';
import DynamicT from '@/ds-components/DynamicT';
@ -14,13 +14,13 @@ import Pagination from '@/ds-components/Pagination';
import TextInput from '@/ds-components/TextInput';
import type { RequestError } from '@/hooks/use-api';
import useDebounce from '@/hooks/use-debounce';
import * as transferLayout from '@/scss/transfer.module.scss';
import transferLayout from '@/scss/transfer.module.scss';
import { type Identifiable } from '@/types/general';
import { buildUrl, formatSearchKeyword } from '@/utils/url';
import SourceEntityItem from '../SourceEntityItem';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type SearchProps = {
pathname: string;

2
packages/console/src/components/EntitiesTransfer/components/SourceEntityItem/index.tsx
View file

@ -4,7 +4,7 @@ import Checkbox from '@/ds-components/Checkbox';
import { type Identifiable } from '@/types/general';
import { onKeyDownHandler } from '@/utils/a11y';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props<T> = {
readonly entity: T;

4
packages/console/src/components/EntitiesTransfer/components/TargetEntitiesBox/index.tsx
View file

@ -1,11 +1,11 @@
import { useTranslation } from 'react-i18next';
import * as transferLayout from '@/scss/transfer.module.scss';
import transferLayout from '@/scss/transfer.module.scss';
import { type Identifiable } from '@/types/general';
import TargetEntityItem from '../TargetEntityItem';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props<T> = {
readonly renderEntity: (entity: T) => React.ReactNode;

4
packages/console/src/components/EntitiesTransfer/components/TargetEntityItem/index.tsx
View file

@ -1,10 +1,10 @@
import { type ReactNode } from 'react';
import Close from '@/assets/icons/close.svg';
import Close from '@/assets/icons/close.svg?react';
import IconButton from '@/ds-components/IconButton';
import { type Identifiable } from '@/types/general';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props<T> = {
readonly entity: T;

4
packages/console/src/components/EntitiesTransfer/index.tsx
View file

@ -1,11 +1,11 @@
import classNames from 'classnames';
import * as transferLayout from '@/scss/transfer.module.scss';
import transferLayout from '@/scss/transfer.module.scss';
import { type Identifiable } from '@/types/general';
import SourceEntitiesBox, { type Props as SourceProps } from './components/SourceEntitiesBox';
import TargetEntitiesBox from './components/TargetEntitiesBox';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props<T extends Identifiable> = SourceProps<T> & {
readonly errorMessage?: string;

2
packages/console/src/components/FeatureTag/BetaTag.tsx
View file

@ -6,7 +6,7 @@ import classNames from 'classnames';
* Used to indicate that a new released feature is in beta.
*/
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly className?: string;

2
packages/console/src/components/FeatureTag/index.tsx
View file

@ -4,7 +4,7 @@ import { useContext } from 'react';
import { TenantsContext } from '@/contexts/TenantsProvider';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
export { default as BetaTag } from './BetaTag';

4
packages/console/src/components/FileIcon/index.tsx
View file

@ -1,8 +1,8 @@
import { Theme } from '@logto/schemas';
import { type ReactNode } from 'react';
import FileIconDark from '@/assets/icons/file-icon-dark.svg';
import FileIconLight from '@/assets/icons/file-icon.svg';
import FileIconDark from '@/assets/icons/file-icon-dark.svg?react';
import FileIconLight from '@/assets/icons/file-icon.svg?react';
import useTheme from '@/hooks/use-theme';
const themeToRoleIcon = Object.freeze({

2
packages/console/src/components/FormCard/FormCardLayout/index.tsx
View file

@ -2,7 +2,7 @@ import { type ReactNode } from 'react';
import Card from '@/ds-components/Card';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly introduction: ReactNode;

2
packages/console/src/components/FormCard/Skeleton/index.tsx
View file

@ -2,7 +2,7 @@ import FormFieldSkeleton from '@/ds-components/FormField/Skeleton';
import FormCardLayout from '../FormCardLayout';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly formFieldCount?: number;

2
packages/console/src/components/FormCard/index.tsx
View file

@ -6,7 +6,7 @@ import TextLink from '@/ds-components/TextLink';
import type { Props as TextLinkProps } from '@/ds-components/TextLink';
import FormCardLayout from './FormCardLayout';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
export type Props = {
readonly title: AdminConsoleKey;

2
packages/console/src/components/Guide/GuideCard/index.tsx
View file

@ -9,7 +9,7 @@ import { SubscriptionDataContext } from '@/contexts/SubscriptionDataProvider';
import Button from '@/ds-components/Button';
import { onKeyDownHandler } from '@/utils/a11y';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
export type SelectedGuide = {
id: Guide['id'];

2
packages/console/src/components/Guide/GuideCardGroup/index.tsx
View file

@ -5,7 +5,7 @@ import { type Guide } from '@/assets/docs/guides/types';
import GuideCard, { type SelectedGuide } from '../GuideCard';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly className?: string;

2
packages/console/src/components/Guide/ModalFooter/index.tsx
View file

@ -4,7 +4,7 @@ import classNames from 'classnames';
import Button from '@/ds-components/Button';
import DynamicT from '@/ds-components/DynamicT';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly wrapperClassName?: string;

2
packages/console/src/components/Guide/ModalHeader/RequestForm.tsx
View file

@ -10,7 +10,7 @@ import FormField from '@/ds-components/FormField';
import ModalLayout from '@/ds-components/ModalLayout';
import TextInput from '@/ds-components/TextInput';
import useCurrentUser from '@/hooks/use-current-user';
import * as modalStyles from '@/scss/modal.module.scss';
import modalStyles from '@/scss/modal.module.scss';
type Props = {
readonly title: AdminConsoleKey;

4
packages/console/src/components/Guide/ModalHeader/index.tsx
View file

@ -1,14 +1,14 @@
import { type AdminConsoleKey } from '@logto/phrases';
import { useCallback, useState } from 'react';
import Box from '@/assets/icons/box.svg';
import Box from '@/assets/icons/box.svg?react';
import { githubIssuesLink } from '@/consts';
import { isCloud } from '@/consts/env';
import Button from '@/ds-components/Button';
import DsModalHeader from '@/ds-components/ModalHeader';
import RequestForm from './RequestForm';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly title: AdminConsoleKey;

2
packages/console/src/components/Guide/StepsSkeleton/index.tsx
View file

@ -1,4 +1,4 @@
import * as styles from './index.module.scss';
import styles from './index.module.scss';
function StepsSkeleton() {
return (

2
packages/console/src/components/Guide/index.tsx
View file

@ -10,7 +10,7 @@ import MdxProvider from '@/mdx-components/MdxProvider';
import NotFound from '@/pages/NotFound';
import StepsSkeleton from './StepsSkeleton';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
export type GuideContextType = {
metadata: Readonly<GuideMetadata>;

2
packages/console/src/components/ImageInputs/index.tsx
View file

@ -22,7 +22,7 @@ import useImageMimeTypes from '@/hooks/use-image-mime-types';
import useUserAssetsService from '@/hooks/use-user-assets-service';
import { uriValidator } from '@/utils/validator';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
export const themeToLogoName = Object.freeze({
[Theme.Light]: 'logoUrl',

4
packages/console/src/components/Index/index.tsx
View file

@ -1,8 +1,8 @@
import classNames from 'classnames';
import Tick from '@/assets/icons/tick.svg';
import Tick from '@/assets/icons/tick.svg?react';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly className?: string;

2
packages/console/src/components/InlineUpsell/index.tsx
View file

@ -8,7 +8,7 @@ import useTenantPathname from '@/hooks/use-tenant-pathname';
import ContactUsPhraseLink from '../ContactUsPhraseLink';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly className?: string;

2
packages/console/src/components/ItemPreview/ApplicationPreview.tsx
View file

@ -5,7 +5,7 @@ import ApplicationIcon from '@/components/ApplicationIcon';
import { applicationTypeI18nKey } from '@/types/applications';
import ItemPreview from '.';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
const applicationsPathname = '/applications';
const buildDetailsPathname = (id: string) => `${applicationsPathname}/${id}`;

2
packages/console/src/components/ItemPreview/index.tsx
View file

@ -5,7 +5,7 @@ import { Link } from 'react-router-dom';
import useTenantPathname from '@/hooks/use-tenant-pathname';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly title: ReactNode;

4
packages/console/src/components/ListPage/index.tsx
View file

@ -2,14 +2,14 @@ import classNames from 'classnames';
import { type ReactNode } from 'react';
import { type FieldValues, type FieldPath } from 'react-hook-form';
import Plus from '@/assets/icons/plus.svg';
import Plus from '@/assets/icons/plus.svg?react';
import PageMeta, { type Props as PageMetaProps } from '@/components/PageMeta';
import { type Props as ButtonProps } from '@/ds-components/Button';
import Button from '@/ds-components/Button';
import { type Props as CardTitleProps } from '@/ds-components/CardTitle';
import CardTitle from '@/ds-components/CardTitle';
import Table, { type Props as TableProps } from '@/ds-components/Table';
import * as pageLayout from '@/scss/page-layout.module.scss';
import pageLayout from '@/scss/page-layout.module.scss';
type CreateButtonProps = {
title: ButtonProps['title'];

4
packages/console/src/components/LivePreviewButton/index.tsx
View file

@ -3,13 +3,13 @@ import classNames from 'classnames';
import { useContext } from 'react';
import { useTranslation } from 'react-i18next';
import ExternalLinkIcon from '@/assets/icons/external-link.svg';
import ExternalLinkIcon from '@/assets/icons/external-link.svg?react';
import { AppDataContext } from '@/contexts/AppDataProvider';
import type { Props as ButtonProps, ButtonType } from '@/ds-components/Button';
import Button from '@/ds-components/Button';
import { Tooltip } from '@/ds-components/Tip';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly size?: ButtonProps['size'];

2
packages/console/src/components/ManageOrganizationPermissionModal/index.tsx
View file

@ -10,7 +10,7 @@ import FormField from '@/ds-components/FormField';
import ModalLayout from '@/ds-components/ModalLayout';
import TextInput from '@/ds-components/TextInput';
import useApi from '@/hooks/use-api';
import * as modalStyles from '@/scss/modal.module.scss';
import modalStyles from '@/scss/modal.module.scss';
import { trySubmitSafe } from '@/utils/form';
type Props = {

2
packages/console/src/components/Markdown/index.tsx
View file

@ -17,7 +17,7 @@ import 'property-information';
import CodeEditor from '@/ds-components/CodeEditor';
import GithubRawImage from './components/GithubRawImage';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly className?: string;

4
packages/console/src/components/MauExceededModal/index.tsx
View file

@ -12,11 +12,11 @@ import FormField from '@/ds-components/FormField';
import InlineNotification from '@/ds-components/InlineNotification';
import ModalLayout from '@/ds-components/ModalLayout';
import useTenantPathname from '@/hooks/use-tenant-pathname';
import * as modalStyles from '@/scss/modal.module.scss';
import modalStyles from '@/scss/modal.module.scss';
import PlanName from '../PlanName';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
function MauExceededModal() {
const { currentTenant } = useContext(TenantsContext);

10
packages/console/src/components/MfaFactorTitle/index.tsx
View file

@ -1,16 +1,16 @@
import { MfaFactor } from '@logto/schemas';
import { type ReactNode } from 'react';
import FactorBackupCode from '@/assets/icons/factor-backup-code.svg';
import FactorTotp from '@/assets/icons/factor-totp.svg';
import FactorWebAuthn from '@/assets/icons/factor-webauthn.svg';
import Tip from '@/assets/icons/tip.svg';
import FactorBackupCode from '@/assets/icons/factor-backup-code.svg?react';
import FactorTotp from '@/assets/icons/factor-totp.svg?react';
import FactorWebAuthn from '@/assets/icons/factor-webauthn.svg?react';
import Tip from '@/assets/icons/tip.svg?react';
import IconButton from '@/ds-components/IconButton';
import { ToggleTip } from '@/ds-components/Tip';
import MfaFactorName, { type Props as MfaFactorNameProps } from '../MfaFactorName';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
const factorIcon: Record<MfaFactor, SvgComponent> = {
[MfaFactor.TOTP]: FactorTotp,

4
packages/console/src/components/MultiOptionInput/index.tsx
View file

@ -2,12 +2,12 @@ import { isKeyInObject, type Nullable } from '@silverhand/essentials';
import classNames from 'classnames';
import { type ReactNode, useRef, useState, useCallback } from 'react';
import Close from '@/assets/icons/close.svg';
import Close from '@/assets/icons/close.svg?react';
import IconButton from '@/ds-components/IconButton';
import Tag from '@/ds-components/Tag';
import { onKeyDownHandler } from '@/utils/a11y';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type CanBePromise<T> = T | Promise<T>;

2
packages/console/src/components/MultiTextInputField/index.tsx
View file

@ -5,7 +5,7 @@ import FormField from '@/ds-components/FormField';
import type { Props as MultiTextInputProps } from '@/ds-components/MultiTextInput';
import MultiTextInput from '@/ds-components/MultiTextInput';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = MultiTextInputProps &
Pick<FormFieldProps, 'isRequired' | 'tip'> & {

2
packages/console/src/components/OpenExternalLink/index.tsx
View file

@ -1,6 +1,6 @@
import { useTranslation } from 'react-i18next';
import ExternalLinkIcon from '@/assets/icons/external-link.svg';
import ExternalLinkIcon from '@/assets/icons/external-link.svg?react';
import IconButton from '@/ds-components/IconButton';
import { Tooltip } from '@/ds-components/Tip';

6
packages/console/src/components/OrganizationList/index.tsx
View file

@ -3,8 +3,8 @@ import { type ReactNode, useState } from 'react';
import { useTranslation } from 'react-i18next';
import useSWR from 'swr';
import OrganizationIcon from '@/assets/icons/organization-preview.svg';
import Tip from '@/assets/icons/tip.svg';
import OrganizationIcon from '@/assets/icons/organization-preview.svg?react';
import Tip from '@/assets/icons/tip.svg?react';
import EmptyDataPlaceholder from '@/components/EmptyDataPlaceholder';
import ItemPreview from '@/components/ItemPreview';
import { RoleOption } from '@/components/OrganizationRolesSelect';
@ -18,7 +18,7 @@ import { ToggleTip } from '@/ds-components/Tip';
import { type RequestError } from '@/hooks/use-api';
import useTenantPathname from '@/hooks/use-tenant-pathname';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly type: 'user' | 'application';

4
packages/console/src/components/OrganizationRolesSelect/index.tsx
View file

@ -1,14 +1,14 @@
import { type OrganizationRole, type RoleType } from '@logto/schemas';
import classNames from 'classnames';
import RoleIcon from '@/assets/icons/organization-role-feature.svg';
import RoleIcon from '@/assets/icons/organization-role-feature.svg?react';
import MultiSelect, { type Option } from '@/ds-components/Select/MultiSelect';
import useSearchValues from '@/hooks/use-search-values';
import Breakable from '../Breakable';
import ThemedIcon from '../ThemedIcon';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type RoleOptionProps = {
readonly title?: string;

4
packages/console/src/components/PaymentOverdueModal/index.tsx
View file

@ -10,11 +10,11 @@ import FormField from '@/ds-components/FormField';
import InlineNotification from '@/ds-components/InlineNotification';
import ModalLayout from '@/ds-components/ModalLayout';
import useSubscribe from '@/hooks/use-subscribe';
import * as modalStyles from '@/scss/modal.module.scss';
import modalStyles from '@/scss/modal.module.scss';
import BillInfo from '../BillInfo';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
function PaymentOverdueModal() {
const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });

8
packages/console/src/components/PermissionsTable/index.tsx
View file

@ -5,9 +5,9 @@ import { useState } from 'react';
import { toast } from 'react-hot-toast';
import { useTranslation } from 'react-i18next';
import Plus from '@/assets/icons/plus.svg';
import PermissionsEmptyDark from '@/assets/images/permissions-empty-dark.svg';
import PermissionsEmpty from '@/assets/images/permissions-empty.svg';
import Plus from '@/assets/icons/plus.svg?react';
import PermissionsEmptyDark from '@/assets/images/permissions-empty-dark.svg?react';
import PermissionsEmpty from '@/assets/images/permissions-empty.svg?react';
import { ApiResourceDetailsTabs } from '@/consts/page-tabs';
import Button from '@/ds-components/Button';
import type { Props as PaginationProps } from '@/ds-components/Pagination';
@ -24,7 +24,7 @@ import ActionsButton from '../ActionsButton';
import EditScopeModal, { type EditScopeData } from '../EditScopeModal';
import EmptyDataPlaceholder from '../EmptyDataPlaceholder';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type SearchProps = {
keyword: string;

2
packages/console/src/components/PlanUsage/index.tsx
View file

@ -7,7 +7,7 @@ import DynamicT from '@/ds-components/DynamicT';
import { type SubscriptionPlan } from '@/types/subscriptions';
import { formatPeriod } from '@/utils/subscription';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly subscriptionUsage: SubscriptionUsage;

2
packages/console/src/components/ProgressBar/index.tsx
View file

@ -1,6 +1,6 @@
import classNames from 'classnames';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly currentStep: number;

2
packages/console/src/components/QuotaGuardFooter/index.tsx
View file

@ -3,7 +3,7 @@ import { type ReactNode } from 'react';
import Button from '@/ds-components/Button';
import useTenantPathname from '@/hooks/use-tenant-pathname';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly children: ReactNode;

2
packages/console/src/components/Region/index.tsx
View file

@ -1,7 +1,7 @@
import classNames from 'classnames';
import { useTranslation } from 'react-i18next';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
// TODO: This is a copy from `@logto/cloud-models`, make a SSoT for this later
export enum RegionName {

6
packages/console/src/components/RequestDataError/index.tsx
View file

@ -2,14 +2,14 @@ import { Theme } from '@logto/schemas';
import classNames from 'classnames';
import { useTranslation } from 'react-i18next';
import RequestErrorDarkImage from '@/assets/images/request-error-dark.svg';
import RequestErrorImage from '@/assets/images/request-error.svg';
import RequestErrorDarkImage from '@/assets/images/request-error-dark.svg?react';
import RequestErrorImage from '@/assets/images/request-error.svg?react';
import Button from '@/ds-components/Button';
import Card from '@/ds-components/Card';
import type { RequestError } from '@/hooks/use-api';
import useTheme from '@/hooks/use-theme';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly error: RequestError;

4
packages/console/src/components/RoleAssignmentModal/index.tsx
View file

@ -11,10 +11,10 @@ import DangerousRaw from '@/ds-components/DangerousRaw';
import ModalLayout from '@/ds-components/ModalLayout';
import TextLink from '@/ds-components/TextLink';
import useApi from '@/hooks/use-api';
import * as modalStyles from '@/scss/modal.module.scss';
import modalStyles from '@/scss/modal.module.scss';
import { getUserTitle } from '@/utils/user';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = (
| {

4
packages/console/src/components/RoleIcon/index.tsx
View file

@ -1,8 +1,8 @@
import { Theme } from '@logto/schemas';
import { type ReactNode } from 'react';
import UserRoleIconDark from '@/assets/icons/role-feature-dark.svg';
import UserRoleIcon from '@/assets/icons/role-feature.svg';
import UserRoleIconDark from '@/assets/icons/role-feature-dark.svg?react';
import UserRoleIcon from '@/assets/icons/role-feature.svg?react';
import useTheme from '@/hooks/use-theme';
const themeToRoleIcon = Object.freeze({

6
packages/console/src/components/RoleScopesTransfer/components/ResourceItem/index.tsx
View file

@ -3,8 +3,8 @@ import classNames from 'classnames';
import { useState } from 'react';
import { useTranslation } from 'react-i18next';
import CaretExpanded from '@/assets/icons/caret-expanded.svg';
import CaretFolded from '@/assets/icons/caret-folded.svg';
import CaretExpanded from '@/assets/icons/caret-expanded.svg?react';
import CaretFolded from '@/assets/icons/caret-folded.svg?react';
import Checkbox from '@/ds-components/Checkbox';
import IconButton from '@/ds-components/IconButton';
import { onKeyDownHandler } from '@/utils/a11y';
@ -12,7 +12,7 @@ import { onKeyDownHandler } from '@/utils/a11y';
import type { DetailedResourceResponse } from '../../types';
import SourceScopeItem from '../SourceScopeItem';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly resource: DetailedResourceResponse;

2
packages/console/src/components/RoleScopesTransfer/components/SourceScopeItem/index.tsx
View file

@ -3,7 +3,7 @@ import type { ScopeResponse } from '@logto/schemas';
import Checkbox from '@/ds-components/Checkbox';
import { onKeyDownHandler } from '@/utils/a11y';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly scope: ScopeResponse;

6
packages/console/src/components/RoleScopesTransfer/components/SourceScopesBox/index.tsx
View file

@ -7,16 +7,16 @@ import { useMemo, useState } from 'react';
import { useTranslation } from 'react-i18next';
import useSWR from 'swr';
import Search from '@/assets/icons/search.svg';
import Search from '@/assets/icons/search.svg?react';
import EmptyDataPlaceholder from '@/components/EmptyDataPlaceholder';
import type { DetailedResourceResponse } from '@/components/RoleScopesTransfer/types';
import TextInput from '@/ds-components/TextInput';
import type { RequestError } from '@/hooks/use-api';
import * as transferLayout from '@/scss/transfer.module.scss';
import transferLayout from '@/scss/transfer.module.scss';
import ResourceItem from '../ResourceItem';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly roleId?: string;

4
packages/console/src/components/RoleScopesTransfer/components/TargetScopeItem/index.tsx
View file

@ -1,9 +1,9 @@
import type { ScopeResponse } from '@logto/schemas';
import Close from '@/assets/icons/close.svg';
import Close from '@/assets/icons/close.svg?react';
import IconButton from '@/ds-components/IconButton';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly scope: ScopeResponse;

4
packages/console/src/components/RoleScopesTransfer/components/TargetScopesBox/index.tsx
View file

@ -1,11 +1,11 @@
import type { ScopeResponse } from '@logto/schemas';
import { useTranslation } from 'react-i18next';
import * as transferLayout from '@/scss/transfer.module.scss';
import transferLayout from '@/scss/transfer.module.scss';
import TargetScopeItem from '../TargetScopeItem';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly selectedScopes: ScopeResponse[];

4
packages/console/src/components/RoleScopesTransfer/index.tsx
View file

@ -1,11 +1,11 @@
import type { ScopeResponse, RoleType } from '@logto/schemas';
import classNames from 'classnames';
import * as transferLayout from '@/scss/transfer.module.scss';
import transferLayout from '@/scss/transfer.module.scss';
import SourceScopesBox from './components/SourceScopesBox';
import TargetScopesBox from './components/TargetScopesBox';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
/**
* @deprecated Use `@/ds-component/DataTransferBox` instead.

2
packages/console/src/components/RolesTransfer/SourceRolesBox/SourceRoleItem/index.tsx
View file

@ -5,7 +5,7 @@ import { onKeyDownHandler } from '@/utils/a11y';
import RoleInformation from '../../components/RoleInformation';
import * as styles from './index.module.scss';
import styles from './index.module.scss';
type Props = {
readonly role: RoleResponse;

Some files were not shown because too many files have changed in this diff Show more