Merge pull request #1539 from tijlleenders/update/partner-mode

Update: Partner mode UI && Inbox Removed

src/Interfaces/Sharing.ts

@@ -0,0 +1,9 @@
+export interface ICollaboration {
+  newUpdates: boolean;
+  collaborators: { relId: string; name: string }[];
+}
+
+export interface IShared {
+  conversionRequests: { status: boolean; senders: string[] };
+  contacts: { relId: string; name: string }[];
+}

src/api/ContactsAPI/index.ts

@@ -9,15 +9,17 @@ export const getAllContacts = async () => {
   return allContacts;
 };
 
+export const getPartnersCount = async () => {
+  return db.contactsCollection.count();
+};
+
 export const addContact = async (contactName: string, relId: string, accepted = false) => {
   const name = `${contactName.charAt(0).toUpperCase() + contactName.slice(1)}`;
   const currentDate = new Date();
   const newContact: ContactItem = {
     id: uuidv4(),
     name,
     relId,
-    sharedGoals: [],
-    collaborativeGoals: [],
     createdAt: currentDate,
     accepted,
   };

src/api/SharedWMAPI/index.ts

@@ -67,6 +67,16 @@ export const getActiveSharedWMGoals = async () => {
   return activeGoals;
 };
 
+export const getRootGoalsOfPartner = async (relId: string) => {
+  return (
+    await db.sharedWMCollection
+      .where("parentGoalId")
+      .equals("root")
+      .and((x) => x.participants[0].relId === relId)
+      .sortBy("createdAt")
+  ).reverse();
+};
+
 export const updateSharedWMGoal = async (id: string, changes: object) => {
   db.transaction("rw", db.sharedWMCollection, async () => {
     await db.sharedWMCollection.update(id, changes).then((updated) => updated);

src/components/BottomNavbar/BottomNavbar.tsx

@@ -119,7 +119,7 @@ const BottomNavbar = ({ title }: { title: string }) => {
             title={themeSelection ? "ArrowIcon" : "JournalIcon"}
           />
           {themeSelection ? <p>Next</p> : <p>{t("Journal")}</p>}
-          {title !== "myTime" && title !== "Inbox" && title !== "Focus" && <GlobalAddBtn add={title} />}
+          {title !== "myTime" && title !== "Focus" && <GlobalAddBtn add={title} />}
         </button>
       </BottomNavLayout>
     </>

src/components/GoalsComponents/GoalAvatar.tsx

@@ -1,13 +1,10 @@
+import React from "react";
 import Icon from "@src/common/Icon";
 import { GoalItem } from "@src/models/GoalItem";
-import { openInbox } from "@src/store";
 import { getSvgForGoalPps } from "@src/utils";
-import { Tooltip } from "antd";
-import React from "react";
 import { useLocation, useNavigate } from "react-router-dom";
-import { useRecoilValue } from "recoil";
 
-const Avatar = ({ goal }: { goal: GoalItem }) => {
+const GoalAvatar = ({ goal }: { goal: GoalItem }) => {
   const location = useLocation();
   const navigate = useNavigate();
   const { participants, goalColor } = goal;
@@ -37,26 +34,4 @@ const Avatar = ({ goal }: { goal: GoalItem }) => {
   );
 };
 
-const GoalAvatar = ({ goal }: { goal: GoalItem }) => {
-  const isInboxOpen = useRecoilValue(openInbox);
-
-  return isInboxOpen ? (
-    <Tooltip placement="top" title={goal.participants[0].name}>
-      <div className="contact-button" style={goal.archived ? { right: "78px" } : {}}>
-        <button
-          type="button"
-          className="contact-icon"
-          style={{
-            background: `radial-gradient(50% 50% at 50% 50%, ${goal.goalColor}33 20% 79.17%, ${goal.goalColor} 100%)`,
-          }}
-        >
-          {goal.participants[0].name.charAt(0)}
-        </button>
-      </div>
-    </Tooltip>
-  ) : (
-    <Avatar goal={goal} />
-  );
-};
-
 export default GoalAvatar;

src/components/GoalsComponents/GoalSublist/GoalSublist.tsx

@@ -5,7 +5,7 @@ import { GoalItem } from "@src/models/GoalItem";
 import { getChildrenGoals, getGoal } from "@src/api/GoalsAPI";
 import { createGoalObjectFromTags } from "@src/helpers/GoalProcessor";
 import { getSharedWMChildrenGoals, getSharedWMGoal } from "@src/api/SharedWMAPI";
-import { displayPartnerMode, lastAction, openInbox } from "@src/store";
+import { displayPartnerMode, lastAction } from "@src/store";
 import {
   displayAddGoal,
   displayChangesModal,
@@ -24,7 +24,6 @@ import ArchivedAccordion from "../ArchivedAccordion";
 export const GoalSublist = () => {
   const action = useRecoilValue(lastAction);
   const goalID = useRecoilValue(displayGoalId);
-  const isInboxOpen = useRecoilValue(openInbox);
   const showAddGoal = useRecoilValue(displayAddGoal);
   const showUpdateGoal = useRecoilValue(displayUpdateGoal);
   const showChangesModal = useRecoilValue(displayChangesModal);
@@ -41,17 +40,13 @@ export const GoalSublist = () => {
   };
 
   useEffect(() => {
-    (isInboxOpen || showPartnerMode ? getSharedWMGoal(goalID) : getGoal(goalID)).then((parent) =>
-      setParentGoal(parent),
-    );
+    (showPartnerMode ? getSharedWMGoal(goalID) : getGoal(goalID)).then((parent) => setParentGoal(parent));
   }, [goalID]);
 
   useEffect(() => {
-    (isInboxOpen || showPartnerMode ? getSharedWMChildrenGoals(goalID) : getChildrenGoals(goalID)).then(
-      (fetchedGoals) => {
-        handleChildrenGoals(fetchedGoals);
-      },
-    );
+    (showPartnerMode ? getSharedWMChildrenGoals(goalID) : getChildrenGoals(goalID)).then((fetchedGoals) => {
+      handleChildrenGoals(fetchedGoals);
+    });
   }, [action, parentGoal, showAddGoal, showSuggestionModal, showChangesModal, showUpdateGoal]);
 
   return (

src/components/GoalsComponents/MyGoal.tsx

@@ -7,10 +7,9 @@ import pencil from "@assets/images/pencil.svg";
 import { unarchiveIcon } from "@src/assets";
 
 import { GoalItem } from "@src/models/GoalItem";
-import { getSvgForGoalPps } from "@src/utils";
 import { unarchiveUserGoal } from "@src/api/GoalsAPI";
 import { replaceUrlsWithText, summarizeUrl } from "@src/utils/patterns";
-import { darkModeState, displayPartnerMode, lastAction, openInbox } from "@src/store";
+import { darkModeState, displayPartnerMode, lastAction } from "@src/store";
 import { displayGoalId, displayUpdateGoal, goalsHistory, displayChangesModal } from "@src/store/GoalsState";
 import useGoalStore from "@src/hooks/useGoalStore";
 
@@ -82,7 +81,6 @@ const MyGoal: React.FC<MyGoalProps> = ({ goal, showActions, setShowActions }) =>
   // const sharedWithContact = goal.shared.contacts.length > 0 ? goal.shared.contacts[0].name : null;
   // const collabWithContact =
   //   goal.collaboration.collaborators.length > 0 ? goal.collaboration.collaborators[0].name : null;
-  const participantsSvg = getSvgForGoalPps(goal.participants.length);
   const navigate = useNavigate();
   const location = useLocation();
   const { handleUpdateGoal } = useGoalStore();
@@ -91,7 +89,6 @@ const MyGoal: React.FC<MyGoalProps> = ({ goal, showActions, setShowActions }) =>
   const [selectedGoalId, setSelectedGoalId] = useRecoilState(displayGoalId);
   const [showChangesModal, setShowChangesModal] = useRecoilState(displayChangesModal);
   const [subGoalHistory, setSubGoalHistory] = useRecoilState(goalsHistory);
-  const isInboxOpen = useRecoilValue(openInbox);
   const showPartnerMode = useRecoilValue(displayPartnerMode);
   const setLastAction = useSetRecoilState(lastAction);
 
@@ -162,7 +159,7 @@ const MyGoal: React.FC<MyGoalProps> = ({ goal, showActions, setShowActions }) =>
   }, [location]);
 
   const isActionVisible = () => {
-    return !archived && !isInboxOpen && !showPartnerMode && showActions.open === goal.id && showActions.click > 0;
+    return !archived && !showPartnerMode && showActions.open === goal.id && showActions.click > 0;
   };
 
   return (
@@ -268,7 +265,7 @@ const MyGoal: React.FC<MyGoalProps> = ({ goal, showActions, setShowActions }) =>
           )}
         </div>
       </div>
-      {goal.participants.length > 0 && <GoalAvatar goal={goal} />}
+      {!showPartnerMode && goal.participants.length > 0 && <GoalAvatar goal={goal} />}
       {archived && (
         <div className="contact-button">
           <button

src/components/GoalsComponents/MyGoalActions/MyGoalActions.tsx

@@ -12,7 +12,6 @@ import {
   lastAction,
   openDevMode,
   displayConfirmation,
-  openInbox,
   displayPartnerMode,
 } from "@src/store";
 import { GoalItem } from "@src/models/GoalItem";
@@ -31,29 +30,26 @@ const MyGoalActions = ({ goal, open }: { open: boolean; goal: GoalItem }) => {
   const confirmActionCategory = goal.typeOfGoal === "shared" && goal.parentGoalId === "root" ? "collaboration" : "goal";
 
   const theme = useRecoilValue(themeState);
-  const isInboxOpen = useRecoilValue(openInbox);
   const darkModeStatus = useRecoilValue(darkModeState);
   const subGoalsHistory = useRecoilValue(goalsHistory);
   const showConfirmation = useRecoilValue(displayConfirmation);
-  const showPartnerMode = useRecoilValue(displayPartnerMode);
+  const isPartnerGoal = useRecoilValue(displayPartnerMode);
   const setDevMode = useSetRecoilState(openDevMode);
   const setShowToast = useSetRecoilState(displayToast);
   const setLastAction = useSetRecoilState(lastAction);
   const ancestors = subGoalsHistory.map((ele) => ele.goalID);
 
   const [confirmationAction, setConfirmationAction] = useState<confirmAction | null>(null);
 
-  const isSharedGoal = isInboxOpen || showPartnerMode;
-
   const handleActionClick = async (action: string) => {
     if (action === "delete") {
       if (goal.title === "magic") {
         setDevMode(false);
       }
-      await removeThisGoal(goal, ancestors, isInboxOpen, showPartnerMode);
+      await removeThisGoal(goal, ancestors, isPartnerGoal);
       setLastAction("Delete");
     } else if (action === "archive") {
-      await archiveThisGoal(goal, ancestors, isInboxOpen);
+      await archiveThisGoal(goal, ancestors);
       setLastAction("Archive");
     } else if (action === "colabRequest") {
       // await convertSharedWMGoalToColab(goal);
@@ -104,14 +100,14 @@ const MyGoalActions = ({ goal, open }: { open: boolean; goal: GoalItem }) => {
           await openConfirmationPopUp({ actionCategory: confirmActionCategory, actionName: "delete" });
         }}
       >
-        <ActionDiv label={t(isInboxOpen ? "Rmove From here" : "Delete")} icon="Delete" />
+        <ActionDiv label={t(isPartnerGoal ? "Rmove From here" : "Delete")} icon="Delete" />
       </div>
-      {((isSharedGoal && goal.parentGoalId === "root") || !isSharedGoal) && (
+      {((isPartnerGoal && goal.parentGoalId === "root") || !isPartnerGoal) && (
         <div
           className="goal-action shareOptions-btn"
           onClickCapture={async (e) => {
             e.stopPropagation();
-            if (!isSharedGoal) {
+            if (!isPartnerGoal) {
               if (goal.typeOfGoal !== "myGoal" && goal.parentGoalId !== "root") {
                 setShowToast({
                   message: "Sorry, you are not allowed to share",
@@ -127,12 +123,12 @@ const MyGoalActions = ({ goal, open }: { open: boolean; goal: GoalItem }) => {
           }}
         >
           <ActionDiv
-            label={t(isSharedGoal ? "Collaborate" : "Share")}
-            icon={isSharedGoal ? "Collaborate" : "SingleAvatar"}
+            label={t(isPartnerGoal ? "Collaborate" : "Share")}
+            icon={isPartnerGoal ? "Collaborate" : "SingleAvatar"}
           />
         </div>
       )}
-      {!isSharedGoal && (
+      {!isPartnerGoal && (
         <div
           className="goal-action shareOptions-btn"
           onClickCapture={async (e) => {

src/components/GoalsComponents/ShareGoalModal/AddContactModal.tsx

@@ -32,7 +32,7 @@ const AddContactModal: React.FC<AddContactModalProps> = ({ showAddContactModal,
         const res = await initRelationship();
         if (res.success && res.response.relId && res.response.relId.length > 0) {
           const { relId } = res.response;
-          await Promise.all([addContact(newContact?.contactName, relId), createPartner(relId, newContact.contactName)]);
+          await addContact(newContact?.contactName, relId);
           setNewContact({ ...newContact, relId });
           const defaultPartner = localStorage.getItem("defaultPartner");
           if (!defaultPartner) {
@@ -70,8 +70,9 @@ const AddContactModal: React.FC<AddContactModalProps> = ({ showAddContactModal,
         setNewContact(null);
         handleCloseAddContact();
       }}
-      className={`addContact-modal popupModal${darkModeStatus ? "-dark" : ""} ${darkModeStatus ? "dark" : "light"
-        }-theme${theme[darkModeStatus ? "dark" : "light"]}`}
+      className={`addContact-modal popupModal${darkModeStatus ? "-dark" : ""} ${
+        darkModeStatus ? "dark" : "light"
+      }-theme${theme[darkModeStatus ? "dark" : "light"]}`}
     >
       <p className="popupModal-title"> Add a contact name </p>
       <input