refactor!: next generation AFFiNE code structure (#1176)

packages/component/src/styles/types.ts

@@ -9,8 +9,8 @@ export type ThemeProviderProps = {
 
 export type ThemeProviderValue = {
   theme: AffineTheme;
-  mode: ThemeMode;
-  changeMode: (newMode: ThemeMode) => void;
+  mode: Theme;
+  changeMode: (newMode: Theme) => void;
 };
 
 export interface AffineTheme {

packages/component/src/ui/confirm/Confirm.tsx

@@ -1,5 +1,4 @@
 import { useTranslation } from '@affine/i18n';
-import { useState } from 'react';
 
 import { Button } from '../button';
 import { Modal, ModalCloseButton, ModalProps } from '../modal';
@@ -20,7 +19,7 @@ export type ConfirmProps = {
   buttonDirection?: 'row' | 'column';
   onConfirm?: () => void;
   onCancel?: () => void;
-} & Omit<ModalProps, 'open' | 'children'>;
+} & Omit<ModalProps, 'children'>;
 
 export const Confirm = ({
   title,
@@ -31,15 +30,14 @@ export const Confirm = ({
   onCancel,
   buttonDirection = 'row',
   cancelText = 'Cancel',
+  open,
 }: ConfirmProps) => {
-  const [open, setOpen] = useState(true);
   const { t } = useTranslation();
   return (
     <Modal open={open}>
       <StyledModalWrapper>
         <ModalCloseButton
           onClick={() => {
-            setOpen(false);
             onCancel?.();
           }}
         />
@@ -51,7 +49,6 @@ export const Confirm = ({
               shape="round"
               bold={true}
               onClick={() => {
-                setOpen(false);
                 onCancel?.();
               }}
               style={{ marginRight: '24px' }}
@@ -63,7 +60,6 @@ export const Confirm = ({
               shape="round"
               bold={true}
               onClick={() => {
-                setOpen(false);
                 onConfirm?.();
               }}
             >
@@ -77,7 +73,6 @@ export const Confirm = ({
               shape="round"
               bold={true}
               onClick={() => {
-                setOpen(false);
                 onConfirm?.();
               }}
               style={{ width: '284px', height: '38px', textAlign: 'center' }}
@@ -88,7 +83,6 @@ export const Confirm = ({
               shape="round"
               bold={true}
               onClick={() => {
-                setOpen(false);
                 onCancel?.();
               }}
               style={{

packages/data-center/src/index.ts

@@ -29,5 +29,14 @@ export type { DataCenter };
 export * from './message';
 export { AffineProvider } from './provider/affine';
 export * from './provider/affine/apis';
+export { getAuthorizer, GoogleAuth } from './provider/affine/apis/google';
+export {
+  createAuthClient,
+  createBareClient,
+} from './provider/affine/apis/request';
+export { RequestError } from './provider/affine/apis/request-error';
+export * from './provider/affine/apis/workspace';
+export { WebsocketProvider } from './provider/affine/sync';
+export { IndexedDBProvider } from './provider/local/indexeddb/indexeddb';
 export * from './types';
 export { WorkspaceUnit } from './workspace-unit';

packages/data-center/src/provider/affine/apis/workspace.ts

@@ -31,7 +31,7 @@ export interface Workspace {
   id: string;
   type: WorkspaceType;
   public: boolean;
-  permission_type: PermissionType;
+  permission: PermissionType;
   create_at: number;
 }
 

packages/i18n/package.json

@@ -27,8 +27,9 @@
   },
   "dependencies": {
     "@affine/debug": "workspace:*",
-    "react": "^18.2.0",
     "i18next": "^22.4.10",
+    "next-i18next": "^13.1.5",
+    "react": "^18.2.0",
     "react-i18next": "^12.1.5"
   },
   "devDependencies": {
@@ -36,6 +37,7 @@
     "@types/prettier": "^2.7.2",
     "prettier": "^2.8.4",
     "ts-node": "^10.9.1",
-    "typescript": "^4.9.5"
+    "typescript": "^4.9.5",
+    "next": "^13.2.2"
   }
 }

packages/i18n/src/index.ts

@@ -1,5 +1,11 @@
-import i18next, { Resource } from 'i18next';
-import { initReactI18next, Trans, useTranslation } from 'react-i18next';
+import i18next, { i18n, Resource } from 'i18next';
+import { appWithTranslation } from 'next-i18next';
+import {
+  I18nextProvider,
+  initReactI18next,
+  Trans,
+  useTranslation,
+} from 'react-i18next';
 
 import { LOCALES } from './resources';
 import type en_US from './resources/en.json';
@@ -32,7 +38,7 @@ declare module 'react-i18next' {
 
 const STORAGE_KEY = 'i18n_lng';
 
-export { i18n, LOCALES, Trans, useTranslation };
+export { appWithTranslation, I18nextProvider, LOCALES, Trans, useTranslation };
 
 const resources = LOCALES.reduce<Resource>(
   (acc, { tag, res }) => ({ ...acc, [tag]: { translation: res } }),
@@ -55,29 +61,35 @@ const standardizeLocale = (language: string) => {
 
   return fallbackLng;
 };
-let language = 'en';
 
-if (typeof window !== 'undefined') {
-  const localStorageLanguage = localStorage.getItem(STORAGE_KEY);
-  if (localStorageLanguage) {
-    language = standardizeLocale(localStorageLanguage);
-  } else {
-    language = standardizeLocale(navigator.language);
+export const createI18n = () => {
+  const i18n = i18next.createInstance();
+  i18n.use(initReactI18next).init({
+    lng: 'en',
+    fallbackLng,
+    debug: false,
+    resources,
+    interpolation: {
+      escapeValue: false, // not needed for react as it escapes by default
+    },
+  });
+
+  i18n.on('languageChanged', lng => {
+    localStorage.setItem(STORAGE_KEY, lng);
+  });
+  return i18n;
+};
+export function setUpLanguage(i: i18n) {
+  if (typeof window !== 'undefined') {
+    let language;
+    const localStorageLanguage = localStorage.getItem(STORAGE_KEY);
+    if (localStorageLanguage) {
+      language = standardizeLocale(localStorageLanguage);
+    } else {
+      language = standardizeLocale(navigator.language);
+    }
+    return i.changeLanguage(language);
   }
 }
-const i18n = i18next.createInstance();
-i18n.use(initReactI18next).init({
-  lng: language,
-  fallbackLng,
-  debug: false,
-  resources,
-  interpolation: {
-    escapeValue: false, // not needed for react as it escapes by default
-  },
-});
-
-i18n.on('languageChanged', lng => {
-  localStorage.setItem(STORAGE_KEY, lng);
-});
 
 // const I18nProvider = I18nextProvider;