Update Sample App for version 4.3.5

cometchat · Apr 16, 2024 · 282a010 · 282a010
1 parent f85d6a7
commit 282a010
Show file tree

Hide file tree

Showing 15 changed files with 29 additions and 36 deletions.
diff --git a/Screenshots/.DS_Store b/Screenshots/.DS_Store
diff --git a/package.json b/package.json
@@ -1,14 +1,14 @@
 {
   "name": "cometchat-chat-sample-app-react",
-  "version": "4.3.4",
+  "version": "4.3.5",
   "private": true,
   "dependencies": {
-    "@cometchat/calls-sdk-javascript": "^4.0.6",
-    "@cometchat/chat-sdk-javascript": "^4.0.4",
-    "@cometchat/chat-uikit-react": "^4.3.4",
-    "@cometchat/uikit-elements": "^4.3.4",
-    "@cometchat/uikit-resources": "^4.3.3",
-    "@cometchat/uikit-shared": "^4.3.4",
+    "@cometchat/calls-sdk-javascript": "^4.0.7",
+    "@cometchat/chat-sdk-javascript": "^4.0.5",
+    "@cometchat/chat-uikit-react": "^4.3.5",
+    "@cometchat/uikit-elements": "^4.3.6",
+    "@cometchat/uikit-resources": "^4.3.6",
+    "@cometchat/uikit-shared": "^4.3.6",
     "@lit-labs/react": "^1.1.1",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^13.4.0",
@@ -20,13 +20,13 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-router-dom": "^6.11.2",
-    "react-scripts": "5.0.1",
+    "react-scripts": "^5.0.1",
     "react-switch": "^7.0.0",
     "typescript": "^4.9.5",
     "web-vitals": "^2.1.4"
   },
   "devDependencies": {
-    "@babel/plugin-proposal-private-property-in-object": "^7.21.11"
+    "@babel/plugin-transform-private-property-in-object": "^7.24.1"
   },
   "scripts": {
     "start": "react-scripts start",

diff --git a/src/.DS_Store b/src/.DS_Store
diff --git a/src/assets/.DS_Store b/src/assets/.DS_Store
diff --git a/src/components/.DS_Store b/src/components/.DS_Store
diff --git a/src/components/CardList/.DS_Store b/src/components/CardList/.DS_Store
diff --git a/src/components/CardList/Shared/.DS_Store b/src/components/CardList/Shared/.DS_Store
diff --git a/src/components/CardList/Shared/Bubbles/.DS_Store b/src/components/CardList/Shared/Bubbles/.DS_Store
diff --git a/src/components/CardList/Shared/Bubbles/Avatar/index.tsx b/src/components/CardList/Shared/Bubbles/Avatar/index.tsx
@@ -19,7 +19,7 @@ const Avatar = (props:any) => {
     const [avatarChoice, setAvatarChoice] = useState("image")
     const [avatarBorderRadius, setAvatarBorderRadius] = useState("28")
     const handleChange = (checked:boolean) => {
-     
+
       setAvatarChoice(checked ? "image" : "name")
     }
     const handleInputChange = (value:string) => {
@@ -44,7 +44,7 @@ const Avatar = (props:any) => {
       avatarStyle.backgroundColor = "#6929ca"
     }
     return (
-       
+
         <div
               style = {loadingComponentModalStyle(showModal)}
             >
@@ -68,7 +68,7 @@ const Avatar = (props:any) => {
                     Avatar type
                     </div>
                     <div className="switch__btn">
-                        <Switch onChange={handleChange}  width={100} offColor="#777777" onColor="#bbbbb" uncheckedIcon={<div style={{color:"white",position: "absolute", top: "4px", left: "-21px",}}>Name</div>} checked={avatarChoice === "image" ? true : false} checkedIcon={<div style={{color:"white",position: "absolute", top: "4px",
+                        <Switch onChange={handleChange}  width={100} offColor="#777777" onColor="#bbb" uncheckedIcon={<div style={{color:"white",position: "absolute", top: "4px", left: "-21px",}}>Name</div>} checked={avatarChoice === "image" ? true : false} checkedIcon={<div style={{color:"white",position: "absolute", top: "4px",
                         left: "17px",}}>Image</div>}  />
                     </div>
                 </div>

diff --git a/src/components/CardList/Shared/Bubbles/ListItem/index.tsx b/src/components/CardList/Shared/Bubbles/ListItem/index.tsx
@@ -24,7 +24,7 @@ const users = {
     superhero2:{
         uid: "superhero2",
         name: "Captain America",
-        avatar: "https://data-us.cometchat.io/assets/images/avatars/captainamerica.png", 
+        avatar: "https://data-us.cometchat.io/assets/images/avatars/captainamerica.png",
         status:"online",
         unreadCount: 30
     }
@@ -105,7 +105,7 @@ const ListItem = (props:any) => {
     const { theme } = useContext(CometChatThemeContext);
     const themeMode = theme.palette.mode
     return (
-       
+
           <div style = {loadingComponentModalStyle(showModal)}>
               <div
               style={componentDetailsModalStyle(themeMode)}
@@ -118,12 +118,13 @@ const ListItem = (props:any) => {
                 List Item displays data on a tile and that tile may contain leading, trailing, title and subtitle widgets.
                 </div>
                 <div className="details__container" style={{marginTop: "11px",marginBottom: "8px"}} >
-                   
+
                     <div>
                         {
                             cardDataList.map(cardData =>  {
-                                return (        
+                                return (
                                     <cometchat-list-item
+                                    key={cardData.id}
                                     avatarStyle={JSON.stringify(avatarStyle)}
                                     id = {cardData.id}
                                     avatarURL = {cardData.avatarURL}
@@ -132,21 +133,21 @@ const ListItem = (props:any) => {
                                     statusIndicatorColor={cardData.statusIndicatorColor}
                                     listItemStyle = {JSON.stringify(listItemStyle)}
                                     hideShowTail={true}
-                                ><div 
+                                ><div
                                 style={{color: themeMode === "dark"? "rgba(255, 255, 255, 0.58)" : "rgba(20, 20, 20, 0.58)"}}
                                 slot = "subtitleView"
                             >
                                {cardData.subtitleView}
                             </div>
-                                <div 
+                                <div
                                     slot = "tailView"
                                     style={{color: themeMode === "dark"? "rgba(255, 255, 255, 0.58)" : "rgba(20, 20, 20, 0.58)"}}
                                 >
                                 {cardData.tailView}
                                 </div>
-                            </cometchat-list-item>   
+                            </cometchat-list-item>
                                 )
-                                } 
+                                }
                             )}
                     </div>
                     </div>

diff --git a/src/components/CardList/Shared/Bubbles/Localize/index.tsx b/src/components/CardList/Shared/Bubbles/Localize/index.tsx
@@ -25,11 +25,11 @@ const Localize = (props:any) => {
     const navigate = useNavigate();
     const handleNavigateToConversations = () => {
         navigate("/home/chats-module/conversations-with-messages");
-    }  
+    }
     const { theme } = useContext(CometChatThemeContext);
     const themeMode = theme.palette.mode
     return (
-       
+
         <div
               style = {loadingComponentModalStyle(showModal)}
             >
@@ -48,7 +48,7 @@ const Localize = (props:any) => {
                     Language
                     </div>
                     <div className="switch__btn">
-                        <Switch onChange={handleChange}  width={100} offColor="#777777" onColor="#bbbbb" uncheckedIcon={<div style={{color:"white",position: "absolute", top: "4px", left: "-21px",}}>हिन्दी</div>} checked={languageChoice === "english" ? true : false} checkedIcon={<div style={{color:"white",position: "absolute", top: "4px",
+                        <Switch onChange={handleChange}  width={100} offColor="#777777" onColor="#bbb" uncheckedIcon={<div style={{color:"white",position: "absolute", top: "4px", left: "-21px",}}>हिन्दी</div>} checked={languageChoice === "english" ? true : false} checkedIcon={<div style={{color:"white",position: "absolute", top: "4px",
                         left: "17px",}}>English</div>}  />
                     </div>
                 </div>

diff --git a/src/components/CardList/Shared/Bubbles/Theme/index.tsx b/src/components/CardList/Shared/Bubbles/Theme/index.tsx
@@ -7,7 +7,7 @@ import Switch from "react-switch";
 import { useNavigate } from "react-router-dom";
 
 const Theme = (props:any) => {
-    
+
     const [themeChoice, setThemeChoice] = useState("default")
     const {
         activeComponent,
@@ -31,11 +31,11 @@ const Theme = (props:any) => {
         {
             navigate("/home/chats-module/conversations-with-messages", {state: {changeThemeToCustom: false}});
         }
-    }    
+    }
     const { theme } = useContext(CometChatThemeContext);
     const themeMode = theme.palette.mode
 return (
-       
+
         <div
               style = {loadingComponentModalStyle(showModal)}
             >

diff --git a/src/components/CardList/Shared/Bubbles/VideoBubble/.DS_Store b/src/components/CardList/Shared/Bubbles/VideoBubble/.DS_Store
diff --git a/src/components/CardList/Shared/Bubbles/assets/.DS_Store b/src/components/CardList/Shared/Bubbles/assets/.DS_Store
diff --git a/src/components/SharedCardList/index.tsx b/src/components/SharedCardList/index.tsx
@@ -36,18 +36,10 @@ export function SharedCardList() {
                     rowGap: "16px"
                 }}
             >
-                <div
-                    style = {{
-                        height: "30%"
-                    }}
-                >
+                <div>
                     <ResourcesCardList />
                 </div>
-                <div
-                    style = {{
-                        height: "70%"
-                    }}
-                >
+                <div>
                     <ViewsCardList />
                 </div>
             </div>