feat: Favorites (#1094)

* Adding the favorite button

* favorites services and resolvers

* favorites schema

* favorite ability handler

* favorite module export

* front end UI

* front end graphql additions

* server ability handlers

* server resolvers and services

* css fix

* Adding the favorite button

* favorites services and resolvers

* favorites schema

* favorite ability handler

* favorite module export

* front end UI

* front end graphql additions

* server ability handlers

* server resolvers and services

* css fix

* delete favorites handler and resolver

* removed favorite from index list

* chip avatar size props

* index list additions

* UI additions for favorites functionality

* lint fixes

* graphql codegen

* UI fixes

* favorite hook addition

* moved to ~/modules

* Favorite mapping to workspaceMember

* graphql codegen

* cosmetic changes

* camel cased methods

* graphql codegen

front/src/modules/favorites/components/Favorites.tsx

@@ -0,0 +1,63 @@
+import styled from '@emotion/styled';
+
+import NavItem from '@/ui/navbar/components/NavItem';
+import { Avatar } from '@/users/components/Avatar';
+import { useGetFavoritesQuery } from '~/generated/graphql';
+import { getLogoUrlFromDomainName } from '~/utils';
+
+const Wrapper = styled.div`
+  display: flex;
+  flex-direction: column;
+  overflow-x: auto;
+  width: 100%;
+`;
+
+export function Favorites() {
+  const { data } = useGetFavoritesQuery();
+  const favorites = data?.findFavorites;
+
+  if (!favorites) return <></>;
+
+  return (
+    <Wrapper>
+      {favorites &&
+        favorites.map(
+          ({ id, person, company }) =>
+            (person && (
+              <NavItem
+                key={id}
+                label={`${person.firstName} ${person.lastName}`}
+                icon={
+                  <Avatar
+                    key={id}
+                    avatarUrl={person.avatarUrl ?? ''}
+                    type="rounded"
+                    placeholder={`${person.firstName} ${person.lastName}`}
+                    size="md"
+                  />
+                }
+                to={`/person/${person.id}`}
+              />
+            )) ||
+            (company && (
+              <NavItem
+                key={id}
+                label={company.name}
+                icon={
+                  <Avatar
+                    key={id}
+                    avatarUrl={
+                      getLogoUrlFromDomainName(company.domainName) ?? ''
+                    }
+                    type="squared"
+                    placeholder={company.name}
+                    size="md"
+                  />
+                }
+                to={`/companies/${company.id}`}
+              />
+            )),
+        )}
+    </Wrapper>
+  );
+}

front/src/modules/favorites/hooks/useFavorites.ts

@@ -0,0 +1,84 @@
+import { getOperationName } from '@apollo/client/utilities';
+
+import { GET_COMPANY } from '@/companies/queries';
+import { GET_PERSON } from '@/people/queries/show';
+import {
+  useDeleteFavoriteMutation,
+  useInsertCompanyFavoriteMutation,
+  useInsertPersonFavoriteMutation,
+} from '~/generated/graphql';
+
+import { GET_FAVORITES } from '../queries/show';
+
+export function useFavorites() {
+  const [insertCompanyFavoriteMutation] = useInsertCompanyFavoriteMutation();
+  const [insertPersonFavoriteMutation] = useInsertPersonFavoriteMutation();
+  const [deleteFavoriteMutation] = useDeleteFavoriteMutation();
+
+  function insertCompanyFavorite(companyId: string) {
+    insertCompanyFavoriteMutation({
+      variables: {
+        data: {
+          companyId,
+        },
+      },
+      refetchQueries: [
+        getOperationName(GET_FAVORITES) ?? '',
+        getOperationName(GET_COMPANY) ?? '',
+      ],
+    });
+  }
+
+  function insertPersonFavorite(personId: string) {
+    insertPersonFavoriteMutation({
+      variables: {
+        data: {
+          personId,
+        },
+      },
+      refetchQueries: [
+        getOperationName(GET_FAVORITES) ?? '',
+        getOperationName(GET_PERSON) ?? '',
+      ],
+    });
+  }
+
+  function deleteCompanyFavorite(companyId: string) {
+    deleteFavoriteMutation({
+      variables: {
+        where: {
+          companyId: {
+            equals: companyId,
+          },
+        },
+      },
+      refetchQueries: [
+        getOperationName(GET_FAVORITES) ?? '',
+        getOperationName(GET_COMPANY) ?? '',
+      ],
+    });
+  }
+
+  function deletePersonFavorite(personId: string) {
+    deleteFavoriteMutation({
+      variables: {
+        where: {
+          personId: {
+            equals: personId,
+          },
+        },
+      },
+      refetchQueries: [
+        getOperationName(GET_FAVORITES) ?? '',
+        getOperationName(GET_PERSON) ?? '',
+      ],
+    });
+  }
+
+  return {
+    insertCompanyFavorite,
+    insertPersonFavorite,
+    deleteCompanyFavorite,
+    deletePersonFavorite,
+  };
+}

front/src/modules/favorites/queries/show.ts

@@ -0,0 +1,25 @@
+import { gql } from '@apollo/client';
+
+export const GET_FAVORITES = gql`
+  query GetFavorites {
+    findFavorites {
+      id
+      person {
+        id
+        firstName
+        lastName
+        avatarUrl
+      }
+      company {
+        id
+        name
+        domainName
+        accountOwner {
+          id
+          displayName
+          avatarUrl
+        }
+      }
+    }
+  }
+`;

front/src/modules/favorites/queries/update.ts

@@ -0,0 +1,36 @@
+import { gql } from '@apollo/client';
+
+export const INSERT_PERSON_FAVORITE = gql`
+  mutation InsertPersonFavorite($data: FavoriteMutationForPersonArgs!) {
+    createFavoriteForPerson(data: $data) {
+      id
+      person {
+        id
+        firstName
+        lastName
+        displayName
+      }
+    }
+  }
+`;
+
+export const INSERT_COMPANY_FAVORITE = gql`
+  mutation InsertCompanyFavorite($data: FavoriteMutationForCompanyArgs!) {
+    createFavoriteForCompany(data: $data) {
+      id
+      company {
+        id
+        name
+        domainName
+      }
+    }
+  }
+`;
+
+export const DELETE_FAVORITE = gql`
+  mutation DeleteFavorite($where: FavoriteWhereInput!) {
+    deleteFavorite(where: $where) {
+      id
+    }
+  }
+`;