Release/v4.0.0 beta.2 (AmityCo#54)

* chore: ASC-00000 - css module typescript config (#233) * fix: ASC-21254 - align api signature for draft page (#210) * fix: can't upload story * fix: story image renderer * fix: align comment tray component props * fix: align story tab component props * fix: change export name to align signature api * fix: ddraft page * fix: align signature api * fix: fill color * fix: ASC-21249 - align story tab component props (#203) * fix: can't upload story * fix: story image renderer * fix: align comment tray component props * fix: align story tab component props * fix: change export name to align signature api * fix: ddraft page * fix: align signature api * fix: story tab * fix: ASC-21260 - align comment tray component props (#202) * fix: can't upload story * fix: story image renderer * fix: align comment tray component props * fix: align story tab component props * fix: change export name to align signature api * fix: ddraft page * fix: align signature api * fix: story tab * fix: remove unused * fix: comment tray * fix: ASC-21404 - AmityViewStoryPage signature alignment (#209) * fix z-index * fix: signature alignment * fix: view story page * feat: add to support 6 users for storybook (#238) * feat: ASC-00000 - use more env from secrets (#239) * feat: add to support 6 users for storybook * fix: add to read env from secrets * feat: ASC-00000 - add more storybook user (#240) * feat: add to support 6 users for storybook * fix: add to read env from secrets * fix: add use secret on staging * fix: permission (#244) * fix: ASC-21393 - refactor customization 4.0 (#211) * feat: add generateShadeColors func * feat: add AmityUIKitManager * chore: add tsdoc to AmityUIKitManager * fix: merge from develop * fix: AmityUIKit manager * fix: remove unused * fix: revert uikit 3 * fix: remove unused * fix: export * fix: move to main v4 * fix: move to v4 * fix: export path * Refactor theme generation logic in ThemeProvider.tsx * fix: theme color generation * fix: theme provider * fix: remove unused * feat: add Typography component with css * fix: css * fix: add queryClient provider * fix: import * fix: import * fix: v4 * fix: conflict * fix: draft page * fix: setup * fix: export * fix: move mergedNavigationBehavior * fix: remove unused * fix: remove unused * fix: uikit manager * fix: uncomment * fix: remove unused * fix: remove unused * fix: remove unused * fix: remove unused files * fix: remove * fix: login * fix: css var * fix: css var * fix: condition * fix: css var * fix: css var * fix: hook * fix: type * fix: ASC-00000 - V4 fix customization (#248) * fix: config structure * fix: add hyperlink config * fix: add validate * fix: config and hyperlink * fix: hyperlink * fix: css * fix: border radius * fix: hyperlink * fix: hyperlink * fix: add storybook user * fix: aspect ratio * fix: hyperlink config css var Co-authored-by: Kiattirat Sujjapongse <[email protected]> * fix: css var module Co-authored-by: Kiattirat Sujjapongse <[email protected]> * fix: ASC-21789 - create story on view story page doesn't work (#249) * fix: video * fix: uncomment --------- Co-authored-by: Kiattirat Sujjapongse <[email protected]> --------- Co-authored-by: Kiattirat Sujjapongse <[email protected]> * feat(chat): ASC-0000 - Chat V4 big chunk 1 (#214) * feat: add livechat ui * feat: add chatButton and desktop view * fix: bg color * feat: move story to be under V4 storybook folder * feat: add customComponent * fix: change chat icon * fix: remove unread notification * fix: remove un-used hook * fix: remove un-used * fix: change style to module css * fix: remove unused * feat: add prefix`asc` to default css config * fix: remove chatIcon * fix: modal not open smoothly at the first time * fix: remove un-used styling * feat: update color pallate * feat: update spacing * feat: update color and fontSize * fix: box shadow on header * feat: re-structure folder to v4 * fix: import global css * fix: use typograhy module css * fix: remove unused * feat: add message list and bubbles * fix: wrap element * fix: change file name * feat: add compose bar * feat: add home indicator * feat: add sending a mesage action * fix: sorting message to be asc * feat: add badge for moderator * fix: overflow message * fix: sortBy segmentAsc * feat: add message list pagination * feat(chat): add draft-js as a compose bar * feat: add loading indicator * feat(chat): fix submit * feat(chat): fix compose bar container * feat: add viewing reply message * fix: deleted message display * fix: remove comment * feat(chat): use default compose bar / remove draft-js * feat(chat): remove draft * feat(chat-state): asc-20903 done loading state * feat(chat-state): asc-20903 restructure * feat(chat-state): asc-20903 apply infinite scroll * feat(chat-state): asc-20903 include error from sdk api to local hook * feat(chat-state): asc-20903 add error state * feat(chat-state): asc-20903 add error state * feat(chat-mention): asc-00000 create message with mention * feat: add popover action * feat: add hover state for message action * feat: add flag and mention button * feat(chat-mention): asc-00000 click to mention * feat: add more action * fix: merge * fix: hide mention and flag * fix: ASC-20213 - fix message list (#219) * fix: message list of the same user * fix: z-index * feat: confirm modal v3 to support dark mode * fix: change to use i18n * fix: TODO text display on Modal content * fix: merge className * fix: remove unused * fix: bring overflow-y back Co-authored-by: Kiattirat Sujjapongse <[email protected]> --------- Co-authored-by: Kiattirat Sujjapongse <[email protected]> * fix(chat): fix pagination issue (#223) * feat(chat): ASC-21243 - create message with reply message (#218) * feat(chat): reply placeholder * feat(chat): create message with reply * feat: ASC-00000 - dark mode hard code (#225) * fix: dark theme color palatte * fix: header color styling * fix: colors on message bubble * fix: color on popover * fix: color on optionIcon * fix(chat): asc-00000 - fix loading state css broken (#221) * fix(chat): asc-00000 loading state css missing * fix(chat): asc-00000 loading state css missing * feat(chat): ASC-20222 - connection offline alert (#213) * feat(chat): asc-20222 - connection state * feat(chat): asc-20222 - add more connection * feat(chat): asc-20222 - update PR * feat(chat): asc-20222 - update PR * feat: update PR * fix(chat): ASC-00000 - update mention payload (#224) * fix(chat): update mention payload * fix(chat): mention ALL * fix: sample app to open sheet every selection * fix: hide heart reaction * feat: ASC-20213 - fix popover still show (#235) * fix: popover still show * fix: bring just ArrowTop code back * fix: resize messagelist container (#232) * feat: ASC-20213 - highlight mention message (#236) * fix: popover still show * fix: bring just ArrowTop code back * feat: add hilight for mention message * fix: truncate long text of replied message * fix: change getTextWithMention to be a component * fix: message not show as a new line * feat: ASC-20213 - fix consequence message list (#237) * fix: remove consequence message list * fix: remove unused * feat(chat): ASC-00000 - api alignment for chat header (#241) * feat(chat): api alignment chat header * Update src/v4/chat/components/AmityLiveChatHeader/livechatHeader.stories.tsx * feat(chat): ASC-00000 - export AmityLiveChatHeader * fix: ASC-21776 - reply message display on compose bar is over the screen (#242) * fix: reply display message over the screen * feat: remove comment * feat(chat): duplicate useSocialMention => useMention and revert * feat(chat): update pr * fix(chat): ASC-00000 - change theme for message composer (#234) * fix(chat): ASC-00000 - duplicate v4 * fix(chat): ASC-00000 - check message length before submit * fix(chat): ASC-00000 -update styling * fix(chat): ASC-00000 - update styling * fix(chat): prettier remove code by accident * fix(chat): remove styled component * fix(chat): asc-21737 - update condition to prevent create duplicate message (#245) * fix(chat): asc-21791 - fix mention payload (#243) * feat(chat): update pr * feat: ASC-20213 - message bubble api alignment (#247) * fix: message bubble api aligment * fix: to use action as params for message bubble * feat: export elements * fix: remove unused * fix: change type name Co-authored-by: Kiattirat Sujjapongse <[email protected]> * fix: type name * feat: expose component * fix: wrong type name * fix: modify expose component * fix: storybook's name --------- Co-authored-by: Kiattirat Sujjapongse <[email protected]> * fix(chat): ASC-21796 - query chat after connection back to normal + api alignment (#246) * fix(chat): asc-21796 reload data when connection back to normal * feat(chat): api alignment for message list * feat(chat): export * feat(chat): api align live chat page * feat(chat): api align for composer * feat(chat): update pr * feat(chat): update pr * feat(chat): remove all v4 component from useCustomComponent * feat(chat): update pr - remove chat header * feat(chat): ASC-00000 - compose bar api alignment (#250) * feat(chat): composebar alignment * feat(chat): update pr * fix(chat): revert code (#251) * feat: ASC-20213 - modal notification v4 (#252) * fix: add confirm modal v4 * fix: change to use Notification v4 * fix: remove unused * fix: duplicate icon to v4 * fix: move confirm model component * fix: revert modal and confirm v3 components * fix: revert notification v3 * fix: move Icon to v4 and remove unused icon * fix(chat): revert code * feat: ASC-20213 - fix delete message display (#256) * fix: move component to v4 folder * fix: delete message * feat(chat): update pr * fix(chat): ASC-21734 - Fix UI Bug (#255) * fix(chat): update mention ui * fix(chat): update mention ui * fix(chat): update delete word * fix(chat): update mention ui * fix(chat): update mention ui * Update src/i18n/en.json Co-authored-by: Pitchaya T. <[email protected]> * feat(chat): update mention logic * feat(chat): update pr * feat(chat): revert text * feat(chat): update mention logic * fix(chat): popup width * fix(chat): font-color in light mode * fix(chat): placeholder * fix(chat): fix moderator * feat(chat): fix mention * feat(chat): fix avatar in reply * feat(chat): update pr * feat(chat): use rem * feat(chat): update pr --------- Co-authored-by: Pitchaya T. <[email protected]> * fix: ASC-20213 - bug staging (#257) * fix: bug staging * fix: revert overflow-x * feat: ASC-20213 - livechat configuration merge (#253) * feat: add generateShadeColors func * feat: add AmityUIKitManager * chore: add tsdoc to AmityUIKitManager * fix: merge from develop * fix: AmityUIKit manager * fix: remove unused * fix: revert uikit 3 * fix: remove unused * fix: export * fix: move to main v4 * fix: move to v4 * fix: export path * Refactor theme generation logic in ThemeProvider.tsx * fix: theme color generation * fix: theme provider * fix: remove unused * feat: add Typography component with css * fix: css * fix: add queryClient provider * fix: import * fix: import * fix: color palette * fix: change global.css file * fix: v4 * fix: conflict * fix: draft page * fix: setup * fix: export * fix: move mergedNavigationBehavior * fix: remove unused * fix: remove unused * fix: uikit manager * fix: uncomment * fix: remove unused * fix: remove unused * fix: remove unused * fix: remove unused files * fix: remove * fix: login * fix: typography and style files * fix: typography * fix: message type * fix: type * fix: add background to livechat page * feat: add config for message bubble * feat: fix cannot load next page * fix: type * feat: add placeholder for compose bar configuration * feat: revert storybook user * fix: use primary color from theme * fix: nested component style * fix: to pass class * fix: change to be module.css * fix: remove unused file * fix: remove unused config * fix: typography * fix: default user avatar * feat: upgrade ts-sdk * fix: revet theme file --------- Co-authored-by: Chaiwat Trisuwan <[email protected]> * fix(chat): change tag --------- Co-authored-by: ptchaya_p <[email protected]> Co-authored-by: ptchaya_p <[email protected]> Co-authored-by: Pitchaya T <[email protected]> Co-authored-by: Chaiwat Trisuwan <[email protected]> * feat(chat): ASC-0000 - export compose bar (#258) * feat: export v4 provider (#259) * Release/v4.0.0 beta.1 (#262) * fix: update ts-sdk version * chore(release): 4.0.0-beta.1 --------- Co-authored-by: Chaiwat Trisuwan <[email protected]> Co-authored-by: bmo-amity-bot <[email protected]> * fix: ASC-00000 - export type (#263) * fix: export type * fix: update version * fix: ASC-00000 - fix provider v4 props (#261) * fix: provider * fix: provider * fix: export * fix: export * fix: type * fix: pnpm lock * fix: deps * fix: export wrong path (#264) * chore(release): 4.0.0-beta.2 * chore(release): 4.0.0-beta.2 --------- Co-authored-by: Bonn <[email protected]> Co-authored-by: Pitchaya T <[email protected]> Co-authored-by: Kiattirat Sujjapongse <[email protected]> Co-authored-by: ptchaya_p <[email protected]> Co-authored-by: ptchaya_p <[email protected]> Co-authored-by: bmo-amity-bot <[email protected]>
forte-fit · Apr 13, 2024 · bf76f37 · bf76f37
1 parent d62aa2d
commit bf76f37
Show file tree

Hide file tree

Showing 274 changed files with 8,870 additions and 1,748 deletions.
diff --git a/.github/workflows/dev.yaml b/.github/workflows/dev.yaml
@@ -16,6 +16,10 @@ jobs:
       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 }}
 
     steps:
       - name: git checkout

diff --git a/.github/workflows/staging.yaml b/.github/workflows/staging.yaml
@@ -18,6 +18,10 @@ jobs:
       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 }}
 
     steps:
       - name: git checkout

diff --git a/.storybook/decorators/UiKitDecorator.tsx b/.storybook/decorators/UiKitDecorator.tsx
@@ -1,10 +1,11 @@
-import React, { useCallback, useEffect, useRef } from 'react';
-import UiKitProvider from '../../src/core/providers/UiKitProvider';
-
+import React, { useCallback } from 'react';
+import { AmityUIKitProvider } from '../../src/v4/core/providers';
 import { Preview } from '@storybook/react';
+import amityConfig from '../../amity-uikit.config.json';
 
-const GLOBAL_NAME = 'user';
+export type AmityUIKitConfig = typeof amityConfig;
 
+const GLOBAL_NAME = 'user';
 const global = {
   [GLOBAL_NAME]: {
     name: 'User selector',
@@ -13,10 +14,7 @@ const global = {
     toolbar: {
       icon: 'user',
       items: [
-        {
-          value: 'Web-Test,Web-Test',
-          title: 'Web-Test',
-        },
+        { value: 'Web-Test,Web-test', title: 'Web-Test' },
         {
           value: import.meta.env.STORYBOOK_USER1,
           title: import.meta.env.STORYBOOK_USER1?.split(',')[1],
@@ -25,27 +23,36 @@ const global = {
           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],
+        },
       ],
     },
   },
 };
 
 const FALLBACK_USER = 'Web-Test,Web-Test';
 
-const apiKey = import.meta.env.STORYBOOK_API_KEY;
-const apiRegion = import.meta.env.STORYBOOK_API_REGION;
-
-const decorator: NonNullable<Preview['decorators']> = (
+const decorator: NonNullable<Preview['decorators']>[number] = (
   Story,
-  { globals: { [GLOBAL_NAME]: val } },
+  { globals: { [GLOBAL_NAME]: val, theme } },
 ) => {
   const user = val || FALLBACK_USER;
   const [userId, displayName] = user.split(',');
 
-  const ref = useRef<{ logout: () => void; login: () => Promise<void> } | null>(null);
-
-  console.log('-------------------', val);
-
   const handleConnectionStatusChange = useCallback((...args) => {
     console.log(`[UiKitProvider.handleConnectionStatusChange]`, ...args);
   }, []);
@@ -58,28 +65,21 @@ const decorator: NonNullable<Preview['decorators']> = (
     console.log(`[UiKitProvider.handleDisconnected]`, ...args);
   }, []);
 
-  useEffect(() => {
-    ref.current?.logout();
-    ref.current?.login();
-  }, [userId]);
-
   return (
-    <UiKitProvider
+    <AmityUIKitProvider
+      apiKey={import.meta.env.STORYBOOK_API_KEY}
+      apiRegion={import.meta.env.STORYBOOK_API_REGION}
       key={userId}
-      apiKey={apiKey}
-      apiRegion={apiRegion}
       userId={userId}
       displayName={displayName || userId}
       onConnectionStatusChange={handleConnectionStatusChange}
       onConnected={handleConnected}
       onDisconnected={handleDisconnected}
+      configs={amityConfig}
     >
       {Story()}
-    </UiKitProvider>
+    </AmityUIKitProvider>
   );
 };
 
-export default {
-  global,
-  decorator,
-};
+export default { global, decorator };
diff --git a/.storybook/preview.ts b/.storybook/preview.ts
@@ -13,6 +13,8 @@ const preview: Preview = {
           ['Social', 'Chat'],
           'Utilities',
           'Assets',
+          'V4',
+          ['Chat'],
         ],
       },
     },

diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+  "typescript.tsdk": "node_modules/typescript/lib"
+}
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -2,6 +2,8 @@
 
 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.2 (2024-04-12)
+
 ## 4.0.0-beta.1 (2024-04-05)
 
 ### Bug Fixes

diff --git a/amity-uikit.config.json b/amity-uikit.config.json
@@ -1,133 +1,174 @@
 {
-  "global_theme": {
-    "light_theme": {
+  "preferred_theme": "default",
+  "theme": {
+    "light": {
       "primary_color": "#1054DE",
-      "secondary_color": "#292B32"
+      "secondary_color": "#292B32",
+      "base_color": "#292b32",
+      "base_shade1_color": "#636878",
+      "base_shade2_color": "#898e9e",
+      "base_shade3_color": "#a5a9b5",
+      "base_shade4_color": "#ebecef",
+      "alert_color": "#FA4D30",
+      "background_color": "#FFFFFF"
+    },
+    "dark": {
+      "primary_color": "#1054DE",
+      "secondary_color": "#292B32",
+      "base_color": "#ebecef",
+      "base_shade1_color": "#a5a9b5",
+      "base_shade2_color": "#6e7487",
+      "base_shade3_color": "#40434e",
+      "base_shade4_color": "#292b32",
+      "alert_color": "#FA4D30",
+      "background_color": "#191919"
     }
   },
   "excludes": [],
   "customizations": {
     "select_target_page/*/*": {
-      "page_theme": {
-        "light_theme": {
-          "primary_color": "#1054DE",
-          "secondary_color": "#292B32"
-        }
-      },
+      "theme": {},
       "title": "Share to"
     },
     "select_target_page/*/back_button": {
-      "back_icon": "back"
+      "theme": {},
+      "back_icon": "back.png"
     },
+
     "camera_page/*/*": {
-      "resolution": "720p",
-      "page_theme": {
-        "light_theme": {
-          "primary_color": "#1054DE",
-          "secondary_color": "#292B32"
-        }
-      }
+      "theme": {},
+      "resolution": "720p"
     },
     "camera_page/*/close_button": {
-      "close_icon": "close",
-      "background_color": "#80000000"
+      "theme": {},
+      "close_icon": "close.png"
+    },
+    "create_story_page/*/*": {
+      "theme": {}
     },
-    "create_story_page/*/*": {},
     "create_story_page/*/back_button": {
-      "back_icon": "back",
-      "background_color": "#80000000"
+      "theme": {},
+      "back_icon": "back.png",
+      "background_color": ""
     },
     "create_story_page/*/aspect_ratio_button": {
-      "aspect_ratio_icon": "aspect_ratio",
-      "background_color": "#80000000"
+      "theme": {},
+      "aspect_ratio_icon": "aspect_ratio.png",
+      "background_color": ""
     },
     "create_story_page/*/story_hyperlink_button": {
-      "hyperlink_button_icon": "hyperlink_button",
+      "theme": {},
+      "hyperlink_button_icon": "hyperlink_button.png",
       "background_color": ""
     },
     "create_story_page/*/hyper_link": {
-      "hyper_link_icon": "hyper_link",
+      "theme": {},
+      "hyper_link_icon": "hyper_link.png",
       "background_color": ""
     },
     "create_story_page/*/share_story_button": {
-      "share_icon": "share_story_button",
-      "background_color": "#FFFFFF",
+      "theme": {},
+      "share_icon": "share_story_button.png",
+      "background_color": "",
       "hide_avatar": false
     },
-    "story_page/*/*": {},
-    "story_page/*/progress_bar": {},
+    "story_page/*/*": {
+      "theme": {}
+    },
+    "story_page/*/progress_bar": {
+      "theme": {},
+      "progress_color": "",
+      "background_color": ""
+    },
     "story_page/*/overflow_menu": {
-      "overflow_menu_icon": "threeDot"
+      "theme": {},
+      "overflow_menu_icon": "threeDot.png"
     },
     "story_page/*/close_button": {
-      "close_icon": "close"
+      "theme": {},
+      "close_icon": "close.png"
     },
     "story_page/*/story_impression_button": {
-      "impression_icon": "impressionIcon"
+      "theme": {},
+      "impression_icon": "impressionIcon.png"
     },
     "story_page/*/story_comment_button": {
-      "comment_icon": "comment"
+      "theme": {},
+      "comment_icon": "comment.png",
+      "background_color": ""
     },
     "story_page/*/story_reaction_button": {
-      "reaction_icon": "like",
-      "background_color": "#1243EE"
+      "theme": {},
+      "reaction_icon": "like.png",
+      "background_color": ""
     },
     "story_page/*/create_new_story_button": {
-      "create_new_story_icon": "plus",
-      "background_color": "#1243EE"
+      "theme": {},
+      "create_new_story_icon": "plus.png",
+      "background_color": "#ffffff"
     },
     "story_page/*/speaker_button": {
-      "mute_icon": "mute",
-      "unmute_icon": "unmute"
+      "theme": {},
+      "mute_icon": "mute.png",
+      "unmute_icon": "unmute.png",
+      "background_color": ""
     },
+
     "*/edit_comment_component/*": {
-      "component_theme": {
-        "light_theme": {
-          "primary_color": "#1054DE",
-          "secondary_color": "#292B32"
-        }
-      }
+      "theme": {}
     },
     "*/edit_comment_component/cancel_button": {
+      "theme": {},
       "cancel_icon": "",
-      "cancel_button_text": "Cancel",
-      "background_color": "#FFFFFF"
+      "cancel_button_text": "cancel",
+      "background_color": ""
     },
     "*/edit_comment_component/save_button": {
+      "theme": {},
       "save_icon": "",
       "save_button_text": "Save",
-      "background_color": "#1054DE"
+      "background_color": ""
     },
+
     "*/hyper_link_config_component/*": {
-      "component_theme": {
-        "light_theme": {
-          "primary_color": "",
-          "secondary_color": ""
-        }
-      }
+      "theme": {}
     },
     "*/hyper_link_config_component/done_button": {
+      "theme": {},
       "done_icon": "",
-      "done_button_text": "",
+      "done_button_text": "Done",
       "background_color": ""
     },
     "*/hyper_link_config_component/cancel_button": {
+      "theme": {},
       "cancel_icon": "",
-      "cancel_button_text": ""
+      "cancel_button_text": "Cancel"
+    },
+    "*/comment_tray_component/*": {
+      "theme": {}
+    },
+    "*/story_tab_component/*": {
+      "theme": {}
     },
-    "*/comment_tray_component/*": {},
-    "*/story_tab_component/*": {},
     "*/story_tab_component/story_ring": {
+      "theme": {},
       "progress_color": ["#339AF9", "#78FA58"],
-      "fail_color": ["#FA4D30"],
-      "background_color": ["#EBECEF"]
+      "background_color": ""
     },
     "*/story_tab_component/create_new_story_button": {
-      "create_new_story_icon": "plus",
-      "background_color": "#1243EE"
+      "theme": {},
+      "create_new_story_icon": "plus.png",
+      "background_color": ""
     },
     "*/*/close_button": {
-      "close_icon": "close"
+      "theme": {},
+      "close_icon": "close.png"
+    },
+    "live_chat/*/*": {},
+    "live_chat/chat_header/*": {},
+    "live_chat/message_list/*": {},
+    "live_chat/message_composer/*": {
+      "placeholder_text": "Write a message"
     }
   }
 }