Issue 1722/sub org survey read only

src/features/breadcrumbs/l10n/messageIds.ts

@@ -27,6 +27,7 @@ export default makeMessages('feat.breadcrumbs', {
     people: m('People'),
     projects: m('Projects'),
     questions: m('Questions'),
+    shared: m('Shared with us'),
     submissions: m('Submissions'),
     surveys: m('Surveys'),
     tasks: m('Tasks'),

src/features/campaigns/components/ActivitiesOverview/index.tsx

@@ -7,15 +7,18 @@ import messageIds from 'features/campaigns/l10n/messageIds';
 import useActivitiyOverview from 'features/campaigns/hooks/useActivityOverview';
 import ZUIEmptyState from 'zui/ZUIEmptyState';
 import ZUIFuture from 'zui/ZUIFuture';
+import { ActivityOverview, CampaignActivity } from 'features/campaigns/types';
 import { Msg, useMessages } from 'core/i18n';
 
 type ActivitiesOverviewProps = {
   campaignId?: number;
+  isShared?: boolean;
   orgId: number;
 };
 
 const ActivitiesOverview: FC<ActivitiesOverviewProps> = ({
   campaignId,
+  isShared,
   orgId,
 }) => {
   const messages = useMessages(messageIds);
@@ -25,6 +28,15 @@ const ActivitiesOverview: FC<ActivitiesOverviewProps> = ({
   const tomorrowDate = new Date();
   tomorrowDate.setDate(tomorrowDate.getDate() + 1);
 
+  const filterSharedSurveys = (items: CampaignActivity[]) => {
+    return items.filter(
+      (item) =>
+        item.kind === 'survey' &&
+        item.data.org_access === 'suborgs' &&
+        item.data.organization.id === orgId
+    );
+  };
+
   return (
     <>
       <Box
@@ -41,7 +53,7 @@ const ActivitiesOverview: FC<ActivitiesOverviewProps> = ({
         <Box>
           <NextLink
             href={`/organize/${orgId}/projects${
-              campaignId ? `/${campaignId}` : ''
+              campaignId ? `/${campaignId}` : isShared ? '/shared' : ''
             }/activities`}
             legacyBehavior
             passHref
@@ -53,7 +65,16 @@ const ActivitiesOverview: FC<ActivitiesOverviewProps> = ({
         </Box>
       </Box>
       <ZUIFuture future={activityOverview}>
-        {(data) => {
+        {(activities) => {
+          //It only filters shared surveys for now, but there will be more shared activities in the future.
+          const data: ActivityOverview = isShared
+            ? {
+                alsoThisWeek: filterSharedSurveys(activities.alsoThisWeek),
+                today: filterSharedSurveys(activities.today),
+                tomorrow: filterSharedSurveys(activities.tomorrow),
+              }
+            : activities;
+
           const totalLength =
             data.today.length + data.tomorrow.length + data.alsoThisWeek.length;
 

src/features/campaigns/l10n/messageIds.ts

@@ -142,6 +142,24 @@ export default makeMessages('feat.campaigns', {
     heading: m('Mobilization and outreach (none configured)'),
   },
   noManager: m('No Project Manager'),
+  shared: {
+    cta: m('Go to project'),
+    noArchives: m(
+      'All expired activities that have been shared with your organization will appear here.'
+    ),
+    title: m('Shared with us'),
+  },
+  sharedLayout: {
+    subtitle: m<{ numOfActivities: number }>(
+      '{numOfActivities, plural, =1 {1 activity} other {# activities}}'
+    ),
+    tabs: {
+      activities: m('Activities'),
+      archive: m('Archive'),
+      overview: m('Overview'),
+    },
+    title: m('Shared with us'),
+  },
   singleProject: {
     filterActivities: m('Type to filter'),
     noActivities: m('There are no activities in this project yet.'),

src/features/campaigns/layout/SharedActivitiesLayout.tsx

@@ -0,0 +1,71 @@
+import { AutoAwesomeMotionOutlined } from '@mui/icons-material';
+import { Box } from '@mui/material';
+import dayjs from 'dayjs';
+
+import messageIds from '../l10n/messageIds';
+import TabbedLayout from 'utils/layout/TabbedLayout';
+import useSurveys from 'features/surveys/hooks/useSurveys';
+import ZUIIconLabelRow from 'zui/ZUIIconLabelRow';
+import { Msg, useMessages } from 'core/i18n';
+
+interface SharedActivitiesLayout {
+  children: React.ReactNode;
+  orgId: string;
+}
+
+const SharedActivitiesLayout: React.FC<SharedActivitiesLayout> = ({
+  children,
+  orgId,
+}) => {
+  const messages = useMessages(messageIds);
+  const parsedOrgId = parseInt(orgId);
+  const surveys = useSurveys(parsedOrgId).data ?? [];
+
+  const sharedSurveys = surveys.filter(
+    (survey) =>
+      survey.org_access === 'suborgs' &&
+      survey.organization.id === parsedOrgId &&
+      !dayjs(survey.expires).isBefore(dayjs(), 'day')
+  );
+
+  return (
+    <TabbedLayout
+      baseHref={`/organize/${orgId}/projects/shared`}
+      defaultTab="/"
+      subtitle={
+        <Box alignItems="center" display="flex">
+          <Box display="flex" marginX={1}>
+            <ZUIIconLabelRow
+              iconLabels={[
+                {
+                  icon: <AutoAwesomeMotionOutlined />,
+                  label: (
+                    <Msg
+                      id={messageIds.sharedLayout.subtitle}
+                      values={{ numOfActivities: sharedSurveys.length }}
+                    />
+                  ),
+                },
+              ]}
+            />
+          </Box>
+        </Box>
+      }
+      tabs={[
+        { href: '/', label: messages.sharedLayout.tabs.overview() },
+        {
+          href: '/activities',
+          label: messages.sharedLayout.tabs.activities(),
+        },
+        {
+          href: '/archive',
+          label: messages.sharedLayout.tabs.archive(),
+        },
+      ]}
+      title={messages.sharedLayout.title()}
+    >
+      {children}
+    </TabbedLayout>
+  );
+};
+export default SharedActivitiesLayout;

src/features/import/components/ImportDialog/elements/ImpactSummary/index.tsx

@@ -6,7 +6,7 @@ import AddedTags from './AddedTags';
 import ChangedFields from './ChangedFields';
 import CreatedAndUpdated from './CreatedAndUpdated';
 import { PersonImportSummary } from 'features/import/utils/types';
-import useOrganizations from 'features/organizations/hooks/useOrganizations';
+import useSubOrganizations from 'features/organizations/hooks/useSubOrganizations';
 import useTags from 'features/tags/hooks/useTags';
 
 type Props = {
@@ -17,16 +17,17 @@ type Props = {
 
 const ImpactSummary: FC<Props> = ({ orgId, summary, tense }) => {
   const tags = useTags(orgId).data ?? [];
-  const organizations = useOrganizations().data ?? [];
+  const subOrgs = useSubOrganizations(orgId).data ?? [];
 
   const { addedToOrg, tagged } = summary;
 
   const addedTags = tags.filter((tag) =>
     Object.keys(tagged.byTag).includes(tag.id.toString())
   );
 
-  const orgsWithNewPeople = organizations.filter((org) =>
-    Object.keys(addedToOrg.byOrg).includes(org.id.toString())
+  const orgsWithNewPeople = subOrgs.filter(
+    (org) =>
+      Object.keys(addedToOrg.byOrg).includes(org.id.toString()) && org.is_active
   );
 
   return (

src/features/import/hooks/usePersonPreview.ts

@@ -1,6 +1,6 @@
 import createPreviewData from '../utils/createPreviewData';
 import { Sheet } from '../utils/types';
-import useOrganizations from 'features/organizations/hooks/useOrganizations';
+import useSubOrganizations from 'features/organizations/hooks/useSubOrganizations';
 import useTags from 'features/tags/hooks/useTags';
 import { ZetkinTag } from 'utils/types/zetkin';
 
@@ -10,8 +10,7 @@ export default function usePersonPreview(
   orgId: number
 ) {
   const allTags = useTags(orgId).data ?? [];
-  const organizations = useOrganizations().data ?? [];
-
+  const organizations = useSubOrganizations(orgId).data ?? [];
   const previewRow = createPreviewData(sheet, personIndex);
 
   const fields = previewRow?.data;

src/features/organizations/components/OrganizationsList.tsx

@@ -1,15 +1,14 @@
-import messageIds from 'features/organizations/l10n/messageIds';
 import NextLink from 'next/link';
-import { useMessages } from 'core/i18n';
-import useOrganizations from '../hooks/useOrganizations';
-import { ZetkinMembership } from 'utils/types/zetkin';
+import { Avatar, Box, Link, List, ListItem, Typography } from '@mui/material';
 
+import messageIds from 'features/organizations/l10n/messageIds';
+import useMemberships from '../hooks/useMemberships';
+import { useMessages } from 'core/i18n';
 import ZUIFuture from 'zui/ZUIFuture';
-import { Avatar, Box, Link, List, ListItem, Typography } from '@mui/material';
 
 const OrganizationsList = () => {
   const messages = useMessages(messageIds);
-  const organizations = useOrganizations();
+  const organizations = useMemberships();
 
   return (
     <ZUIFuture future={organizations}>
@@ -18,19 +17,22 @@ const OrganizationsList = () => {
           <Box style={{ margin: '30px' }}>
             <Typography variant="h3">{messages.page.title()}</Typography>
             <List>
-              {data?.map((org: ZetkinMembership['organization']) => {
+              {data?.map((membership) => {
+                const orgId = membership.organization.id;
                 return (
-                  <ListItem key={org.id}>
+                  <ListItem key={orgId}>
                     <Avatar
-                      src={`/api/orgs/${org.id}/avatar`}
+                      src={`/api/orgs/${orgId}/avatar`}
                       style={{ margin: '15px' }}
                     />
                     <NextLink
-                      href={`/organize/${org.id}`}
+                      href={`/organize/${orgId}`}
                       legacyBehavior
                       passHref
                     >
-                      <Link underline="hover">{org.title}</Link>
+                      <Link underline="hover">
+                        {membership.organization.title}
+                      </Link>
                     </NextLink>
                   </ListItem>
                 );

src/features/campaigns/hooks/useMemberships.ts → src/features/organizations/hooks/useMemberships.ts

@@ -1,18 +1,22 @@
 import { IFuture } from 'core/caching/futures';
 import { loadListIfNecessary } from 'core/caching/cacheUtils';
 import { ZetkinMembership } from 'utils/types/zetkin';
-import { membershipsLoad, membershipsLoaded } from 'features/user/store';
 import { useApiClient, useAppDispatch, useAppSelector } from 'core/hooks';
+import { userMembershipsLoad, userMembershipsLoaded } from '../store';
 
 export default function useMemberships(): IFuture<ZetkinMembership[]> {
   const apiClient = useApiClient();
   const dispatch = useAppDispatch();
-  const membershipList = useAppSelector((state) => state.user.membershipList);
+  const membershipList = useAppSelector(
+    (state) => state.organizations.userMembershipList
+  );
 
   return loadListIfNecessary(membershipList, dispatch, {
-    actionOnLoad: () => dispatch(membershipsLoad()),
-    actionOnSuccess: (data) => dispatch(membershipsLoaded(data)),
+    actionOnLoad: () => dispatch(userMembershipsLoad()),
+    actionOnSuccess: (data) => dispatch(userMembershipsLoaded(data)),
     loader: () =>
-      apiClient.get<ZetkinMembership[]>(`/api/users/me/memberships`),
+      apiClient
+        .get<ZetkinMembership[]>(`/api/users/me/memberships`)
+        .then((response) => response.filter((m) => m.role != null)),
   });
 }

src/features/organizations/store.ts

@@ -16,14 +16,14 @@ export interface OrganizationsStoreSlice {
   orgData: RemoteItem<ZetkinOrganization>;
   subOrgsByOrgId: Record<number, RemoteList<ZetkinSubOrganization>>;
   treeDataList: RemoteList<TreeItemData>;
-  userOrgList: RemoteList<ZetkinMembership['organization']>;
+  userMembershipList: RemoteList<ZetkinMembership & { id: number }>;
 }
 
 const initialState: OrganizationsStoreSlice = {
   orgData: remoteItem(0),
   subOrgsByOrgId: {},
   treeDataList: remoteList(),
-  userOrgList: remoteList(),
+  userMembershipList: remoteList(),
 };
 
 const OrganizationsSlice = createSlice({
@@ -67,18 +67,21 @@ const OrganizationsSlice = createSlice({
       state.treeDataList.loaded = new Date().toISOString();
       state.treeDataList.isLoading = false;
     },
-    userOrganizationsLoad: (state) => {
-      state.userOrgList.isLoading = true;
+    userMembershipsLoad: (state) => {
+      state.userMembershipList.isLoading = true;
     },
-    userOrganizationsLoaded: (
+    userMembershipsLoaded: (
       state,
-      action: PayloadAction<ZetkinMembership['organization'][]>
+      action: PayloadAction<ZetkinMembership[]>
     ) => {
-      const organizationsList = action.payload;
-
-      state.userOrgList = remoteList(organizationsList);
-      state.userOrgList.loaded = new Date().toISOString();
-      state.userOrgList.isLoading = false;
+      const memberships = action.payload;
+      const membershipsWithIds = memberships.map((membership) => ({
+        ...membership,
+        id: membership.organization.id,
+      }));
+      state.userMembershipList = remoteList(membershipsWithIds);
+      state.userMembershipList.loaded = new Date().toISOString();
+      state.userMembershipList.isLoading = false;
     },
   },
 });
@@ -91,6 +94,6 @@ export const {
   treeDataLoaded,
   subOrgsLoad,
   subOrgsLoaded,
-  userOrganizationsLoad,
-  userOrganizationsLoaded,
+  userMembershipsLoad,
+  userMembershipsLoaded,
 } = OrganizationsSlice.actions;