style: CR adjustments

golemfoundation · Oct 4, 2024 · 54f6195 · 54f6195
1 parent 6be5ddf
commit 54f6195
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 11 deletions.
diff --git a/client/src/components/Projects/ProjectsList/ProjectsList.module.scss b/client/src/components/Projects/ProjectsList/ProjectsList.module.scss
@@ -1,5 +1,3 @@
-$elementMargin: 1.6rem;
-
 .list {
   display: flex;
   flex-wrap: wrap;

diff --git a/client/src/components/Projects/ProjectsSearchResults/ProjectsSearchResults.tsx b/client/src/components/Projects/ProjectsSearchResults/ProjectsSearchResults.tsx
@@ -61,7 +61,8 @@ const ProjectsSearchResults: FC<ProjectsSearchResultsProps> = ({
               }
             />
           ))}
-        {isLoading &&
+        {projectsIpfsWithRewardsAndEpochs.length === 0 &&
+          isLoading &&
           [...Array(5).keys()].map((_, index) => (
             // eslint-disable-next-line react/no-array-index-key
             <ProjectsListSkeletonItem key={index} className={styles.element} />

diff --git a/client/src/hooks/queries/useSearchedProjectsDetails.ts b/client/src/hooks/queries/useSearchedProjectsDetails.ts
@@ -69,8 +69,8 @@ export default function useSearchedProjectsDetails(
 
   return {
     data: queries.map(({ data }) => {
-      const rewards = data && data[1] ? data[1].rewards : [];
-      const address = data && data[4] ? data[4] : undefined;
+      const rewards = data?.[1]?.rewards ?? [];
+      const address = data?.[4];
       const rewardsOfProject = rewards.find(element => element.address === address);
       const rewardsOfProjectMatched = rewardsOfProject
         ? parseUnitsBigInt(rewardsOfProject.matched, 'wei')
@@ -80,13 +80,13 @@ export default function useSearchedProjectsDetails(
         : BigInt(0);
 
       return {
-        address: data && data[4] ? data[4] : undefined,
+        address,
         donations: rewardsOfProjectAllocated,
-        epoch: data && data[3] ? data[3] : undefined,
+        epoch: data?.[3],
         matchedRewards: rewardsOfProjectMatched,
-        numberOfDonors: data && data[2] ? data[2].length : 0,
+        numberOfDonors: data?.[2].length ?? 0,
         totalValueOfAllocations: rewardsOfProjectMatched + rewardsOfProjectAllocated,
-        ...(data && data[0] ? data[0] : {}),
+        ...(data?.[0] ?? {}),
       };
     }),
     isFetching: false,

diff --git a/client/src/views/ProjectsView/ProjectsView.tsx b/client/src/views/ProjectsView/ProjectsView.tsx
@@ -43,6 +43,8 @@ const ProjectsView = (): ReactElement => {
   const { data: currentEpoch } = useCurrentEpoch();
 
   const [searchQuery, setSearchQuery] = useState<string>('');
+  // Helper hook, because actual fetch is called after debounce. Until then, loading state.
+  const [isProjectsSearchInProgress, setIsProjectsSearchInProgress] = useState<boolean>(false);
   const [projectsSearchParameters, setProjectsSearchParameters] = useState<
     ProjectsSearchParameters | undefined
   >(undefined);
@@ -79,6 +81,13 @@ const ProjectsView = (): ReactElement => {
     isFetching: isFetchingSearchedProjectsDetails,
   } = useSearchedProjectsDetails(searchedProjects);
 
+  useEffect(() => {
+    if (isFetchingSearchedProjects || isFetchingSearchedProjectsDetails) {
+      return;
+    }
+    setIsProjectsSearchInProgress(false);
+  }, [isFetchingSearchedProjects, isFetchingSearchedProjectsDetails]);
+
   useEffect(() => {
     // Refetch is not required when no data already fetched.
     if (statusSearchedProjects !== 'success') {
@@ -137,6 +146,10 @@ const ProjectsView = (): ReactElement => {
     const query = e.target.value;
     setSearchQuery(query);
     setProjectsDetailsSearchParametersWrapperDebounced(query);
+
+    if (query !== '') {
+      setIsProjectsSearchInProgress(true);
+    }
   };
 
   const lastArchivedEpochNumber = useMemo(() => {
@@ -188,7 +201,13 @@ const ProjectsView = (): ReactElement => {
   return (
     <>
       <ViewTitle className={styles.viewTitle}>
-        {t('viewTitle', { epochNumber: currentEpoch })}
+        {t('viewTitle', {
+          epochNumber:
+            isDecisionWindowOpen ||
+            (!isDecisionWindowOpen && areCurrentEpochsProjectsHiddenOutsideAllocationWindow)
+              ? currentEpoch! - 1
+              : currentEpoch,
+        })}
       </ViewTitle>
       <div className={styles.searchAndFilter}>
         <InputText
@@ -225,7 +244,7 @@ const ProjectsView = (): ReactElement => {
       )}
       {searchQuery !== '' && (
         <ProjectsSearchResults
-          isLoading={isFetchingSearchedProjects || isFetchingSearchedProjectsDetails}
+          isLoading={isProjectsSearchInProgress}
           orderOption={orderOption}
           projectsIpfsWithRewardsAndEpochs={searchedProjectsDetails}
         />