use toggle comments button

SeedCompany · Jul 10, 2024 · abed4ef · abed4ef
1 parent 4c55217
commit abed4ef
Show file tree

Hide file tree

Showing 6 changed files with 18 additions and 1 deletion.
diff --git a/src/scenes/Engagement/LanguageEngagement/Header/LanguageEngagementHeader.tsx b/src/scenes/Engagement/LanguageEngagement/Header/LanguageEngagementHeader.tsx
@@ -5,6 +5,7 @@ import { Helmet } from 'react-helmet-async';
 import { makeStyles } from 'tss-react/mui';
 import { EngagementStatusLabels } from '~/api/schema.graphql';
 import { canEditAny, labelFrom } from '~/common';
+import { ToggleCommentsButton } from '~/components/Comments/ToggleCommentButton';
 import { BooleanProperty } from '../../../../components/BooleanProperty';
 import { DataButton } from '../../../../components/DataButton';
 import { useDialog } from '../../../../components/Dialog';
@@ -106,6 +107,9 @@ export const LanguageEngagementHeader = ({
               </Tooltip>
             </Grid>
           )}
+          <Grid item>
+            <ToggleCommentsButton loading={!engagement} />
+          </Grid>
           <Grid item>
             <DeleteEngagement
               project={engagement.project}

diff --git a/src/scenes/Languages/Detail/LanguageDetail.tsx b/src/scenes/Languages/Detail/LanguageDetail.tsx
@@ -7,6 +7,7 @@ import { makeStyles } from 'tss-react/mui';
 import { PartialDeep } from 'type-fest';
 import { removeItemFromList } from '~/api';
 import { canEditAny, listOrPlaceholders } from '~/common';
+import { ToggleCommentsButton } from '~/components/Comments/ToggleCommentButton';
 import { BooleanProperty } from '../../../components/BooleanProperty';
 import { useDialog } from '../../../components/Dialog';
 import {
@@ -140,6 +141,7 @@ export const LanguageDetail = () => {
                 args.input?.filter?.pinned ?? false
               }
             />
+            <ToggleCommentsButton loading={!language} />
           </div>
           <Grid container spacing={2} alignItems="center">
             <Grid item>

diff --git a/src/scenes/Partners/Detail/PartnerDetail.tsx b/src/scenes/Partners/Detail/PartnerDetail.tsx
@@ -10,6 +10,7 @@ import { Many, Nil } from '@seedcompany/common';
 import { Helmet } from 'react-helmet-async';
 import { useParams } from 'react-router-dom';
 import { PartialDeep } from 'type-fest';
+import { ToggleCommentsButton } from '~/components/Comments/ToggleCommentButton';
 import { DataButton } from '~/components/DataButton';
 import { useDialog } from '~/components/Dialog';
 import { Error } from '~/components/Error';
@@ -128,6 +129,7 @@ const PartnerHeader = ({
             args.input?.filter?.pinned ?? false
           }
         />
+        <ToggleCommentsButton loading={!partner} />
       </Stack>
       {acronym && (
         <Typography variant="h4" gutterBottom>

diff --git a/src/scenes/Projects/Overview/ProjectOverview.tsx b/src/scenes/Projects/Overview/ProjectOverview.tsx
@@ -18,6 +18,7 @@ import { makeStyles } from 'tss-react/mui';
 import { PartialDeep } from 'type-fest';
 import { ProjectStepLabels, ProjectTypeLabels } from '~/api/schema.graphql';
 import { labelFrom } from '~/common';
+import { ToggleCommentsButton } from '~/components/Comments/ToggleCommentButton';
 import { BudgetOverviewCard } from '../../../components/BudgetOverviewCard';
 import { CardGroup } from '../../../components/CardGroup';
 import { ChangesetPropertyBadge } from '../../../components/Changeset';
@@ -242,6 +243,7 @@ export const ProjectOverview = () => {
                 args.input?.filter?.pinned ?? false
               }
             />
+            <ToggleCommentsButton loading={!project} />
             {project && <DeleteProject project={project} />}
           </header>
 

diff --git a/src/scenes/Root/MainLayout.tsx b/src/scenes/Root/MainLayout.tsx
@@ -1,6 +1,8 @@
 import { ErrorBoundary } from 'react-error-boundary';
-import { Outlet } from 'react-router-dom';
+import { Outlet, useParams } from 'react-router-dom';
 import { makeStyles } from 'tss-react/mui';
+import { firstValue } from '~/common';
+import { CommentsBar } from '~/components/Comments/CommentsBar';
 import { Error } from '../../components/Error';
 import { useAuthRequired } from '../Authentication';
 import { CreateDialogProviders } from './Creates';
@@ -22,6 +24,8 @@ const useStyles = makeStyles()(() => ({
 
 export const MainLayout = () => {
   useAuthRequired();
+  const resourceId = firstValue(useParams());
+
   const { classes } = useStyles();
   return (
     <div className={classes.root}>
@@ -30,6 +34,7 @@ export const MainLayout = () => {
       </CreateDialogProviders>
       <div className={classes.main}>
         <Header />
+        <CommentsBar resourceId={resourceId} />
         <ErrorBoundary fallback={<Error show page />}>
           <Outlet />
         </ErrorBoundary>

diff --git a/src/scenes/Users/Detail/UserDetail.tsx b/src/scenes/Users/Detail/UserDetail.tsx
@@ -10,6 +10,7 @@ import { makeStyles } from 'tss-react/mui';
 import { PartialDeep } from 'type-fest';
 import { RoleLabels } from '~/api/schema.graphql';
 import { canEditAny, labelsFrom } from '~/common';
+import { ToggleCommentsButton } from '~/components/Comments/ToggleCommentButton';
 import { useDialog } from '../../../components/Dialog';
 import {
   DisplaySimpleProperty,
@@ -98,6 +99,7 @@ export const UserDetail = () => {
                 args.input?.filter?.pinned ?? false
               }
             />
+            <ToggleCommentsButton loading={!user} />
             <ImpersonationToggle user={user} />
           </div>
           <DisplayProperty