9599751225

Committed 20 Jun 2024 02:57PM UTC coverage: 15.056% (-0.07%) from 15.126%

Build # 9599751225

Build Type

Pull #8148

github

Committed by

web-flow

Commit Message

Merge df3afcfed into 7eb563cda

Pull Request Pull Request #8148: Update user activity feed queries

Run Details

3748 of 25148 branches covered (14.9%)

Branch coverage included in aggregate %.

0 of 6 new or added lines in 1 file covered. (0.0%)

12 existing lines in 5 files now uncovered.

5178 of 34138 relevant lines covered (15.17%)

4.89 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

0.0

/packages/commonwealth/client/scripts/views/pages/discussions/DiscussionsPage.tsx

import React, { useRef, useState } from 'react';
import { useSearchParams } from 'react-router-dom';
import { Virtuoso } from 'react-virtuoso';

import useUserActiveAccount from 'hooks/useUserActiveAccount';
import { getProposalUrlPath } from 'identifiers';
import { getScopePrefix, useCommonNavigate } from 'navigation/helpers';
import useFetchThreadsQuery, {
  useDateCursor,
} from 'state/api/threads/fetchThreads';
import useEXCEPTION_CASE_threadCountersStore from 'state/ui/thread';
import {
  ThreadFeaturedFilterTypes,
  ThreadTimelineFilterTypes,
} from '../../../models/types';
import app from '../../../state';
import { useFetchTopicsQuery } from '../../../state/api/topics';
import { Breadcrumbs } from '../../components/Breadcrumbs';
import { HeaderWithFilters } from './HeaderWithFilters';
import { ThreadCard } from './ThreadCard';
import { sortByFeaturedFilter, sortPinned } from './helpers';

import { slugify } from '@hicommonwealth/shared';
import { getThreadActionTooltipText } from 'helpers/threads';
import useBrowserWindow from 'hooks/useBrowserWindow';
import { useFlag } from 'hooks/useFlag';
import useManageDocumentTitle from 'hooks/useManageDocumentTitle';
import 'pages/discussions/index.scss';
import { useRefreshMembershipQuery } from 'state/api/groups';
import Permissions from 'utils/Permissions';
import { checkIsTopicInContest } from 'views/components/NewThreadForm/helpers';
import CWPageLayout from 'views/components/component_kit/new_designs/CWPageLayout';
import useCommunityContests from 'views/pages/CommunityManagement/Contests/useCommunityContests';
import { AdminOnboardingSlider } from '../../components/AdminOnboardingSlider';
import { UserTrainingSlider } from '../../components/UserTrainingSlider';
import { DiscussionsFeedDiscovery } from './DiscussionsFeedDiscovery';
import { EmptyThreadsPlaceholder } from './EmptyThreadsPlaceholder';

type DiscussionsPageProps = {
  topicName?: string;
};

const DiscussionsPage = ({ topicName }: DiscussionsPageProps) => {
  const userOnboardingEnabled = useFlag('userOnboardingEnabled');
  const communityId = app.activeChainId();
  const navigate = useCommonNavigate();
  const { totalThreadsInCommunity } = useEXCEPTION_CASE_threadCountersStore();
  const [includeSpamThreads, setIncludeSpamThreads] = useState<boolean>(false);
  const [includeArchivedThreads, setIncludeArchivedThreads] =
    useState<boolean>(false);
  const [searchParams] = useSearchParams();
  // @ts-expect-error <StrictNullChecks/>
  const stageName: string = searchParams.get('stage');
  const featuredFilter: ThreadFeaturedFilterTypes = searchParams.get(
    'featured',
  ) as ThreadFeaturedFilterTypes;
  const dateRange: ThreadTimelineFilterTypes = searchParams.get(
    'dateRange',
  ) as ThreadTimelineFilterTypes;
  const { data: topics } = useFetchTopicsQuery({
    communityId,
  });
  const contestAddress = searchParams.get('contest');
  const contestStatus = searchParams.get('status');

  const containerRef = useRef();

  useBrowserWindow({});

  const isAdmin = Permissions.isSiteAdmin() || Permissions.isCommunityAdmin();

  const topicId = (topics || []).find(({ name }) => name === topicName)?.id;

  const { data: memberships = [] } = useRefreshMembershipQuery({
    communityId: communityId,
    address: app?.user?.activeAccount?.address,
    apiEnabled: !!app?.user?.activeAccount?.address,
  });

  const { contestsData } = useCommunityContests();

  const { activeAccount: hasJoinedCommunity } = useUserActiveAccount();

  const { dateCursor } = useDateCursor({
    dateRange: searchParams.get('dateRange') as ThreadTimelineFilterTypes,
  });

  const isOnArchivePage =
    location.pathname ===
    (app.isCustomDomain() ? `/archived` : `/${app.activeChainId()}/archived`);

  const { fetchNextPage, data, isInitialLoading, hasNextPage } =
    useFetchThreadsQuery({
      communityId: app.activeChainId(),
      queryType: 'bulk',
      page: 1,
      limit: 20,
      topicId,
      stage: stageName ?? undefined,
      includePinnedThreads: true,
      ...(featuredFilter && {
        orderBy: featuredFilter,
      }),
      toDate: dateCursor.toDate,
      // @ts-expect-error <StrictNullChecks/>
      fromDate: dateCursor.fromDate,
      isOnArchivePage: isOnArchivePage,
      // @ts-expect-error <StrictNullChecks/>
      contestAddress,
      // @ts-expect-error <StrictNullChecks/>
      contestStatus,
    });

  const threads = sortPinned(sortByFeaturedFilter(data || [], featuredFilter));

  // Checks if the current page is a discussion page and if the window is small enough to render the mobile menu
  // Checks both for mobile device and inner window size for desktop responsiveness
  const filteredThreads = threads.filter((t) => {
    if (!includeSpamThreads && t.markedAsSpamAt) return null;

    if (!isOnArchivePage && !includeArchivedThreads && t.archivedAt)
      return null;

    if (isOnArchivePage && !t.archivedAt) return null;

    return t;
  });

  useManageDocumentTitle('Discussions');

  return (
    // @ts-expect-error <StrictNullChecks/>
    <CWPageLayout ref={containerRef} className="DiscussionsPageLayout">
      <DiscussionsFeedDiscovery
        orderBy={featuredFilter}
        community={communityId}
        includePinnedThreads={true}
      />
      <Virtuoso
        className="thread-list"
        style={{ height: '100%', width: '100%' }}
        data={isInitialLoading ? [] : filteredThreads}
        customScrollParent={containerRef.current}
        itemContent={(i, thread) => {
          const discussionLink = getProposalUrlPath(
            thread.slug,
            `${thread.identifier}-${slugify(thread.title)}`,
          );

          const isTopicGated = !!(memberships || []).find((membership) =>
            membership.topicIds.includes(thread?.topic?.id),
          );

          const isActionAllowedInGatedTopic = !!(memberships || []).find(
            (membership) =>
              membership.topicIds.includes(thread?.topic?.id) &&
              membership.isAllowed,
          );

          const isRestrictedMembership =
            !isAdmin && isTopicGated && !isActionAllowedInGatedTopic;

          const disabledActionsTooltipText = getThreadActionTooltipText({
            isCommunityMember: !!hasJoinedCommunity,
            isThreadArchived: !!thread?.archivedAt,
            isThreadLocked: !!thread?.lockedAt,
            isThreadTopicGated: isRestrictedMembership,
          });

          const isTopicInContest = checkIsTopicInContest(
            contestsData,
            thread?.topic?.id,
          );

          return (
            <ThreadCard
              key={thread?.id + '-' + thread.readOnly}
              thread={thread}
              canReact={!disabledActionsTooltipText}
              canComment={!disabledActionsTooltipText}
              onEditStart={() => navigate(`${discussionLink}`)}
              onStageTagClick={() => {
                navigate(`/discussions?stage=${thread.stage}`);
              }}
              threadHref={`${getScopePrefix()}${discussionLink}`}
              onBodyClick={() => {
                const scrollEle = document.getElementsByClassName('Body')[0];

                localStorage[`${communityId}-discussions-scrollY`] =
                  scrollEle.scrollTop;
              }}
              onCommentBtnClick={() =>
                navigate(`${discussionLink}?focusComments=true`)
              }
              disabledActionsTooltipText={disabledActionsTooltipText}
              hideRecentComments
              editingDisabled={isTopicInContest}
            />
          );
        }}
        endReached={() => {
          hasNextPage && fetchNextPage();
        }}
        overscan={50}
        components={{
          // eslint-disable-next-line react/no-multi-comp
          EmptyPlaceholder: () => (
            <EmptyThreadsPlaceholder
              isInitialLoading={isInitialLoading}
              isOnArchivePage={isOnArchivePage}
            />
          ),
          // eslint-disable-next-line react/no-multi-comp
          Header: () => (
            <>
              <Breadcrumbs />
              {userOnboardingEnabled && <UserTrainingSlider />}
              <AdminOnboardingSlider />
              <HeaderWithFilters
                // @ts-expect-error <StrictNullChecks/>
                topic={topicName}
                stage={stageName}
                featuredFilter={featuredFilter}
                dateRange={dateRange}
                totalThreadCount={
                  isOnArchivePage
                    ? filteredThreads.length || 0
                    : threads
                    ? totalThreadsInCommunity
                    : 0
                }
                isIncludingSpamThreads={includeSpamThreads}
                onIncludeSpamThreads={setIncludeSpamThreads}
                isIncludingArchivedThreads={includeArchivedThreads}
                onIncludeArchivedThreads={setIncludeArchivedThreads}
                isOnArchivePage={isOnArchivePage}
              />
            </>
          ),
        }}
      />
    </CWPageLayout>
  );
};

export default DiscussionsPage;

1	import React, { useRef, useState } from 'react';
2	import { useSearchParams } from 'react-router-dom';
3	import { Virtuoso } from 'react-virtuoso';
4
5	import useUserActiveAccount from 'hooks/useUserActiveAccount';
6	import { getProposalUrlPath } from 'identifiers';
7	import { getScopePrefix, useCommonNavigate } from 'navigation/helpers';
8	import useFetchThreadsQuery, {
9	useDateCursor,
10	} from 'state/api/threads/fetchThreads';
11	import useEXCEPTION_CASE_threadCountersStore from 'state/ui/thread';
12	import {
13	ThreadFeaturedFilterTypes,
14	ThreadTimelineFilterTypes,
15	} from '../../../models/types';
16	import app from '../../../state';
17	import { useFetchTopicsQuery } from '../../../state/api/topics';
18	import { Breadcrumbs } from '../../components/Breadcrumbs';
19	import { HeaderWithFilters } from './HeaderWithFilters';
20	import { ThreadCard } from './ThreadCard';
21	import { sortByFeaturedFilter, sortPinned } from './helpers';
22
23	import { slugify } from '@hicommonwealth/shared';
24	import { getThreadActionTooltipText } from 'helpers/threads';
25	import useBrowserWindow from 'hooks/useBrowserWindow';
26	import { useFlag } from 'hooks/useFlag';
27	import useManageDocumentTitle from 'hooks/useManageDocumentTitle';
28	import 'pages/discussions/index.scss';
29	import { useRefreshMembershipQuery } from 'state/api/groups';
30	import Permissions from 'utils/Permissions';
31	import { checkIsTopicInContest } from 'views/components/NewThreadForm/helpers';
32	import CWPageLayout from 'views/components/component_kit/new_designs/CWPageLayout';
33	import useCommunityContests from 'views/pages/CommunityManagement/Contests/useCommunityContests';
34	import { AdminOnboardingSlider } from '../../components/AdminOnboardingSlider';
35	import { UserTrainingSlider } from '../../components/UserTrainingSlider';
36	import { DiscussionsFeedDiscovery } from './DiscussionsFeedDiscovery';
37	import { EmptyThreadsPlaceholder } from './EmptyThreadsPlaceholder';
38
39	type DiscussionsPageProps = {
40	topicName?: string;
41	};
42
43	const DiscussionsPage = ({ topicName }: DiscussionsPageProps) => {	×
44	const userOnboardingEnabled = useFlag('userOnboardingEnabled');	×
45	const communityId = app.activeChainId();	×
46	const navigate = useCommonNavigate();	×
47	const { totalThreadsInCommunity } = useEXCEPTION_CASE_threadCountersStore();
48	const [includeSpamThreads, setIncludeSpamThreads] = useState<boolean>(false);	×
49	const [includeArchivedThreads, setIncludeArchivedThreads] =
50	useState<boolean>(false);
51	const [searchParams] = useSearchParams();	×
52	// @ts-expect-error <StrictNullChecks/>
53	const stageName: string = searchParams.get('stage');
54	const featuredFilter: ThreadFeaturedFilterTypes = searchParams.get(
55	'featured',
56	) as ThreadFeaturedFilterTypes;
57	const dateRange: ThreadTimelineFilterTypes = searchParams.get(
58	'dateRange',
59	) as ThreadTimelineFilterTypes;
60	const { data: topics } = useFetchTopicsQuery({
61	communityId,
62	});
63	const contestAddress = searchParams.get('contest');
64	const contestStatus = searchParams.get('status');	×
65
66	const containerRef = useRef();	×
67
68	useBrowserWindow({});	×
69
70	const isAdmin = Permissions.isSiteAdmin() \|\| Permissions.isCommunityAdmin();	×
71
72	const topicId = (topics \|\| []).find(({ name }) => name === topicName)?.id;	×
73
74	const { data: memberships = [] } = useRefreshMembershipQuery({	×
75	communityId: communityId,
76	address: app?.user?.activeAccount?.address,
77	apiEnabled: !!app?.user?.activeAccount?.address,
78	});
79
80	const { contestsData } = useCommunityContests();	×
81
82	const { activeAccount: hasJoinedCommunity } = useUserActiveAccount();
83
84	const { dateCursor } = useDateCursor({
85	dateRange: searchParams.get('dateRange') as ThreadTimelineFilterTypes,
86	});	×
87
88	const isOnArchivePage =
89	location.pathname ===	×
90	(app.isCustomDomain() ? `/archived` : `/${app.activeChainId()}/archived`);	×
91
92	const { fetchNextPage, data, isInitialLoading, hasNextPage } =
93	useFetchThreadsQuery({
94	communityId: app.activeChainId(),
95	queryType: 'bulk',	×
96	page: 1,
97	limit: 20,	×
98	topicId,
99	stage: stageName ?? undefined,	×
100	includePinnedThreads: true,
101	...(featuredFilter && {	×
102	orderBy: featuredFilter,
103	}),
104	toDate: dateCursor.toDate,
105	// @ts-expect-error <StrictNullChecks/>
106	fromDate: dateCursor.fromDate,
107	isOnArchivePage: isOnArchivePage,
108	// @ts-expect-error <StrictNullChecks/>
109	contestAddress,
110	// @ts-expect-error <StrictNullChecks/>
111	contestStatus,	×
112	});
113
114	const threads = sortPinned(sortByFeaturedFilter(data \|\| [], featuredFilter));	×
115
116	// Checks if the current page is a discussion page and if the window is small enough to render the mobile menu	×
117	// Checks both for mobile device and inner window size for desktop responsiveness
118	const filteredThreads = threads.filter((t) => {	×
UNCOV 119	if (!includeSpamThreads && t.markedAsSpamAt) return null;	×
120
UNCOV 121	if (!isOnArchivePage && !includeArchivedThreads && t.archivedAt)	×
122	return null;
123
124	if (isOnArchivePage && !t.archivedAt) return null;	×
125
UNCOV 126	return t;	×
127	});
128
129	useManageDocumentTitle('Discussions');
130
131	return (
132	// @ts-expect-error <StrictNullChecks/>
133	<CWPageLayout ref={containerRef} className="DiscussionsPageLayout">
134	<DiscussionsFeedDiscovery
135	orderBy={featuredFilter}
136	community={communityId}
137	includePinnedThreads={true}
138	/>
139	<Virtuoso	×
140	className="thread-list"
141	style={{ height: '100%', width: '100%' }}
142	data={isInitialLoading ? [] : filteredThreads}	×
143	customScrollParent={containerRef.current}
144	itemContent={(i, thread) => {
145	const discussionLink = getProposalUrlPath(
146	thread.slug,
147	`${thread.identifier}-${slugify(thread.title)}`,	×
148	);
149
150	const isTopicGated = !!(memberships \|\| []).find((membership) =>	×
UNCOV 151	membership.topicIds.includes(thread?.topic?.id),	×
152	);
153		×
154	const isActionAllowedInGatedTopic = !!(memberships \|\| []).find(	×
155	(membership) =>
156	membership.topicIds.includes(thread?.topic?.id) &&	×
157	membership.isAllowed,
158	);	×
159
160	const isRestrictedMembership =
161	!isAdmin && isTopicGated && !isActionAllowedInGatedTopic;	×
162
163	const disabledActionsTooltipText = getThreadActionTooltipText({
164	isCommunityMember: !!hasJoinedCommunity,
165	isThreadArchived: !!thread?.archivedAt,
166	isThreadLocked: !!thread?.lockedAt,
167	isThreadTopicGated: isRestrictedMembership,
168	});
169
170	const isTopicInContest = checkIsTopicInContest(
171	contestsData,
172	thread?.topic?.id,
173	);
174
UNCOV 175	return (	×
176	<ThreadCard
177	key={thread?.id + '-' + thread.readOnly}
178	thread={thread}
179	canReact={!disabledActionsTooltipText}
180	canComment={!disabledActionsTooltipText}
UNCOV 181	onEditStart={() => navigate(`${discussionLink}`)}	×
182	onStageTagClick={() => {
183	navigate(`/discussions?stage=${thread.stage}`);
184	}}
185	threadHref={`${getScopePrefix()}${discussionLink}`}
186	onBodyClick={() => {
187	const scrollEle = document.getElementsByClassName('Body')[0];
188
189	localStorage[`${communityId}-discussions-scrollY`] =
190	scrollEle.scrollTop;
191	}}
192	onCommentBtnClick={() =>	×
193	navigate(`${discussionLink}?focusComments=true`)
194	}
195	disabledActionsTooltipText={disabledActionsTooltipText}
196	hideRecentComments
197	editingDisabled={isTopicInContest}
198	/>
199	);
200	}}
201	endReached={() => {
202	hasNextPage && fetchNextPage();	×
203	}}
204	overscan={50}
205	components={{
206	// eslint-disable-next-line react/no-multi-comp
207	EmptyPlaceholder: () => (	×
208	<EmptyThreadsPlaceholder
209	isInitialLoading={isInitialLoading}
210	isOnArchivePage={isOnArchivePage}
211	/>
212	),
213	// eslint-disable-next-line react/no-multi-comp
214	Header: () => (
215	<>
216	<Breadcrumbs />	×
217	{userOnboardingEnabled && <UserTrainingSlider />}	×
218	<AdminOnboardingSlider />	×
219	<HeaderWithFilters
220	// @ts-expect-error <StrictNullChecks/>
221	topic={topicName}
222	stage={stageName}
223	featuredFilter={featuredFilter}
224	dateRange={dateRange}
225	totalThreadCount={
226	isOnArchivePage	×
227	? filteredThreads.length \|\| 0	×
228	: threads	×
229	? totalThreadsInCommunity
230	: 0
231	}
232	isIncludingSpamThreads={includeSpamThreads}
233	onIncludeSpamThreads={setIncludeSpamThreads}
234	isIncludingArchivedThreads={includeArchivedThreads}
235	onIncludeArchivedThreads={setIncludeArchivedThreads}
236	isOnArchivePage={isOnArchivePage}
237	/>
238	</>
239	),
240	}}
241	/>
242	</CWPageLayout>
243	);
244	};
245
246	export default DiscussionsPage;

hicommonwealth / commonwealth / 9599751225

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous