feat: RichText Editor Component

frontend/dashboard/package.json

@@ -11,6 +11,8 @@
     "test": "echo \"Woah there, we have no frontend tests as of right now. Let's just say we're passing.\" && exit 0"
   },
   "dependencies": {
+    "@blocknote/core": "^0.12.4",
+    "@blocknote/react": "^0.12.4",
     "@reduxjs/toolkit": "^2.2.3",
     "next": "14.2.3",
     "react": "^18",

frontend/dashboard/src/app/globals.css

@@ -2,12 +2,6 @@
 @tailwind components;
 @tailwind utilities;
 
-:root {
-  --foreground-rgb: 0, 0, 0;
-  --background-start-rgb: 214, 219, 220;
-  --background-end-rgb: 255, 255, 255;
-}
-
 @media (prefers-color-scheme: dark) {
   :root {
     --foreground-rgb: 255, 255, 255;
@@ -17,13 +11,7 @@
 }
 
 body {
-  color: rgb(var(--foreground-rgb));
-  background: linear-gradient(
-      to bottom,
-      transparent,
-      rgb(var(--background-end-rgb))
-    )
-    rgb(var(--background-start-rgb));
+  margin: 0,
 }
 
 @layer utilities {

frontend/dashboard/src/store/StoreProvider.tsx

@@ -1,22 +1,26 @@
-"use client";
+'use client'
 
 import { useRef } from "react";
 import { AppStore, makeStore } from "./store";
 import { Provider } from "react-redux";
 
 type StoreProviderProps = {
   children: React.ReactNode;
-};
+}
 
 /**
  * The Redux store provider component. This makes the store accessible globally across the repository
  */
 export default function StoreProvider({ children }: StoreProviderProps) {
   const storeRef = useRef<AppStore>();
 
-  // Instantiate store singleton:
-  if (!storeRef.current) {
-    storeRef.current = makeStore();
-  }
-  return <Provider store={storeRef.current}>{children}</Provider>;
+    // Instantiate store singleton:
+    if (!storeRef.current) {
+        storeRef.current = makeStore()
+      }
+    return (
+        <Provider store={storeRef.current}>
+            {children}
+        </Provider>
+    )
 }

frontend/dashboard/src/store/store.ts

@@ -1,6 +1,6 @@
-import { configureStore } from "@reduxjs/toolkit";
-import { useDispatch, useSelector, useStore } from "react-redux";
-import { baseApi } from "@sac/lib";
+import { configureStore } from '@reduxjs/toolkit'
+import { useDispatch, useSelector, useStore } from 'react-redux';
+import { baseApi } from '@sac/lib';
 
 export const makeStore = () => {
   return configureStore({
@@ -9,16 +9,17 @@ export const makeStore = () => {
     },
 
     middleware: (getDefaultMiddleware) =>
-      getDefaultMiddleware().concat(baseApi.middleware),
-  });
+      getDefaultMiddleware()
+      .concat(baseApi.middleware)
+  })
 };
 
 // Redux types:
-export type AppStore = ReturnType<typeof makeStore>;
-export type RootState = ReturnType<AppStore["getState"]>;
-export type AppDispatch = AppStore["dispatch"];
+export type AppStore = ReturnType<typeof makeStore>
+export type RootState = ReturnType<AppStore['getState']>
+export type AppDispatch = AppStore['dispatch']
 
 // Typed Redux interactive methods:
-export const useAppDispatch = useDispatch.withTypes<AppDispatch>();
-export const useAppSelector = useSelector.withTypes<RootState>();
-export const useAppStore = useStore.withTypes<AppStore>();
+export const useAppDispatch = useDispatch.withTypes<AppDispatch>()
+export const useAppSelector = useSelector.withTypes<RootState>()
+export const useAppStore = useStore.withTypes<AppStore>()