Fix noResultsFound.

umami-software · Aug 15, 2023 · c3d0a1a · c3d0a1a
1 parent 14df1e5
commit c3d0a1a
Show file tree

Hide file tree

Showing 2 changed files with 61 additions and 61 deletions.
diff --git a/components/pages/settings/websites/WebsitesList.js b/components/pages/settings/websites/WebsitesList.js
@@ -29,7 +29,6 @@ export function WebsitesList({ showTeam, showHeader = true, includeTeams, onlyTe
     { enabled: !!user },
   );
   const { showToast } = useToasts();
-  const hasData = data && data.length !== 0;
 
   const handleSave = async () => {
     await refetch();
@@ -57,21 +56,14 @@ export function WebsitesList({ showTeam, showHeader = true, includeTeams, onlyTe
   return (
     <Page loading={isLoading} error={error}>
       {showHeader && <PageHeader title={formatMessage(labels.websites)}>{addButton}</PageHeader>}
-      {hasData && (
-        <WebsitesTable
-          data={data}
-          showTeam={showTeam}
-          onFilterChange={handleFilterChange}
-          onPageChange={handlePageChange}
-          onPageSizeChange={handlePageSizeChange}
-          filterValue={filter}
-        />
-      )}
-      {!hasData && (
-        <EmptyPlaceholder message={formatMessage(messages.noDataAvailable)}>
-          {addButton}
-        </EmptyPlaceholder>
-      )}
+      <WebsitesTable
+        data={data}
+        showTeam={showTeam}
+        onFilterChange={handleFilterChange}
+        onPageChange={handlePageChange}
+        onPageSizeChange={handlePageSizeChange}
+        filterValue={filter}
+      />
     </Page>
   );
 }

diff --git a/components/pages/settings/websites/WebsitesTable.js b/components/pages/settings/websites/WebsitesTable.js
@@ -1,3 +1,4 @@
+import EmptyPlaceholder from 'components/common/EmptyPlaceholder';
 import Link from 'next/link';
 import { Button, Text, Icon, Icons } from 'react-basics';
 import SettingsTable from 'components/common/SettingsTable';
@@ -13,10 +14,12 @@ export function WebsitesTable({
   onPageSizeChange,
   showTeam,
 }) {
-  const { formatMessage, labels } = useMessages();
+  const { formatMessage, labels, messages } = useMessages();
   const { openExternal } = useConfig();
   const { user } = useUser();
 
+  const showTable = data && (filterValue || data?.data.length !== 0);
+
   const teamColumns = [
     { name: 'teamName', label: formatMessage(labels.teamName) },
     { name: 'owner', label: formatMessage(labels.owner) },
@@ -30,51 +33,56 @@ export function WebsitesTable({
   ];
 
   return (
-    <SettingsTable
-      columns={columns}
-      data={data}
-      showSearch={true}
-      showPaging={true}
-      onFilterChange={onFilterChange}
-      onPageChange={onPageChange}
-      onPageSizeChange={onPageSizeChange}
-      filterValue={filterValue}
-    >
-      {row => {
-        const {
-          id,
-          teamWebsite,
-          user: { username, id: ownerId },
-        } = row;
-        if (showTeam) {
-          row.teamName = teamWebsite[0]?.team.name;
-          row.owner = username;
-        }
+    <>
+      {showTable && (
+        <SettingsTable
+          columns={columns}
+          data={data}
+          showSearch={true}
+          showPaging={true}
+          onFilterChange={onFilterChange}
+          onPageChange={onPageChange}
+          onPageSizeChange={onPageSizeChange}
+          filterValue={filterValue}
+        >
+          {row => {
+            const {
+              id,
+              teamWebsite,
+              user: { username, id: ownerId },
+            } = row;
+            if (showTeam) {
+              row.teamName = teamWebsite[0]?.team.name;
+              row.owner = username;
+            }
 
-        return (
-          <>
-            {(!showTeam || ownerId === user.id) && (
-              <Link href={`/settings/websites/${id}`}>
-                <Button>
-                  <Icon>
-                    <Icons.Edit />
-                  </Icon>
-                  <Text>{formatMessage(labels.edit)}</Text>
-                </Button>
-              </Link>
-            )}
-            <Link href={`/websites/${id}`} target={openExternal ? '_blank' : null}>
-              <Button>
-                <Icon>
-                  <Icons.External />
-                </Icon>
-                <Text>{formatMessage(labels.view)}</Text>
-              </Button>
-            </Link>
-          </>
-        );
-      }}
-    </SettingsTable>
+            return (
+              <>
+                {(!showTeam || ownerId === user.id) && (
+                  <Link href={`/settings/websites/${id}`}>
+                    <Button>
+                      <Icon>
+                        <Icons.Edit />
+                      </Icon>
+                      <Text>{formatMessage(labels.edit)}</Text>
+                    </Button>
+                  </Link>
+                )}
+                <Link href={`/websites/${id}`} target={openExternal ? '_blank' : null}>
+                  <Button>
+                    <Icon>
+                      <Icons.External />
+                    </Icon>
+                    <Text>{formatMessage(labels.view)}</Text>
+                  </Button>
+                </Link>
+              </>
+            );
+          }}
+        </SettingsTable>
+      )}
+      {!showTable && <EmptyPlaceholder message={formatMessage(messages.noDataAvailable)} />}
+    </>
   );
 }