Timestamp and uuid for chat messages

backend/jitsi-rooms.cabal

@@ -62,6 +62,7 @@ library
     , lifted-base
     , mtl
     , text
+    , time
     , uuid
     , wai
     , warp
@@ -87,6 +88,7 @@ executable jitsi-rooms-exe
     , lifted-base
     , mtl
     , text
+    , time
     , uuid
     , wai
     , warp

backend/package.yaml

@@ -32,6 +32,7 @@ dependencies:
   - uuid
   - lifted-base
   - mtl
+  - time
 
 ghc-options:
   - -Wall

backend/src/Types/WebSocketMessages/WebSocketMessages.hs

@@ -19,6 +19,8 @@ import Data.Aeson
     defaultOptions,
     genericParseJSON,
   )
+import Data.Time.Clock.POSIX (POSIXTime)
+import Data.UUID (UUID)
 import Types.User (User)
 
 data WebSocketMessage = ClientInfoMessage SetClientInfo | JoinRoomMessage JoinRoom | AllChatMessageIncomingMessage AllChatMessageIncoming
@@ -50,7 +52,9 @@ instance FromJSON AllChatMessageIncoming
 
 data AllChatMessageOutgoing = AllChatMessageOutgoing
   { content :: Text,
-    sender :: User
+    sender :: User,
+    uuid :: UUID,
+    timestamp :: POSIXTime
   }
   deriving (Generic, Show)
 

backend/src/WebSocket/AllChat.hs

@@ -1,18 +1,33 @@
+{-# LANGUAGE FlexibleInstances #-}
 {-# LANGUAGE LambdaCase #-}
 
-module WebSocket.AllChat (broadCastAllChatMessage) where
+module WebSocket.AllChat (broadCastAllChatMessage, MonadAllChat) where
 
 import BroadcastUserData (MonadBroadcast (..))
 import ClassyPrelude
 import Data.Aeson (encode)
+import Data.Time.Clock.POSIX
+import Data.UUID (UUID)
+import Data.UUID.V4 (nextRandom)
 import Types.User (clientToUser)
 import Types.WebSocketMessages.WebSocketMessages (AllChatMessageIncoming (..), AllChatMessageOutgoing (AllChatMessageOutgoing))
 import WebSocket.MonadWebSocketSession (MonadWebSocketSession (getClient))
+import WebSocket.WSReaderTApp
 
-broadCastAllChatMessage :: (MonadBroadcast m, MonadWebSocketSession m) => AllChatMessageIncoming -> m ()
+class (Monad m) => MonadAllChat m where
+  getMessageId :: m UUID
+  getTimestamp :: m POSIXTime
+
+instance MonadAllChat (WSApp WSEnv) where
+  getMessageId = liftIO nextRandom
+  getTimestamp = liftIO getPOSIXTime
+
+broadCastAllChatMessage :: (MonadBroadcast m, MonadWebSocketSession m, MonadAllChat m) => AllChatMessageIncoming -> m ()
 broadCastAllChatMessage AllChatMessageIncoming {content = message} = do
   getClient >>= \case
     Nothing -> return ()
     Just client -> do
-      let broadCastValue = AllChatMessageOutgoing message (clientToUser client)
+      uuid <- getMessageId
+      timestamp <- getTimestamp
+      let broadCastValue = AllChatMessageOutgoing message (clientToUser client) uuid timestamp
       broadCastToClients $ (decodeUtf8 . toStrict . encode) broadCastValue

backend/src/WebSocket/WSApp.hs

@@ -13,7 +13,7 @@ import Types.WebSocketMessages.WebSocketMessages
   ( SetClientInfo (displayName),
     WebSocketMessage (..),
   )
-import WebSocket.AllChat (broadCastAllChatMessage)
+import WebSocket.AllChat (MonadAllChat, broadCastAllChatMessage)
 import WebSocket.MonadWebSocketSession
 import WebSocket.WSReaderTApp
 
@@ -22,7 +22,8 @@ wsApp ::
     MonadWebSocketSessionInit m,
     MonadConnectedClientsModify m,
     MonadRoomDataStateRead m,
-    MonadBroadcast m
+    MonadBroadcast m,
+    MonadAllChat m
   ) =>
   m ()
 wsApp = do
@@ -37,7 +38,8 @@ wsApp = do
 handleWSAction ::
   ( MonadWebSocketSession m,
     MonadConnectedClientsModify m,
-    MonadBroadcast m
+    MonadBroadcast m,
+    MonadAllChat m
   ) =>
   m ()
 handleWSAction = do

frontend/README.md

@@ -4,6 +4,13 @@ Using vite and react plus the jitsi react sdk for the frontend.
 
 ## Development
 
-Use yarn
+Use yarn:
 
-There is no backend connection for now, so just start the frontend with `yarn run dev` and go to http://localhost:5173
+
+```sh
+yarn run dev
+```
+
+Edit the file `constants.ts` to define which backend is used during development.
+Set `USE_REMOTE_BACKEND` to true to use the backend hosted on the filefighter server.
+This way you don't need to run the backend locally.

frontend/package.json

@@ -9,6 +9,9 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@fortawesome/fontawesome-svg-core": "^6.4.0",
+    "@fortawesome/free-regular-svg-icons": "^6.4.0",
+    "@fortawesome/react-fontawesome": "^0.2.0",
     "@jitsi/react-sdk": "^1.3.0",
     "jotai": "^2.0.3",
     "just-curry-it": "^5.3.0",

frontend/src/background/constants.ts

@@ -1,11 +1,12 @@
 const ISPROD = window.location.protocol == "https:";
 const JITSI_DOMAIN = "thisisnotajitsi.filefighter.de";
-const WEBSOCKET_URL =
+const USE_REMOTE_BACKEND = true;
-  "ws" +
+const getWebsocketUrl = () => {
-  (ISPROD ? "s" : "") +
+  if (ISPROD) return "wss://" + window.location.host + "/ws"
-  "://" +
+  if (USE_REMOTE_BACKEND) return "wss://" + "discord.filefighter.de/ws"
-  (ISPROD ? window.location.host : "localhost:9160") +
+  return "ws://" + "localhost:9160/ws"
-  "/ws";
+}
+const WEBSOCKET_URL = getWebsocketUrl();
 
 const USER_COOKIE_NAME = "jitsi-rooms-user";
 

frontend/src/background/style/colorednames.ts

@@ -0,0 +1,29 @@
+function getHslColor(i: number) {
+  return "hsl(" + i % 360 + ',' +
+    '70%,' +
+    '72%)'
+}
+function hashCode(str: string) { // java String#hashCode
+  var hash = 0;
+  for (var i = 0; i < str.length; i++) {
+    hash = str.charCodeAt(i) + ((hash << 5) - hash);
+  }
+  return hash;
+}
+
+// function intToRGB(i: number) {
+//   var c = (i & 0x00FFFFFF)
+//     .toString(16)
+//     .toUpperCase();
+//
+//   return "00000".substring(0, 6 - c.length) + c;
+// }
+
+function getColorForUserName(userName: string) {
+  const hash = hashCode(userName)
+  return getHslColor(hash)
+
+
+}
+
+export { getColorForUserName } 

frontend/src/background/types/roomData.ts

@@ -13,7 +13,6 @@ export interface Participant {
 export interface User {
   uuid: string,
   name: string
-
 }
 
 export interface UsersData {

frontend/src/components/chat/Chat.css

@@ -1,12 +1,38 @@
 .chat-input{
-max-width: 50%;
+ min-width: 0;
+}
+
+.chat{
+ background-color: #181c25;
+ border-radius: 8px;
+ padding: 0.5em 0;
+ width: 100%;
+ margin: 0 -3px;
+}
+
+.chat-sender{
+ font-size: 0.9em;
+ /* color: #213547; */
+}
+
+.chat-input-form{
+ display: flex;
 }
 
 
+.chat-messages{
+ max-height: 220px;
+ overflow-y: scroll;
+  display: flex;
+  flex-direction: column-reverse;
+}
 .chat-bubble{
- background-color: #3d3d5c;
+ background-color: #2b2a33;
  overflow-wrap: break-word;
  margin-bottom: 7px;
+ border-radius: 8px;
+ padding: 3px 4px ;
+
  
  white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */
  white-space: -pre-wrap;      /* Opera 4-6 */

frontend/src/components/chat/Chat.tsx

@@ -2,17 +2,15 @@ import { useState } from "react";
 import { FormEventHandler } from "react";
 import useAllChat from "../../hooks/useAllChat";
 import "./Chat.css"
-
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+import { faPaperPlane } from "@fortawesome/free-regular-svg-icons";
+import { getColorForUserName } from "../../background/style/colorednames";
 interface Props {
   sendMessage: Function
 }
 
-
-
 function Chat({ sendMessage }: Props) {
-
   const [chatInput, setChatInput] = useState("")
-
   const { chatMesages } = useAllChat()
 
   const onInput: React.ChangeEventHandler<HTMLInputElement> = (event) => {
@@ -27,13 +25,22 @@ function Chat({ sendMessage }: Props) {
   }
 
   return (
-    <div className="">
+    <div className="chat">
-      {chatMesages.map(message => (
+      <div className="chat-messages">
-        <div className="chat-bubble"> <span>{message.sender.name}: </span> {message.content} </div>
+        {chatMesages
-      ))
+          .slice()
-
+          .reverse() // reverse because of css, don't aks me
-      }
+          .map(message => {
-      <form onSubmit={onSubmit}>
+            const nameStyle = {
+              color: getColorForUserName(message.sender.name)
+            }
+            return (
+              <div className="chat-bubble" key={message.uuid}> <span className="chat-sender" style={nameStyle}>{message.sender.name} <br /> </span> {message.content} </div>
+            );
+          })
+        }
+      </div>
+      <form className="chat-input-form" onSubmit={onSubmit}>
         <input
           className="chat-input"
           placeholder="Say something funny :D"
@@ -41,13 +48,10 @@ function Chat({ sendMessage }: Props) {
           value={chatInput}
           onChange={onInput}
         />
-        <button type="submit">Send</button>
+        <button type="submit"><FontAwesomeIcon icon={faPaperPlane} /></button>
       </form>
     </div>
   );
-
-
 }
 
-
 export default Chat

frontend/src/components/sidebar/Sidebar.css

@@ -4,6 +4,9 @@
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
+  padding-left: 5px;
+  padding-right: 5px;
+  background-color: #121115;
 }
 
 .sidebar h3 {
@@ -22,11 +25,12 @@
 }
 
 .sidebar-full {
-  max-width: 220px;
+  width: 220px;
 }
 
 .sidebar-hidden {
   width: 0;
+  padding: 0;
 }
 
 .sidebar-hidden > .sidebar-footer > .sidebar-toggle {

frontend/src/components/sidebar/Sidebar.tsx

@@ -20,7 +20,7 @@ function Sidebar(props: Props) {
   return (
     <div className={`sidebar sidebar-${sidebarVisibility}`}>
       <SidebarHeader sidebarVisibility={sidebarVisibility} />
-      <div>
+      <div className="sidebar-body">
         {props.usersData.roomsData.map((roomData) => {
           return (
             <>
@@ -46,7 +46,7 @@ function Sidebar(props: Props) {
         ))}
       </div>
       <div className="sidebar-footer">
-        <Chat sendMessage={props.sendMessage} />
+        {sidebarVisibility === "full" && <Chat sendMessage={props.sendMessage} />}
         <button className="sidebar-toggle" onClick={toggleSidebarVisibility}>{sidebarToggleText}</button>
       </div>
     </div>

frontend/src/components/sidebar/SidebarHeader.tsx

@@ -6,9 +6,9 @@ interface props {
 
 function SidebarHeader({ sidebarVisibility }: props) {
   if (sidebarVisibility == "full") {
-    return <h1>hi there</h1>;
+    return <h2>hi there</h2>;
   } else if (sidebarVisibility == "small") {
-    return <h1>hi</h1>;
+    return <h2>hi</h2>;
   }
   return <></>;
 }

frontend/src/hooks/useAllChat.tsx

@@ -5,23 +5,17 @@ import { User } from "../background/types/roomData";
 interface ChatMessage {
   content: string
   sender: User
-
+  uuid: string
+  timestamp: number
 }
 
 export const allChatMessagesAtom = atomWithReducer([], (list: ChatMessage[], item: ChatMessage) => list.concat(item))
 
-
 const useAllChat = () => {
   const [chatMessages, addChatMessage] = useAtom(allChatMessagesAtom)
-
-
   return { chatMesages: chatMessages, addChatMessage }
-
-
-
 }
 
-
 export default useAllChat
 
 

frontend/src/hooks/useLocalUser.ts

@@ -21,7 +21,7 @@ function getUserInfoFromCookie(): UserInfo {
   console.log("[Rooms] getUserNameFromCookie", cookie);
   if (cookie) return JSON.parse(cookie);
   return {
-    displayName: "unknown traveller",
+    displayName: "Unknown traveller",
     email: "",
   };
 }

frontend/src/index.css

@@ -6,7 +6,7 @@
 
   color-scheme: light dark;
   color: rgba(255, 255, 255, 0.87);
-  background-color: #242424;
+  background-color: #181c25;
 
   font-synthesis: none;
   text-rendering: optimizeLegibility;
@@ -77,3 +77,20 @@ button:focus-visible {
   height: 100%;
   width: 100%;
 }
+
+
+input {
+  font-size: 1em;
+  margin: 0.3em;
+  border: 0;
+  height: 2.3em;
+  padding-left: 0.4em;
+  box-shadow: none;
+  box-sizing: border-box;
+  font-size: 17px;
+  font-family: "Oxygen", sans-serif;
+  transition: top 0.1s ease-in-out;
+  background-color: #2b2a33;
+  border-color: #646cff;
+  border-radius: 8px;
+}

frontend/yarn.lock

@@ -10,6 +10,13 @@
     "@jridgewell/gen-mapping" "^0.1.0"
     "@jridgewell/trace-mapping" "^0.3.9"
 
+"@babel/code-frame@^7.0.0":
+  version "7.21.4"
+  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.21.4.tgz#d0fa9e4413aca81f2b23b9442797bda1826edb39"
+  integrity sha512-LYvhNKfwWSPpocw8GI7gpK2nq3HSDuEPC/uSYaALSJu9xjsalaaYFOq0Pwt5KmVqwEbZlDu81aLXwBOmD/Fv9g==
+  dependencies:
+    "@babel/highlight" "^7.18.6"
+
 "@babel/code-frame@^7.18.6":
   version "7.18.6"
   resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.18.6.tgz#3b25d38c89600baa2dcc219edfa88a74eb2c427a"
@@ -175,6 +182,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.19.0"
 
+"@babel/runtime@^7.12.5":
+  version "7.21.0"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.21.0.tgz#5b55c9d394e5fcf304909a8b00c07dc217b56673"
+  integrity sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==
+  dependencies:
+    regenerator-runtime "^0.13.11"
+
 "@babel/template@^7.18.10", "@babel/template@^7.20.7":
   version "7.20.7"
   resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.20.7.tgz#a15090c2839a83b02aa996c0b4994005841fd5a8"
@@ -319,6 +333,32 @@
   resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.16.15.tgz#e28277cdbc1c9cde2b982c814d05f44d4b1f0580"
   integrity sha512-27h5GCcbfomVAqAnMJWvR1LqEY0dFqIq4vTe5nY3becnZNu0SX8F0+gTk3JPvgWQHzaGc6VkPzlOiMkdSUunUA==
 
+"@fortawesome/fontawesome-common-types@6.4.0":
+  version "6.4.0"
+  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.4.0.tgz#88da2b70d6ca18aaa6ed3687832e11f39e80624b"
+  integrity sha512-HNii132xfomg5QVZw0HwXXpN22s7VBHQBv9CeOu9tfJnhsWQNd2lmTNi8CSrnw5B+5YOmzu1UoPAyxaXsJ6RgQ==
+
+"@fortawesome/fontawesome-svg-core@^6.4.0":
+  version "6.4.0"
+  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.4.0.tgz#3727552eff9179506e9203d72feb5b1063c11a21"
+  integrity sha512-Bertv8xOiVELz5raB2FlXDPKt+m94MQ3JgDfsVbrqNpLU9+UE2E18GKjLKw+d3XbeYPqg1pzyQKGsrzbw+pPaw==
+  dependencies:
+    "@fortawesome/fontawesome-common-types" "6.4.0"
+
+"@fortawesome/free-regular-svg-icons@^6.4.0":
+  version "6.4.0"
+  resolved "https://registry.yarnpkg.com/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.4.0.tgz#cacc53bd8d832d46feead412d9ea9ce80a55e13a"
+  integrity sha512-ZfycI7D0KWPZtf7wtMFnQxs8qjBXArRzczABuMQqecA/nXohquJ5J/RCR77PmY5qGWkxAZDxpnUFVXKwtY/jPw==
+  dependencies:
+    "@fortawesome/fontawesome-common-types" "6.4.0"
+
+"@fortawesome/react-fontawesome@^0.2.0":
+  version "0.2.0"
+  resolved "https://registry.yarnpkg.com/@fortawesome/react-fontawesome/-/react-fontawesome-0.2.0.tgz#d90dd8a9211830b4e3c08e94b63a0ba7291ddcf4"
+  integrity sha512-uHg75Rb/XORTtVt7OS9WoK8uM276Ufi7gCzshVWkUJbHhh3svsUUeqXerrM96Wm7fRiDzfKRwSoahhMIkGAYHw==
+  dependencies:
+    prop-types "^15.8.1"
+
 "@jitsi/react-sdk@^1.3.0":
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/@jitsi/react-sdk/-/react-sdk-1.3.0.tgz#9013921896c2830806ffdd449d7487e05d9c99ad"
@@ -364,6 +404,11 @@
     "@jridgewell/resolve-uri" "3.1.0"
     "@jridgewell/sourcemap-codec" "1.4.14"
 
+"@types/parse-json@^4.0.0":
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/@types/parse-json/-/parse-json-4.0.0.tgz#2f8bb441434d163b35fb8ffdccd7138927ffb8c0"
+  integrity sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA==
+
 "@types/prop-types@*":
   version "15.7.5"
   resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.5.tgz#5f19d2b85a98e9558036f6a3cacc8819420f05cf"
@@ -408,6 +453,15 @@ ansi-styles@^3.2.1:
   dependencies:
     color-convert "^1.9.0"
 
+babel-plugin-macros@^3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-macros/-/babel-plugin-macros-3.1.0.tgz#9ef6dc74deb934b4db344dc973ee851d148c50c1"
+  integrity sha512-Cg7TFGpIr01vOQNODXOOaGz2NpCU5gl8x1qJFbb6hbZxR7XrcE2vtbAsTAbJ7/xwJtUuJEw8K8Zr/AE0LHlesg==
+  dependencies:
+    "@babel/runtime" "^7.12.5"
+    cosmiconfig "^7.0.0"
+    resolve "^1.19.0"
+
 browserslist@^4.21.3:
   version "4.21.4"
   resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.21.4.tgz#e7496bbc67b9e39dd0f98565feccdcb0d4ff6987"
@@ -418,6 +472,11 @@ browserslist@^4.21.3:
     node-releases "^2.0.6"
     update-browserslist-db "^1.0.9"
 
+callsites@^3.0.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/callsites/-/callsites-3.1.0.tgz#b3630abd8943432f54b3f0519238e33cd7df2f73"
+  integrity sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==
+
 caniuse-lite@^1.0.30001400:
   version "1.0.30001442"
   resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001442.tgz#40337f1cf3be7c637b061e2f78582dc1daec0614"
@@ -449,6 +508,17 @@ convert-source-map@^1.7.0:
   resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.9.0.tgz#7faae62353fb4213366d0ca98358d22e8368b05f"
   integrity sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==
 
+cosmiconfig@^7.0.0:
+  version "7.1.0"
+  resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-7.1.0.tgz#1443b9afa596b670082ea46cbd8f6a62b84635f6"
+  integrity sha512-AdmX6xUzdNASswsFtmwSt7Vj8po9IuqXm0UXz7QKPuEUmPB4XyjGfaAr2PSuELMwkRMVH1EpIkX5bTZGRB3eCA==
+  dependencies:
+    "@types/parse-json" "^4.0.0"
+    import-fresh "^3.2.1"
+    parse-json "^5.0.0"
+    path-type "^4.0.0"
+    yaml "^1.10.0"
+
 csstype@^3.0.2:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.1.tgz#841b532c45c758ee546a11d5bd7b7b473c8c30b9"
@@ -466,6 +536,13 @@ electron-to-chromium@^1.4.251:
   resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.284.tgz#61046d1e4cab3a25238f6bf7413795270f125592"
   integrity sha512-M8WEXFuKXMYMVr45fo8mq0wUrrJHheiKZf6BArTKk9ZBYCKJEOU5H8cdWgDT+qCVZf7Na4lVUaZsA+h6uA9+PA==
 
+error-ex@^1.3.1:
+  version "1.3.2"
+  resolved "https://registry.yarnpkg.com/error-ex/-/error-ex-1.3.2.tgz#b4ac40648107fdcdcfae242f428bea8a14d4f1bf"
+  integrity sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==
+  dependencies:
+    is-arrayish "^0.2.1"
+
 esbuild@^0.16.3:
   version "0.16.15"
   resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.16.15.tgz#02663f41eac47433879f09894dbe97c2dc837ecf"
@@ -536,7 +613,20 @@ has@^1.0.3:
   dependencies:
     function-bind "^1.1.1"
 
-is-core-module@^2.9.0:
+import-fresh@^3.2.1:
+  version "3.3.0"
+  resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-3.3.0.tgz#37162c25fcb9ebaa2e6e53d5b4d88ce17d9e0c2b"
+  integrity sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==
+  dependencies:
+    parent-module "^1.0.0"
+    resolve-from "^4.0.0"
+
+is-arrayish@^0.2.1:
+  version "0.2.1"
+  resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.2.1.tgz#77c99840527aa8ecb1a8ba697b80645a7a926a9d"
+  integrity sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==
+
+is-core-module@^2.11.0, is-core-module@^2.9.0:
   version "2.11.0"
   resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.11.0.tgz#ad4cb3e3863e814523c96f3f58d26cc570ff0144"
   integrity sha512-RRjxlvLDkD1YJwDbroBHMb+cukurkDWNyHx7D3oNB5x9rb5ogcksMC5wHCadcXoo67gVr/+3GFySh3134zi6rw==
@@ -558,6 +648,11 @@ jsesc@^2.5.1:
   resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-2.5.2.tgz#80564d2e483dacf6e8ef209650a67df3f0c283a4"
   integrity sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==
 
+json-parse-even-better-errors@^2.3.0:
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz#7c47805a94319928e05777405dc12e1f7a4ee02d"
+  integrity sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==
+
 json5@^2.2.2:
   version "2.2.3"
   resolved "https://registry.yarnpkg.com/json5/-/json5-2.2.3.tgz#78cd6f1a19bdc12b73db5ad0c61efd66c1e29283"
@@ -568,7 +663,12 @@ just-curry-it@^5.3.0:
   resolved "https://registry.yarnpkg.com/just-curry-it/-/just-curry-it-5.3.0.tgz#1463602e932c5beb431a2a384dddcd48bb3c9c42"
   integrity sha512-silMIRiFjUWlfaDhkgSzpuAyQ6EX/o09Eu8ZBfmFwQMbax7+LQzeIU2CBrICT6Ne4l86ITCGvUCBpCubWYy0Yw==
 
-loose-envify@^1.1.0:
+lines-and-columns@^1.1.6:
+  version "1.2.4"
+  resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632"
+  integrity sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==
+
+loose-envify@^1.1.0, loose-envify@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
   integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==
@@ -604,11 +704,38 @@ node-releases@^2.0.6:
   resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.8.tgz#0f349cdc8fcfa39a92ac0be9bc48b7706292b9ae"
   integrity sha512-dFSmB8fFHEH/s81Xi+Y/15DQY6VHW81nXRj86EMSL3lmuTmK1e+aT4wrFCkTbm+gSwkw4KpX+rT/pMM2c1mF+A==
 
+object-assign@^4.1.1:
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"
+  integrity sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==
+
+parent-module@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/parent-module/-/parent-module-1.0.1.tgz#691d2709e78c79fae3a156622452d00762caaaa2"
+  integrity sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==
+  dependencies:
+    callsites "^3.0.0"
+
+parse-json@^5.0.0:
+  version "5.2.0"
+  resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-5.2.0.tgz#c76fc66dee54231c962b22bcc8a72cf2f99753cd"
+  integrity sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==
+  dependencies:
+    "@babel/code-frame" "^7.0.0"
+    error-ex "^1.3.1"
+    json-parse-even-better-errors "^2.3.0"
+    lines-and-columns "^1.1.6"
+
 path-parse@^1.0.7:
   version "1.0.7"
   resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.7.tgz#fbc114b60ca42b30d9daf5858e4bd68bbedb6735"
   integrity sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==
 
+path-type@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/path-type/-/path-type-4.0.0.tgz#84ed01c0a7ba380afe09d90a8c180dcd9d03043b"
+  integrity sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==
+
 picocolors@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.0.0.tgz#cb5bdc74ff3f51892236eaf79d68bc44564ab81c"
@@ -623,6 +750,15 @@ postcss@^8.4.20:
     picocolors "^1.0.0"
     source-map-js "^1.0.2"
 
+prop-types@^15.8.1:
+  version "15.8.1"
+  resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.8.1.tgz#67d87bf1a694f48435cf332c24af10214a3140b5"
+  integrity sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==
+  dependencies:
+    loose-envify "^1.4.0"
+    object-assign "^4.1.1"
+    react-is "^16.13.1"
+
 react-dom@^18.2.0:
   version "18.2.0"
   resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-18.2.0.tgz#22aaf38708db2674ed9ada224ca4aa708d821e3d"
@@ -631,6 +767,11 @@ react-dom@^18.2.0:
     loose-envify "^1.1.0"
     scheduler "^0.23.0"
 
+react-is@^16.13.1:
+  version "16.13.1"
+  resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
+  integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
+
 react-refresh@^0.14.0:
   version "0.14.0"
   resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.14.0.tgz#4e02825378a5f227079554d4284889354e5f553e"
@@ -643,6 +784,25 @@ react@^18.2.0:
   dependencies:
     loose-envify "^1.1.0"
 
+regenerator-runtime@^0.13.11:
+  version "0.13.11"
+  resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz#f6dca3e7ceec20590d07ada785636a90cdca17f9"
+  integrity sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==
+
+resolve-from@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-4.0.0.tgz#4abcd852ad32dd7baabfe9b40e00a36db5f392e6"
+  integrity sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==
+
+resolve@^1.19.0:
+  version "1.22.2"
+  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.2.tgz#0ed0943d4e301867955766c9f3e1ae6d01c6845f"
+  integrity sha512-Sb+mjNHOULsBv818T40qSPeRiuWLyaGMa5ewydRLFimneixmVy2zdivRl+AF6jaYPC8ERxGDmFSiqui6SfPd+g==
+  dependencies:
+    is-core-module "^2.11.0"
+    path-parse "^1.0.7"
+    supports-preserve-symlinks-flag "^1.0.0"
+
 resolve@^1.22.1:
   version "1.22.1"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.1.tgz#27cb2ebb53f91abb49470a928bba7558066ac177"
@@ -722,3 +882,8 @@ yallist@^3.0.2:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/yallist/-/yallist-3.1.1.tgz#dbb7daf9bfd8bac9ab45ebf602b8cbad0d5d08fd"
   integrity sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==
+
+yaml@^1.10.0:
+  version "1.10.2"
+  resolved "https://registry.yarnpkg.com/yaml/-/yaml-1.10.2.tgz#2301c5ffbf12b467de8da2333a459e29e7920e4b"
+  integrity sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==