From 3ebcf5e0c94dfc0b379b5ee2d9e7bc5238c6d8b5 Mon Sep 17 00:00:00 2001 From: amit-s19 Date: Fri, 12 Jan 2024 00:27:41 +0530 Subject: [PATCH] Weather Table added --- .../amakrushi/src/components/NavBar/index.tsx | 8 ++- .../src/components/chat-item/index.tsx | 34 +++++----- .../chat-message-item/index.module.css | 63 ++++++++++++++++++- .../components/chat-message-item/index.tsx | 46 ++++++++++++-- apps/amakrushi/src/utils/getMsgType.ts | 18 +++++- apps/amakrushi/src/utils/location.ts | 12 ++++ 6 files changed, 155 insertions(+), 26 deletions(-) create mode 100644 apps/amakrushi/src/utils/location.ts diff --git a/apps/amakrushi/src/components/NavBar/index.tsx b/apps/amakrushi/src/components/NavBar/index.tsx index bcc015ac..2a273540 100644 --- a/apps/amakrushi/src/components/NavBar/index.tsx +++ b/apps/amakrushi/src/components/NavBar/index.tsx @@ -14,6 +14,7 @@ import { useFlags } from 'flagsmith/react'; import { useLocalization } from '../../hooks'; import toast from 'react-hot-toast'; import { Sidemenu } from '../Sidemenu'; +import { recordUserLocation } from '../../utils/location'; function NavBar() { const flags = useFlags(['show_download_button', 'show_share_button']); @@ -40,10 +41,13 @@ function NavBar() { toast.error(`${t('error.wait_new_chat')}`); return; } + + recordUserLocation(); + const newConversationId = uuidv4(); sessionStorage.setItem('conversationId', newConversationId); - if(context?.audioElement) context?.audioElement.pause(); - if(context?.setAudioPlaying) context?.setAudioPlaying(false); + if (context?.audioElement) context?.audioElement.pause(); + if (context?.setAudioPlaying) context?.setAudioPlaying(false); context?.setConversationId(newConversationId); context?.setMessages([]); context?.setIsMsgReceiving(false); diff --git a/apps/amakrushi/src/components/chat-item/index.tsx b/apps/amakrushi/src/components/chat-item/index.tsx index 643987c1..4147ad71 100644 --- a/apps/amakrushi/src/components/chat-item/index.tsx +++ b/apps/amakrushi/src/components/chat-item/index.tsx @@ -15,6 +15,7 @@ import shareIcon from '../../assets/icons/shareHistory.svg'; import downloadIcon from '../../assets/icons/downloadHistory.svg'; import { useFlags } from 'flagsmith/react'; import { formatDate } from '../../utils/formatDate'; +import { recordUserLocation } from '../../utils/location'; const ChatItem: React.FC = ({ name, @@ -49,6 +50,7 @@ const ChatItem: React.FC = ({ .then((res) => { console.log('deleting conversation'); if (conversationId === sessionStorage.getItem('conversationId')) { + recordUserLocation(); const newConversationId = uuidv4(); sessionStorage.setItem('conversationId', newConversationId); context?.setConversationId(newConversationId); @@ -70,19 +72,19 @@ const ChatItem: React.FC = ({ <> {!isConversationDeleted && (
-
-
-
- messageIcon +
+
+
+ messageIcon +
+
{name}
+
+
+ {formatDate(date)}
-
{name}
-
-
- {formatDate(date)} -
-
- {/* {flags?.show_share_button?.enabled && ( +
+ {/* {flags?.show_share_button?.enabled && (
downloadShareHandler('share', conversationId)}> @@ -100,11 +102,11 @@ const ChatItem: React.FC = ({ />
)} */} -
- deleteIcon -
+
+ deleteIcon +
)} diff --git a/apps/amakrushi/src/components/chat-message-item/index.module.css b/apps/amakrushi/src/components/chat-message-item/index.module.css index c3bd3218..e2b66bfe 100644 --- a/apps/amakrushi/src/components/chat-message-item/index.module.css +++ b/apps/amakrushi/src/components/chat-message-item/index.module.css @@ -110,7 +110,7 @@ padding: 2px 8px; } -.msgSpeaker{ +.msgSpeaker { display: flex; align-items: center; justify-content: space-evenly; @@ -123,3 +123,64 @@ margin-left: auto; margin-right: 3rem; } + +.tableContainer { + position: relative; + display: flex; + flex-direction: row; + max-width: 90vw; + background: #fff; + padding: 0.5rem; + border-radius: 0.5rem; + box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; + +} + +.tableHeader { + display: flex; + flex-direction: column; + margin: 0.5rem; + gap: 0.5rem; + white-space: nowrap; + color: var(--secondarygreen); + font-weight: bold; +} + +.tableData { + display: flex; + flex-direction: row; + overflow-x: scroll; +} + +/* .tableData::-webkit-scrollbar { + display: none; +} */ + +/* width */ +.tableData::-webkit-scrollbar { + height: 7px; +} + +/* Track */ +.tableData::-webkit-scrollbar-track { + background: #f1f1f1; +} + +/* Handle */ +.tableData::-webkit-scrollbar-thumb { + background: var(--secondarygreen); +} + +.tableDataCol { + display: flex; + flex-direction: column; + align-items: center; + white-space: nowrap; + padding: 0rem 1rem; + margin: 0.5rem 0rem; + gap: 0.5rem; +} + +.tableDataCol:nth-child(odd) { + background: #F2F2F2; +} \ No newline at end of file diff --git a/apps/amakrushi/src/components/chat-message-item/index.tsx b/apps/amakrushi/src/components/chat-message-item/index.tsx index e3045ab3..d95d0321 100644 --- a/apps/amakrushi/src/components/chat-message-item/index.tsx +++ b/apps/amakrushi/src/components/chat-message-item/index.tsx @@ -39,6 +39,7 @@ import Image from 'next/image'; import { Button } from '@chakra-ui/react'; import flagsmith from 'flagsmith/isomorphic'; import Loader from '../loader'; +import { Paper, Table, TableBody, TableCell, TableContainer, TableHead, TableRow } from '@material-ui/core'; const getToastMessage = (t: any, reaction: number): string => { if (reaction === 1) return t('toast.reaction_like'); @@ -233,7 +234,7 @@ const ChatMessageItem: FC = ({ }}> {getFormatedTime( content?.data?.sentTimestamp || - content?.data?.repliedTimestamp + content?.data?.repliedTimestamp )}
@@ -335,7 +336,7 @@ const ChatMessageItem: FC = ({ {getFormatedTime( content?.data?.sentTimestamp || - content?.data?.repliedTimestamp + content?.data?.repliedTimestamp )}
@@ -369,7 +370,7 @@ const ChatMessageItem: FC = ({ {getFormatedTime( content?.data?.sentTimestamp || - content?.data?.repliedTimestamp + content?.data?.repliedTimestamp )}
@@ -407,7 +408,7 @@ const ChatMessageItem: FC = ({ {getFormatedTime( content?.data?.sentTimestamp || - content?.data?.repliedTimestamp + content?.data?.repliedTimestamp )} @@ -438,6 +439,43 @@ const ChatMessageItem: FC = ({ ); } + + case 'table': { + + return ( + <> +
+
+
Date
+
Temp Max
+
Temp Min
+
Temp
+
Humidity
+
Precip
+
Precip Prob
+
Windspeed
+
Cloudcover
+
Conditions
+
+
+ {JSON.parse(content?.text)?.map((el: any, idx: any) =>
+
{el.datetime}
+
{el.tempmax}
+
{el.tempmin}
+
{el.temp}
+
{el.humidity}
+
{el.precip}
+
{el.precipprob}
+
{el.windspeed}
+
{el.cloudcover}
+
{el.conditions}
+
)} +
+ +
+ + ) + } default: return ( { + if (isJsonString(msg?.text)) { + if (Array.isArray(JSON.parse(msg?.text))) return 'table'; + } if (msg?.payload?.buttonChoices?.length || msg?.choices?.length) return 'options'; if (msg?.imageUrl) return 'image'; if (msg?.videoUrl) return 'video'; @@ -22,7 +25,16 @@ export const getMsgType = (msg: any): string => { return 'text'; } } - if(msg?.payload?.type==="loading") - return 'loader' + if (msg?.payload?.type === "loading") + return 'loader' return 'text'; -}; \ No newline at end of file +}; + +function isJsonString(str: string) { + try { + JSON.parse(str); + } catch (e) { + return false; + } + return true; +} \ No newline at end of file diff --git a/apps/amakrushi/src/utils/location.ts b/apps/amakrushi/src/utils/location.ts new file mode 100644 index 00000000..53b9bc6d --- /dev/null +++ b/apps/amakrushi/src/utils/location.ts @@ -0,0 +1,12 @@ + +export function recordUserLocation() { + if (navigator.geolocation) { + navigator.geolocation.getCurrentPosition(saveUserLocation); + } +} + +function saveUserLocation(position: any) { + sessionStorage.setItem('userLat', position.coords.latitude); + sessionStorage.setItem('userLong', position.coords.longitude); +} +