consolidated AccountModal context into session context/provider, etc.

packages/fakeyou.com/src/App.tsx

@@ -62,7 +62,7 @@ import HttpBackend from "i18next-http-backend";
 
 import {
   InferenceJobs,
-  Session as SessionProvider,
+  SessionProvider,
 } from "components/providers";
 
 // NB: We're transitioning over to this instance of i18n-next that loads translations over HTTP from Json Files.

packages/fakeyou.com/src/components/providers/Session/Session.tsx

@@ -1,16 +0,0 @@
-import React from 'react';
-import { SessionContext } from 'context';
-
-interface Props {
-  children?: any;
-  querySession: any;
-  querySubscriptions: any;
-  sessionFetched: boolean;
-  sessionWrapper?: any;
-}
-
-export default function Session({ children, querySession, querySubscriptions, sessionFetched, sessionWrapper }: Props) { 
-  return <SessionContext.Provider {...{ value: { querySession, querySubscriptions, sessionFetched, sessionWrapper } }}>
-    { children }
-  </SessionContext.Provider>
-};

packages/fakeyou.com/src/components/providers/Session/index.ts

@@ -1 +0,0 @@
-export { default } from './Session';

packages/fakeyou.com/src/components/providers/SessionProvider/SessionProvider.tsx

@@ -0,0 +1,52 @@
+import React, { useState } from "react";
+import { SessionContext } from "context";
+import { Modal } from "components/common";
+import AccountModal from "components/layout/AccountModal";
+import { ModalView } from "context/SessionContext";
+
+interface Props {
+  children?: any;
+  querySession: any;
+  querySubscriptions: any;
+  sessionFetched: boolean;
+  sessionWrapper?: any;
+}
+
+export default function SessionProvider({ children, querySession, querySubscriptions, sessionFetched, sessionWrapper }: Props) {
+  const { logged_in: loggedIn, user } = sessionWrapper?.sessionStateResponse || { logged_in: false };
+  const [view,viewSet] = useState(ModalView.Closed);
+  const open = () => viewSet(ModalView.Signup);
+  const close = () => { viewSet(ModalView.Closed); console.log("🍏",);};
+  const viewSwitch = () => view === ModalView.Signup ? viewSet(ModalView.Login) : viewSet(ModalView.Signup);
+  const check = () => {
+    if (user) {
+      return true;
+    } else {
+      open();
+      return false;
+    }
+  };
+
+  return <SessionContext.Provider {...{ value: {
+    check,
+    loggedIn,
+    modal: { close, open, view },
+    querySession,
+    querySubscriptions,
+    sessionFetched,
+    user
+  } }}>
+    { children }
+    {
+      <Modal {...{
+        content: AccountModal,
+        contentProps: { view, viewSwitch },
+        handleClose: close,
+        noHeader: true,
+        show: view > 0,
+        showButtons: false,
+        // title: "You need to login",
+      }}/>
+    }
+  </SessionContext.Provider>
+};

packages/fakeyou.com/src/components/providers/SessionProvider/index.ts

@@ -0,0 +1 @@
+export { default } from "./SessionProvider";

packages/fakeyou.com/src/components/providers/index.ts

@@ -1,5 +1,5 @@
 import AccountModalProvider from "./AccountModalProvider";
 import InferenceJobs from "./InferenceJobs";
-import Session from "./Session";
+import SessionProvider from "./SessionProvider";
 
-export { AccountModalProvider, InferenceJobs, Session };
+export { AccountModalProvider, InferenceJobs, SessionProvider };

packages/fakeyou.com/src/context/SessionContext.tsx

@@ -1,12 +1,34 @@
 import { createContext } from "react";
 
+export enum ModalView {
+  Closed,
+  Signup,
+  Login
+}
+
+interface ModalProps {
+  close: () => void,
+  open: () => void,
+  view: ModalView
+}
+
 interface SessionContextType {
-	querySession?: any,
-	querySubscriptions?: any,
-	sessionFetched: boolean,
-	sessionWrapper?: any
+  check: () => boolean,
+  loggedIn: boolean,
+  modal: ModalProps,
+  querySession?: any,
+  querySubscriptions?: any,
+  sessionFetched: boolean,
+  user?: any
 }
 
 export default createContext<SessionContextType>({
-	sessionFetched: false
+  check: () => false,
+  loggedIn: false,
+  sessionFetched: false,
+  modal: {
+    close: () => {},
+    open: () => {},
+    view: ModalView.Closed,
+  }
 });

packages/fakeyou.com/src/hooks/index.tsx

@@ -11,7 +11,6 @@ import useInterval from './useInterval';
 import useLazyLists from './useLazyLists';
 import useListContent from './useListContent';
 import useLocalize from './useLocalize';
-import useLoginModal from "./useLoginModal";
 import useMedia from './useMedia';
 import useRatings from './useRatings';
 import useSdUpload from './useSdUpload';
@@ -33,7 +32,6 @@ export {
   useLazyLists,
   useListContent,
   useLocalize,
-  useLoginModal,
   useMedia,
   useRatings,
   useSdUpload,

packages/fakeyou.com/src/hooks/useBatchContent/useBatchContent.tsx

@@ -1,6 +1,6 @@
 import { useState } from "react";
 import { FetchStatus } from "@storyteller/components/src/api/_common/SharedFetchTypes";
-import { useLoginModal, useSession } from "hooks";
+import { useSession } from "hooks";
 
 interface Props {
   checker: any,
@@ -32,8 +32,7 @@ export default function useBatchContent({
   resultsKey,
   toggleCheck
 }: Props) {
-  const { user } = useSession();
-  const login = useLoginModal();
+  const session = useSession();
   const [library, librarySet] = useState<Library>({});
   const [busyList, busyListSet] = useState<Library>({});
   const [status, statusSet] = useState(FetchStatus.ready);
@@ -73,7 +72,7 @@ export default function useBatchContent({
   });
 
   const toggle = (entity_token: string, entity_type: string) => {
-    if (login.sessionCheck()) {
+    if (session.check()) {
       let inLibrary = library[entity_token];
       statusSet(FetchStatus.in_progress);
       busyAdd(entity_token);

packages/fakeyou.com/src/hooks/useChanger/useChanger.tsx

@@ -1,12 +1,6 @@
 import { useState } from "react";
 import { InputValidation, InputStateLibrary, ValidatorCallbacks } from "common/InputValidation";
 
-// interface Props {
-//   errorStrings: { [key:string]: { [error:string]: string } },
-//   state: { [key:string]: any },
-//   validators: { [key: string]: (value:any) => any }
-// }
-
 interface InputInput {
   errorText?: { [key: string]: string },
   validator?: (value: ValidatorCallbacks) => ValidatorOutput,
@@ -49,7 +43,6 @@ export default function useChanger(input: Props) {
     const config = input[name];
     const current = state[name];
     if (config && current) {
-      console.log("🍇",config.errorText,current);
       return {
         name,
         value: current.value,

packages/fakeyou.com/src/hooks/useLoginModal/index.ts

@@ -1 +0,0 @@
-export { default } from "./useLoginModal";

packages/fakeyou.com/src/hooks/useLoginModal/useLoginModal.tsx

@@ -1,8 +0,0 @@
-import { useContext } from "react";
-import { AccountModalContext } from "context";
-
-export default function useLoginModal() {
-  const login = useContext(AccountModalContext)
-
-  return login;
-};

packages/fakeyou.com/src/hooks/useSession/useSession.tsx

@@ -2,14 +2,15 @@ import { useContext } from 'react';
 import { SessionContext } from 'context';
 
 export default function useInferenceJobs() {
-  const { querySession, querySubscriptions, sessionFetched, sessionWrapper } = useContext(SessionContext);
-  const { logged_in: loggedIn, user } = sessionWrapper?.sessionStateResponse || { logged_in: false };
+  return useContext(SessionContext);
+  // const { querySession, querySubscriptions, sessionFetched, sessionWrapper } = useContext(SessionContext);
+  // const { logged_in: loggedIn, user } = sessionWrapper?.sessionStateResponse || { logged_in: false };
 
-  return {
-    loggedIn,
-    querySession,
-    querySubscriptions,
-    sessionFetched,
-    user
-  };
+  // return {
+  //   loggedIn,
+  //   querySession,
+  //   querySubscriptions,
+  //   sessionFetched,
+  //   user
+  // };
 };

packages/fakeyou.com/src/v2/view/PageContainer.tsx

@@ -102,7 +102,6 @@ import WeightPage from "./pages/weight/WeightPage";
 import ExplorePage from "./pages/explore/ExplorePage";
 import SearchPage from "./search/SearchPage";
 import { SearchProvider } from "context/SearchContext";
-import { AccountModalProvider } from "components/providers";
 import WeightEditPage from "./pages/weight/WeightEditPage";
 import UploadSdWeightPage from "./pages/upload/UploadSdWeightPage";
 
@@ -214,7 +213,6 @@ class PageContainer extends React.Component<
 
   public render() {
     return (
-      <AccountModalProvider>
       <SearchProvider>
         <div id="wrapper" className="no-padding">
           <div id="overlay"></div>
@@ -883,7 +881,6 @@ class PageContainer extends React.Component<
           </div>
         </div>
       </SearchProvider>
-      </AccountModalProvider>
     );
   }
 }