V2 ws store (#310)

* Update TimerService.ts

* refactor: message service publishes to store

* refactor: several type improvements

* V2 ws store wss (#309)

* refactor: shared logging types

* refactor: simplify message service consumption

* refactor: create discrete logging system

* refactor: move socket.io > websocket

apps/client/src/features/info/CollapsableInfo.tsx

@@ -1,52 +1,21 @@
-import { useState } from 'react';
+import { PropsWithChildren, useState } from 'react';
 
 import CollapseBar from '../../common/components/collapse-bar/CollapseBar';
 
 import style from './Info.module.scss';
 
-type TitleShape = {
-  title: string;
-  presenter: string;
-  subtitle: string;
-  note: string;
-}
-
 interface CollapsableInfoProps {
   title: string;
-  data: TitleShape;
 }
 
-export default function CollapsableInfo(props: CollapsableInfoProps) {
-  const { title, data } = props;
+export default function CollapsableInfo(props: PropsWithChildren<CollapsableInfoProps>) {
+  const { title, children } = props;
   const [collapsed, setCollapsed] = useState(false);
 
   return (
     <div className={style.container}>
-      <CollapseBar
-        title={title}
-        isCollapsed={collapsed}
-        onClick={() => setCollapsed((prev) => !prev)}
-      />
-      {!collapsed && (
-        <div className={style.labels}>
-          <div>
-            <span className={style.label}>Title:</span>
-            <span className={style.content}>{data.title}</span>
-          </div>
-          <div>
-            <span className={style.label}>Presenter:</span>
-            <span className={style.content}>{data.presenter}</span>
-          </div>
-          <div>
-            <span className={style.label}>Subtitle:</span>
-            <span className={style.content}>{data.subtitle}</span>
-          </div>
-          <div>
-            <span className={style.label}>Note:</span>
-            <span className={style.content}>{data.note}</span>
-          </div>
-        </div>
-      )}
+      <CollapseBar title={title} isCollapsed={collapsed} onClick={() => setCollapsed((prev) => !prev)} />
+      {!collapsed && children}
     </div>
   );
 }