replace references to bpuid with logged in user

9 files changed, 73 insertions, 97 deletions

diff --git a/jb-ui/src/JBApp.tsx b/jb-ui/src/JBApp.tsx
index fd0eeba..a69cc85 100644
--- a/jb-ui/src/JBApp.tsx
+++ b/jb-ui/src/JBApp.tsx
@@ -16,6 +16,7 @@ import {
 import Footer from "@/components/Footer";
 import { useAppDispatch } from "@/hooks";
 import { bpid, routeBasename, tagManager } from "@/lib/utils";
+import { useGetMeQuery } from "@/models/authAPI";
 import {
   setAssignmentID,
   setProductUserID,
@@ -72,24 +73,19 @@ function isPingMessage(msg: Message): msg is PingMessage {
 function QueryParamProcessor() {
   const dispatch = useAppDispatch();
   const [searchParams] = useSearchParams();
+  const { data: user, isLoading, isError } = useGetMeQuery();
 
   useEffect(() => {
-    const worker_id = searchParams.get("workerId");
     const assignment_id = searchParams.get("assignmentId");
     const tsid = searchParams.get("tsid");
-    const turkSubmitTo = searchParams.get("turkSubmitTo");
 
-    if (turkSubmitTo) {
-      dispatch(setTurkSubmitTo(turkSubmitTo));
-    }
-
-    if (worker_id) {
-      dispatch(setProductUserID(worker_id));
+    if (user?.product_user_id) {
+      dispatch(setProductUserID(user.product_user_id));
 
       new WalletApi()
         .getUserWalletBalanceProductIdWalletGet(
           bpid, // productId
-          worker_id, // bpuid
+          user.product_user_id,
         )
         .then((res) => {
           const response = res.data as UserWalletBalanceResponse;
diff --git a/jb-ui/src/components/Footer.tsx b/jb-ui/src/components/Footer.tsx
index eede06c..ec458f2 100644
--- a/jb-ui/src/components/Footer.tsx
+++ b/jb-ui/src/components/Footer.tsx
@@ -1,8 +1,7 @@
-import { useAppSelector } from "@/hooks";
+import { useGetMeQuery } from "@/models/authAPI";
 
 const Footer = () => {
-  const bpuid = useAppSelector((state) => state.app.bpuid);
-  const assignment_id = useAppSelector((state) => state.app.assignment_id);
+  const { data: user, isLoading, isError } = useGetMeQuery();
 
   return (
     <div
@@ -14,7 +13,7 @@ const Footer = () => {
         <p>
           help:{" "}
           <a
-            href={`mailto:support@jamesbillings67.com?subject=AMT Support Request: (${bpuid ?? "-"}) ${assignment_id ?? "–"}`}
+            href={`mailto:support@jamesbillings67.com?subject=AMT Support Request: (${user?.product_user_id ?? "-"})`}
           >
             support@jamesbillings67.com
           </a>
diff --git a/jb-ui/src/components/Profiling.tsx b/jb-ui/src/components/Profiling.tsx
index 96b06b2..23b8457 100644
--- a/jb-ui/src/components/Profiling.tsx
+++ b/jb-ui/src/components/Profiling.tsx
@@ -1,4 +1,5 @@
 import { UpkQuestionChoice } from "@/api_fsb";
+import { useGetMeQuery } from "@/models/authAPI";
 import { ChevronRightIcon } from "lucide-react";
 import { KeyboardEvent, MouseEvent, useEffect, useRef, useState } from "react";
 
@@ -46,7 +47,7 @@ const TextEntry = () => {
   // const selectAnswer = useSelector(selectAnswerForQuestion(question));
   const metadata = activeQuestion?._metadata;
   const validation = activeQuestion?._validation;
-  const bpuid = useAppSelector((state) => state.app.bpuid);
+  const { data: user, isLoading, isError } = useGetMeQuery();
 
   if (!metadata) return null;
   if (!validation) return null;
@@ -67,11 +68,14 @@ const TextEntry = () => {
 
   const handleKeyPress = (event: KeyboardEvent<HTMLInputElement>) => {
     if (!activeQuestion.question_id) return;
-    if (!bpuid) return;
+    if (!user?.product_user_id) return;
 
     if (event.key === "Enter") {
       dispatch(
-        saveAnswer({ questionId: activeQuestion.question_id!, bpuid: bpuid }),
+        saveAnswer({
+          questionId: activeQuestion.question_id!,
+          bpuid: user.product_user_id,
+        }),
       );
     }
   };
@@ -109,14 +113,14 @@ export default function useKeyboardMode(rowModel: RowModel<UpkQuestionChoice>) {
 
   const dispatch = useAppDispatch();
   const activeQuestion = useSelector(selectActiveQuestion);
-  const bpuid = useAppSelector((state) => state.app.bpuid);
+  const { data: user, isLoading, isError } = useGetMeQuery();
 
   const keyboardSelectionIdxRef = useRef(0);
 
   useEffect(() => {
     const handleKeyDown = (event: KeyboardEvent) => {
       if (!activeQuestion) return;
-      if (!bpuid) return;
+      if (!user?.product_user_id) return;
 
       //   if (!keyboardEnabled) {
       //     return;
@@ -141,7 +145,10 @@ export default function useKeyboardMode(rowModel: RowModel<UpkQuestionChoice>) {
 
       if (event.key === "Enter") {
         dispatch(
-          saveAnswer({ questionId: activeQuestion.question_id!, bpuid: bpuid }),
+          saveAnswer({
+            questionId: activeQuestion.question_id!,
+            bpuid: user.product_user_id,
+          }),
         );
       }
 
@@ -507,15 +514,18 @@ const ProfilingQuestionSubmitButton = () => {
 
   const activeQuestion = useSelector(selectActiveQuestion);
   const activeQuestionValidation = useSelector(selectActiveQuestionValidation);
-  const bpuid = useAppSelector((state) => state.app.bpuid);
+  const { data: user, isLoading, isError } = useGetMeQuery();
 
   const handleOnClick = () => {
     if (!activeQuestion) return;
     if (!activeQuestionValidation?.isComplete) return;
-    if (!bpuid) return;
+    if (!user?.product_user_id) return;
 
     dispatch(
-      saveAnswer({ questionId: activeQuestion.question_id!, bpuid: bpuid }),
+      saveAnswer({
+        questionId: activeQuestion.question_id!,
+        bpuid: user.product_user_id,
+      }),
     );
   };
 
@@ -749,14 +759,14 @@ const Profiling = () => {
   const [showProfiling, setShowProfiling] = useState(false);
 
   const dispatch = useAppDispatch();
-  const bpuid = useAppSelector((state) => state.app.bpuid);
+  const { data: user, isLoading, isError } = useGetMeQuery();
 
   useEffect(() => {
-    if (!bpuid) return;
-    dispatch(fetchNewQuestions(bpuid));
-  }, [bpid, bpuid]);
+    if (!user?.product_user_id) return;
+    dispatch(fetchNewQuestions(user.product_user_id));
+  }, [bpid, user?.product_user_id]);
 
-  if (!bpuid) return null;
+  if (!user?.product_user_id) return null;
 
   return (
     <div
diff --git a/jb-ui/src/components/Wallet.tsx b/jb-ui/src/components/Wallet.tsx
index 933dc9a..3f5c6a4 100644
--- a/jb-ui/src/components/Wallet.tsx
+++ b/jb-ui/src/components/Wallet.tsx
@@ -3,6 +3,7 @@ import {
   UserLedgerTransactionsResponseTransactionsInner,
   WalletApi,
 } from "@/api_fsb";
+import { useGetMeQuery } from "@/models/authAPI";
 import { useAppDispatch, useAppSelector } from "@/hooks";
 import { bpid, formatCentsToUSD } from "@/lib/utils";
 import {
@@ -187,19 +188,19 @@ const WalletTransactionsHeader = () => {
 
 const WalletTransactions = () => {
   const dispatch = useAppDispatch();
-  const bpuid = useAppSelector((state) => state.app.bpuid);
+  const { data: user, isLoading, isError } = useGetMeQuery();
   const userLedgerTxs = useAppSelector((state) => state.app.userLedgerTxs);
 
   const txPagination = useAppSelector((state) => state.app.txPagination);
   const txTotalPages = useAppSelector((state) => state.app.txTotalPages);
 
   useEffect(() => {
-    if (!bpuid) return;
+    if (!user?.product_user_id) return;
 
     new WalletApi()
       .getUserTransactionHistoryProductIdTransactionHistoryGet(
         bpid, // productId
-        bpuid, // bpuid
+        user.product_user_id,
         undefined, // createdAfter
         undefined, // createdBefore
         "-created", // orderBy
@@ -215,7 +216,7 @@ const WalletTransactions = () => {
         dispatch(setTxTotalItems(response.total!));
         dispatch(setTxTotalPages(response.pages!));
       });
-  }, [bpuid, txPagination.pageIndex, txPagination.pageSize]);
+  }, [user?.product_user_id, txPagination.pageIndex, txPagination.pageSize]);
 
   const columnHelper =
     createColumnHelper<UserLedgerTransactionsResponseTransactionsInner>();
@@ -438,16 +439,16 @@ const WalletTransactions = () => {
 
 const Wallet = () => {
   const dispatch = useAppDispatch();
-  const bpuid = useAppSelector((state) => state.app.bpuid);
   const pagination = useAppSelector((state) => state.app.txPagination);
+  const { data: user, isLoading, isError } = useGetMeQuery();
 
   useEffect(() => {
-    if (!bpuid) return;
+    if (!user?.product_user_id) return;
 
     new WalletApi()
       .getUserTransactionHistoryProductIdTransactionHistoryGet(
         bpid, // productId
-        bpuid, // bpuid
+        user.product_user_id,
         undefined, // createdAfter
         undefined, // createdBefore
         "-created", // orderBy
@@ -468,9 +469,9 @@ const Wallet = () => {
         dispatch(setTxTotalItems(response.total ?? 0));
         dispatch(setTxTotalPages(response.pages ?? 9));
       });
-  }, [bpuid]);
+  }, [user?.product_user_id]);
 
-  if (!bpuid) return null;
+  if (!user?.product_user_id) return null;
 
   return (
     <div
diff --git a/jb-ui/src/models/authAPI.ts b/jb-ui/src/models/authAPI.ts
index 1ac7886..fa08bc7 100644
--- a/jb-ui/src/models/authAPI.ts
+++ b/jb-ui/src/models/authAPI.ts
@@ -1,4 +1,5 @@
 import { createApi, fetchBaseQuery } from "@reduxjs/toolkit/query/react";
+import type { User } from "@/types/authApi";
 
 export const authApi = createApi({
   reducerPath: "authApi",
@@ -8,7 +9,7 @@ export const authApi = createApi({
   }),
   tagTypes: ["User"],
   endpoints: (builder) => ({
-    getMe: builder.query({
+    getMe: builder.query<User, void>({
       query: () => "/session",
       providesTags: ["User"],
     }),
diff --git a/jb-ui/src/pages/Preview.tsx b/jb-ui/src/pages/Preview.tsx
index 6e50b0d..1926975 100644
--- a/jb-ui/src/pages/Preview.tsx
+++ b/jb-ui/src/pages/Preview.tsx
@@ -95,7 +95,6 @@ export const Leaderboards = () => {
   const [payouts, setPayouts] = useState<Leaderboard | null>(null);
   const [completes, setCompletes] = useState<Leaderboard | null>(null);
 
-  // const bpuid = useAppSelector(state => state.app.bpuid)
   const bpuid = undefined;
 
   useEffect(() => {
@@ -105,7 +104,7 @@ export const Leaderboards = () => {
         LeaderboardCode.CompleteCount,
         frequency,
         "us",
-        bpuid, // bpuid
+        bpuid,
         undefined, // within_time
         10,
       )
diff --git a/jb-ui/src/pages/Transfer.tsx b/jb-ui/src/pages/Transfer.tsx
index bef40d4..4192eee 100644
--- a/jb-ui/src/pages/Transfer.tsx
+++ b/jb-ui/src/pages/Transfer.tsx
@@ -1,5 +1,6 @@
 import { type FormEvent, useState } from "react";
 import { useAppDispatch, useAppSelector } from "@/hooks";
+import { useGetMeQuery } from "@/models/authAPI";
 import { Button } from "@/components/ui/button";
 import max_lulu from "./max-and-lulu.jpg";
 
@@ -43,7 +44,7 @@ type RequestState = "idle" | "working" | "sent" | "failed";
 const TransferSubmit = function ({ onSubmitSuccess }) {
   const [email, setEmail] = useState("");
   const [state, setState] = useState<RequestState>("idle");
-  const bpuid = useAppSelector((state) => state.app.bpuid);
+  const { data: user, isLoading, isError } = useGetMeQuery();
 
   const submit = async (event: FormEvent<HTMLFormElement>) => {
     event.preventDefault();
@@ -56,7 +57,7 @@ const TransferSubmit = function ({ onSubmitSuccess }) {
         headers: { "Content-Type": "application/json" },
         body: JSON.stringify({
           email: email,
-          amt_worker_id: bpuid,
+          amt_worker_id: user?.product_user_id,
         }),
       });
 
@@ -132,10 +133,10 @@ const TransferSubmit = function ({ onSubmitSuccess }) {
 
 const Transfer = function () {
   const assignment_id = useAppSelector((state) => state.app.assignment_id);
-  const bpuid = useAppSelector((state) => state.app.bpuid);
+  const { data: user, isLoading, isError } = useGetMeQuery();
   const [submitted, setSubmitted] = useState(false);
 
-  if (!bpuid) {
+  if (!user?.product_user_id) {
     return (
       <p className="text-center text-2xl py-3 text-red-800 font-semibold">
         No Worker ID found. Please access this page through the Amazon
diff --git a/jb-ui/src/pages/Work.tsx b/jb-ui/src/pages/Work.tsx
index e33328e..84cb946 100644
--- a/jb-ui/src/pages/Work.tsx
+++ b/jb-ui/src/pages/Work.tsx
@@ -51,8 +51,7 @@ import Markdown from "react-markdown";
 const Report = ({ onClose }: { onClose: () => void }) => {
   const [showComplete, setShowComplete] = useState(false);
   const [selectedValues, setSelectedValues] = useState<ReportValue[]>([]);
-
-  const bpuid = useAppSelector((state) => state.app.bpuid);
+  const { data: user, isLoading, isError } = useGetMeQuery();
   const ts = useAppSelector((state) => state.app.taskStatus);
 
   const handleCheckboxChange = (value: ReportValue, checked: boolean) => {
@@ -62,12 +61,12 @@ const Report = ({ onClose }: { onClose: () => void }) => {
   };
 
   const clicked_submit = () => {
-    if (!bpuid) return;
+    if (!user?.product_user_id) return;
     // ReportValue.NUMBER_0
     console.log("selectedValues:", selectedValues);
 
     const rt: ReportTask = {
-      bpuid: bpuid,
+      bpuid: user.product_user_id,
       reasons: selectedValues,
       notes: "",
     };
@@ -122,9 +121,10 @@ const Report = ({ onClose }: { onClose: () => void }) => {
     return <p>Please finish a Task to report its status.</p>;
   }
 
-  if (showComplete) {
-    return <SubimtAMT />;
-  }
+  // TODO! What do we do here, redirect back to / with a thank you + wallet refresh?
+  // if (showComplete) {
+  // return <SubimtAMT />;
+  // }
 
   return (
     <div className="border-2 border-rose-200 rounded">
@@ -189,43 +189,6 @@ const Report = ({ onClose }: { onClose: () => void }) => {
   );
 };
 
-const SubimtAMT = () => {
-  const bpuid = useAppSelector((state) => state.app.bpuid);
-  const assignment_id = useAppSelector((state) => state.app.assignment_id);
-  const ts = useAppSelector((state) => state.app.taskStatus);
-  const turkSubmitTo = useAppSelector((state) => state.app.turkSubmitTo);
-
-  const formRef = useRef<HTMLFormElement>(null);
-
-  useEffect(() => {
-    if (!ts) return;
-    if (!bpuid) return;
-    if (!assignment_id) return;
-    if (!turkSubmitTo) return;
-
-    if (formRef.current) {
-      formRef.current.submit();
-    }
-  }, [ts?.tsid, bpuid, assignment_id, turkSubmitTo]);
-
-  return (
-    <>
-      <form
-        ref={formRef}
-        action={`${turkSubmitTo}/mturk/externalSubmit`}
-        method="POST"
-        style={{ display: "none" }}
-      >
-        <input type="hidden" name="assignmentId" value={assignment_id} />
-        <input type="hidden" name="tsid" value={ts?.tsid} />
-        <input type="hidden" name="amt_assignment_id" value={assignment_id} />
-        <input type="hidden" name="amt_worker_id" value={bpuid} />
-        <button type="submit">Submit HIT</button>
-      </form>
-    </>
-  );
-};
-
 const SurveyMonitor = () => {
   const dispatch = useAppDispatch();
 
@@ -235,7 +198,7 @@ const SurveyMonitor = () => {
   const [showComplete, setShowComplete] = useState(false);
   const [showReport, setShowReport] = useState(false);
 
-  const bpuid = useAppSelector((state) => state.app.bpuid);
+  const { data: user, isLoading, isError } = useGetMeQuery();
   const entered = useAppSelector((state) => state.app.currentBucketEntered);
   const isLow = useAppSelector((state) => isLowBalance(state));
 
@@ -263,7 +226,7 @@ const SurveyMonitor = () => {
   // }, [ts]);
 
   useEffect(() => {
-    if (!bpuid) return;
+    if (!user?.product_user_id) return;
     if (!entered) return;
     if (!isPolling) return;
 
@@ -271,7 +234,7 @@ const SurveyMonitor = () => {
       new StatusApi()
         .listTaskStatusesProductIdStatusGet(
           bpid, // productId
-          bpuid, // Worker ID
+          user.product_user_id, // Worker ID
           entered, // startedAfter
           moment.utc().unix(), // startedBefore
         )
@@ -418,8 +381,9 @@ const SurveyMonitor = () => {
                   Report Survey
                 </button>
               </div>
-
-              {showComplete && <SubimtAMT />}
+              {/* TODO! What do we do here, redirect back to / with wallet */}
+              {/* TODO! refresh? The confetti is on a different page. */}
+              {/* {showComplete && <SubimtAMT />} */}
               {showReport && <Report onClose={() => setShowReport(false)} />}
             </>
           ) : (
@@ -731,7 +695,7 @@ const BucketDetails = () => {
 const SurveyEnter = () => {
   const dispatch = useAppDispatch();
   const loi = useAppSelector((state) => state.app.loi);
-  const bpuid = useAppSelector((state) => state.app.bpuid);
+  const { data: user, isLoading, isError } = useGetMeQuery();
 
   const available_cnt = useAppSelector((state) => getAvailabilityCount(state));
   const buckets = useAppSelector((state) => state.app.currentBuckets);
@@ -739,12 +703,12 @@ const SurveyEnter = () => {
   const isLow = useAppSelector((state) => isLowBalance(state));
 
   useEffect(() => {
-    if (!bpuid) return;
+    if (!user?.product_user_id) return;
 
     new OfferwallApi()
       .topNPlusBlockOfferwallProductIdOfferwallD48cce47Get(
         bpid, // productId
-        bpuid, // bpuid
+        user.product_user_id,
         undefined, // ip
         undefined, // countryIso
         undefined, // languages
@@ -766,7 +730,7 @@ const SurveyEnter = () => {
         dispatch(setCurrentBuckets(top_n_res.buckets));
         dispatch(setOfferwallReasons(top_n_res.offerwall_reasons ?? []));
       });
-  }, [loi, bpuid]);
+  }, [loi, user?.product_user_id]);
 
   const start_survey = () => {
     if (!bucket?.uri) return;
@@ -834,7 +798,6 @@ type RequestState = "idle" | "working" | "sent" | "failed";
 const Login = () => {
   const [email, setEmail] = useState("");
   const [state, setState] = useState<RequestState>("idle");
-  const bpuid = useAppSelector((state) => state.app.bpuid);
 
   // const dispatch = useAppDispatch();
   const submit = async (event: FormEvent<HTMLFormElement>) => {
diff --git a/jb-ui/src/types/authApi.ts b/jb-ui/src/types/authApi.ts
new file mode 100644
index 0000000..19aeee0
--- /dev/null
+++ b/jb-ui/src/types/authApi.ts
@@ -0,0 +1,6 @@
+export interface User {
+  email: string;
+  display_name: string | null;
+  blocked: boolean;
+  product_user_id: string;
+}