Merge remote-tracking branch 'upstream/develop' into develop

AmityCo · Jul 12, 2024 · fa1ddfd · fa1ddfd
1 parent 038dfcb
commit fa1ddfd
Show file tree

Hide file tree

Showing 434 changed files with 19,519 additions and 7,074 deletions.
diff --git a/.github/workflows/dev.yaml b/.github/workflows/dev.yaml
@@ -17,12 +17,7 @@ jobs:
     env:
       STORYBOOK_API_REGION: ${{ secrets.STORYBOOK_API_REGION }}
       STORYBOOK_API_KEY: ${{ secrets.STORYBOOK_API_KEY }}
-      STORYBOOK_USER1: ${{ secrets.STORYBOOK_USER1 }}
-      STORYBOOK_USER2: ${{ secrets.STORYBOOK_USER2 }}
-      STORYBOOK_USER3: ${{ secrets.STORYBOOK_USER3 }}
-      STORYBOOK_USER4: ${{ secrets.STORYBOOK_USER4 }}
-      STORYBOOK_USER5: ${{ secrets.STORYBOOK_USER5 }}
-      STORYBOOK_USER6: ${{ secrets.STORYBOOK_USER6 }}
+      STORYBOOK_USERS: ${{ secrets.STORYBOOK_USERS }}
 
     steps:
       - name: git checkout

diff --git a/.github/workflows/staging.yaml b/.github/workflows/staging.yaml
@@ -11,17 +11,13 @@ jobs:
 
     environment:
       name: staging
-      url: https://ui-kit-open-source.staging.amity.co/
+      url: https://ui-kit.staging.amity.co/
 
     env:
+      NPM_FONT_AWESOME_TOKEN: ${{ secrets.NPM_FONT_AWESOME_TOKEN }}
       STORYBOOK_API_REGION: ${{ secrets.STORYBOOK_API_REGION }}
       STORYBOOK_API_KEY: ${{ secrets.STORYBOOK_API_KEY }}
-      STORYBOOK_USER1: ${{ secrets.STORYBOOK_USER1 }}
-      STORYBOOK_USER2: ${{ secrets.STORYBOOK_USER2 }}
-      STORYBOOK_USER3: ${{ secrets.STORYBOOK_USER3 }}
-      STORYBOOK_USER4: ${{ secrets.STORYBOOK_USER4 }}
-      STORYBOOK_USER5: ${{ secrets.STORYBOOK_USER5 }}
-      STORYBOOK_USER6: ${{ secrets.STORYBOOK_USER6 }}
+      STORYBOOK_USERS: ${{ secrets.STORYBOOK_USERS }}
 
     steps:
       - name: git checkout
@@ -50,6 +46,9 @@ jobs:
           restore-keys: |
             ${{ runner.os }}-pnpm-store-
 
+      - name: Install dependencies
+        run: pnpm install
+
       - name: build storybook
         run: pnpm run storybook:build
 
@@ -60,6 +59,6 @@ jobs:
         env:
           AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
           AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
-          AWS_S3_BUCKET: ui-kit-open-source.staging.amity.co
+          AWS_S3_BUCKET: ui-kit.staging.amity.co
           SOURCE_DIR: ./storybook-build
           DEST_DIR: ''
diff --git a/.npmrc b/.npmrc
@@ -0,0 +1 @@
+//registry.npmjs.org/:_authToken=${NPM_TOKEN}
diff --git a/.storybook/decorators/FluidControl.tsx b/.storybook/decorators/FluidControl.tsx
@@ -23,9 +23,8 @@ const FullScreen = (props) => (
       position: 'absolute',
       left: 0,
       top: 0,
-      width: '100vw',
-      height: '100vh',
-      overflow: 'auto',
+      width: '100dvw',
+      height: '100dvh',
     }}
     {...props}
   />

diff --git a/.storybook/decorators/UiKitDecorator.tsx b/.storybook/decorators/UiKitDecorator.tsx
@@ -3,6 +3,8 @@ import UiKitProvider from '../../src/core/providers/UiKitProvider';
 import { Preview } from '@storybook/react';
 import amityConfig from '../../amity-uikit.config.json';
 
+const users = import.meta.env.STORYBOOK_USERS.split(',');
+
 const GLOBAL_NAME = 'user';
 const global = {
   [GLOBAL_NAME]: {
@@ -13,30 +15,9 @@ const global = {
       icon: 'user',
       items: [
         { value: 'Web-Test,Web-test', title: 'Web-Test' },
-        {
-          value: import.meta.env.STORYBOOK_USER1,
-          title: import.meta.env.STORYBOOK_USER1?.split(',')[1],
-        },
-        {
-          value: import.meta.env.STORYBOOK_USER2,
-          title: import.meta.env.STORYBOOK_USER2?.split(',')[1],
-        },
-        {
-          value: import.meta.env.STORYBOOK_USER3,
-          title: import.meta.env.STORYBOOK_USER3?.split(',')[1],
-        },
-        {
-          value: import.meta.env.STORYBOOK_USER4,
-          title: import.meta.env.STORYBOOK_USER4?.split(',')[1],
-        },
-        {
-          value: import.meta.env.STORYBOOK_USER5,
-          title: import.meta.env.STORYBOOK_USER5?.split(',')[1],
-        },
-        {
-          value: import.meta.env.STORYBOOK_USER6,
-          title: import.meta.env.STORYBOOK_USER6?.split(',')[1],
-        },
+        ...users.map((user) => {
+          return { value: `${user},${user}`, title: user };
+        }),
       ],
     },
   },

diff --git a/.storybook/decorators/UiKitV4Decorator.tsx b/.storybook/decorators/UiKitV4Decorator.tsx
@@ -4,6 +4,8 @@ import { Preview } from '@storybook/react';
 import amityConfig from '../../amity-uikit.config.json';
 import { Config } from '../../src/v4/core/providers/CustomizationProvider';
 
+const users = import.meta.env.STORYBOOK_USERS.split(',');
+
 const GLOBAL_NAME = 'user';
 const global = {
   [GLOBAL_NAME]: {
@@ -14,30 +16,9 @@ const global = {
       icon: 'user',
       items: [
         { value: 'Web-Test,Web-test', title: 'Web-Test' },
-        {
-          value: import.meta.env.STORYBOOK_USER1,
-          title: import.meta.env.STORYBOOK_USER1?.split(',')[1],
-        },
-        {
-          value: import.meta.env.STORYBOOK_USER2,
-          title: import.meta.env.STORYBOOK_USER2?.split(',')[1],
-        },
-        {
-          value: import.meta.env.STORYBOOK_USER3,
-          title: import.meta.env.STORYBOOK_USER3?.split(',')[1],
-        },
-        {
-          value: import.meta.env.STORYBOOK_USER4,
-          title: import.meta.env.STORYBOOK_USER4?.split(',')[1],
-        },
-        {
-          value: import.meta.env.STORYBOOK_USER5,
-          title: import.meta.env.STORYBOOK_USER5?.split(',')[1],
-        },
-        {
-          value: import.meta.env.STORYBOOK_USER6,
-          title: import.meta.env.STORYBOOK_USER6?.split(',')[1],
-        },
+        ...users.map((user) => {
+          return { value: `${user},${user}`, title: user };
+        }),
       ],
     },
   },

diff --git a/amity-uikit.config.json b/amity-uikit.config.json
@@ -177,28 +177,46 @@
     "live_chat/*/*": {
       "theme": {
         "light": {
-          "primary_color": "#1054DE",
-          "secondary_color": "#ebecef",
+          "primary_color": "#1054de",
+          "base_inverse_color": "#fff",
           "base_color": "#ebecef",
           "base_shade1_color": "#a5a9b5",
           "base_shade2_color": "#6e7487",
           "base_shade3_color": "#40434e",
           "base_shade4_color": "#292b32",
-          "alert_color": "#FA4D30",
+          "secondary_color": "#292b32",
+          "secondary_shade1_color": "#a5a9b5",
+          "secondary_shade2_color": "#898e9e",
+          "secondary_shade3_color": "#a5a9b5",
+          "secondary_shade4_color": "#40434e",
+          "secondary_shade5_color": "#292b32",
+          "alert_color": "#fa4d30",
+          "highlight_color": "#1054de",
+          "message_bubble_primary_color": "#1054de",
+          "message_bubble_secondary_color": "#292b32",
           "background_color": "#191919",
-          "base_inverse_color": "#FFFFFF"
+          "background_shade1_color": "#40434e"
         },
         "dark": {
-          "primary_color": "#1054DE",
-          "secondary_color": "#ebecef",
+          "primary_color": "#1054de",
+          "base_inverse_color": "#fff",
           "base_color": "#ebecef",
           "base_shade1_color": "#a5a9b5",
           "base_shade2_color": "#6e7487",
           "base_shade3_color": "#40434e",
           "base_shade4_color": "#292b32",
-          "alert_color": "#FA4D30",
+          "secondary_color": "#292b32",
+          "secondary_shade1_color": "#a5a9b5",
+          "secondary_shade2_color": "#898e9e",
+          "secondary_shade3_color": "#a5a9b5",
+          "secondary_shade4_color": "#40434e",
+          "secondary_shade5_color": "#292b32",
+          "alert_color": "#fa4d30",
+          "highlight_color": "#1054de",
+          "message_bubble_primary_color": "#1054de",
+          "message_bubble_secondary_color": "#292b32",
           "background_color": "#191919",
-          "base_inverse_color": "#FFFFFF"
+          "background_shade1_color": "#40434e"
         }
       }
     },

diff --git a/package.json b/package.json
@@ -61,6 +61,7 @@
     "@types/lodash": "^4.14.202",
     "@types/prop-types": "^15.7.11",
     "@types/react": "^17.0.74",
+    "@types/react-dom": "^18.3.0",
     "@types/react-helmet": "^6.1.11",
     "@types/react-infinite-scroller": "^1.2.5",
     "@types/react-mentions": "^4.1.13",
@@ -106,14 +107,17 @@
     "@fortawesome/react-fontawesome": "^0.2.0",
     "@hookform/error-message": "^2.0.1",
     "@hookform/resolvers": "^3.3.4",
+    "@lexical/link": "^0.16.1",
+    "@lexical/react": "^0.16.1",
     "@radix-ui/react-tabs": "^1.0.4",
     "@tanstack/react-query": "^5.28.14",
     "clsx": "^2.1.0",
+    "colorthief": "^2.4.0",
     "dayjs": "^1.11.11",
-    "extract-colors": "^4.0.2",
     "filesize": "^9.0.11",
     "framer-motion": "^11.1.7",
     "hls.js": "^1.4.14",
+    "lexical": "^0.16.1",
     "linkify-react": "^4.1.3",
     "linkifyjs": "^4.1.3",
     "lodash": "^4.17.21",