starting more for flow state quote

packages/desktop/package.json

@@ -45,7 +45,7 @@
             "port": "4001",
             "loggerPort": "9002",
             "mainConfig": "./webpack.main.config.js",
-            "devContentSecurityPolicy": "connect-src 'self' https://zenquotes.io/api http://localhost:5000 ws://localhost:5000 'unsafe-eval'",
+            "devContentSecurityPolicy": "connect-src 'self' http://localhost:5000 ws://localhost:5000 'unsafe-eval'",
             "renderer": {
               "config": "./webpack.renderer.config.js",
               "entryPoints": [

packages/desktop/src/components/lines/lineRow.tsx/index.tsx

@@ -103,13 +103,13 @@ export default function LineRow({
     if (masterLineData.currentUserMember.lastVisitDate)
       return (
         <span className={`text-gray-400 ml-auto text-xs font-semibold`}>
-          {moment(masterLineData.currentUserMember.lastVisitDate).fromNow()}
+          {moment(masterLineData.currentUserMember.lastVisitDate).fromNow(true)}
         </span>
       );
 
     return (
       <span className={`text-gray-300 ml-auto text-xs `}>
-        {moment(masterLineData.currentUserMember.lastVisitDate).fromNow()}
+        {moment(masterLineData.currentUserMember.lastVisitDate).fromNow(true)}
       </span>
     );
   }, [masterLineData]);

packages/desktop/src/controller/recoil.tsx

@@ -40,7 +40,7 @@ type DesktopMode = "flowState" | "overlayOnly" | "terminal";
 
 export const $desktopMode = atom<DesktopMode>({
   key: "DESKTOP_MODE",
-  default: "terminal",
+  default: "flowState",
 });
 
 export const $selectedLineId = atom<string>({

packages/desktop/src/pages/router/index.tsx

@@ -8,7 +8,7 @@ import Channels, {
   DEFAULT_APP_PRESET,
   Dimensions,
 } from "../../electron/constants";
-import { useCallback, useEffect } from "react";
+import { useCallback, useEffect, useState } from "react";
 import { useRecoilState, useRecoilValue } from "recoil";
 
 import { LineDataProvider } from "../../controller/lineDataProvider";
@@ -96,16 +96,36 @@ export default function NirvanaRouter() {
   );
 }
 
+type Quote = { q: string; a: string; h?: string };
 function FlowState() {
+  const [quote, setQuote] = useState<Quote>(null);
+
   useEffect(() => {
-    fetch("http://zenquotes.io/api/random", { method: "GET" })
+    fetch("https://zenquotes.io/api/random")
       .then((res) => {
         console.log(res);
+
+        return res.json();
       })
-      .catch(() => {
+      .then((data: any) => {
+        console.warn(data);
+
+        // setQuote(res[0]);
+      })
+      .catch((error) => {
         // do nothing, don't bother user, just don't show the quote
+        console.warn(error);
       });
   }, []);
 
-  return <>{}</>;
+  return (
+    <div className="flex flex-row flex-1 justify-center items-center">
+      {quote && (
+        <span className="flex flex-col justify-center items-center">
+          <span className="text-xl text-gray-800 font-semibold">{quote.q}</span>
+          <span className="tex-md italic text-gray-400">{quote.a}</span>
+        </span>
+      )}
+    </div>
+  );
 }