Release/v4.0.0 beta.9

.github/workflows/dev.yaml

@@ -12,17 +12,13 @@ jobs:
 
     environment:
       name: dev/${{ github.event.pull_request.number }}
-      url: https://ui-kit-open-source.dev.amity.co/${{ github.event.pull_request.number }}
+      url: https://ui-kit.dev.amity.co/${{ github.event.pull_request.number }}
 
     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
@@ -86,6 +82,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.dev.amity.co
+          AWS_S3_BUCKET: ui-kit.dev.amity.co
           SOURCE_DIR: ./storybook-build
           DEST_DIR: ${{ github.event.pull_request.number }}

.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: ''

.npmrc

@@ -0,0 +1 @@
+//registry.npmjs.org/:_authToken=${NPM_TOKEN}

.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}
   />

.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 };
+        }),
       ],
     },
   },

.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 };
+        }),
       ],
     },
   },

CHANGELOG.md

@@ -2,6 +2,12 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+## 4.0.0-beta.9 (2024-07-12)
+
+### Bug Fixes
+
+- remove unused file ([6ac29fc](https://github.com/AmityCo/Amity-Social-Cloud-UIKit-Web-OpenSource/commit/6ac29fcf22a99029ed59bbde11b8967054c6fb78))
+
 ## 4.0.0-beta.8 (2024-06-24)
 
 ## 4.0.0-beta.7 (2024-06-18)

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"
         }
       }
     },

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@amityco/ui-kit-open-source",
-  "version": "4.0.0-beta.8",
+  "version": "4.0.0-beta.9",
   "engines": {
     "node": ">=20",
     "pnpm": "9"
@@ -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",