Code cleanup.

components/pages/settings/teams/TeamWebsitesTable.js

@@ -55,11 +55,7 @@ export function TeamWebsitesTable({
               </Button>
             </Link>
             {canRemove && (
-              <TeamWebsiteRemoveButton
-                teamId={teamId}
-                websiteId={websiteId}
-                onSave={onSave}
-              ></TeamWebsiteRemoveButton>
+              <TeamWebsiteRemoveButton teamId={teamId} websiteId={websiteId} onSave={onSave} />
             )}
           </>
         );

components/pages/settings/users/UserWebsites.js

@@ -1,24 +1,25 @@
+import Page from 'components/layout/Page';
 import useApi from 'hooks/useApi';
 import WebsitesTable from 'components/pages/settings/websites/WebsitesTable';
-import useMessages from 'hooks/useMessages';
 import useApiFilter from 'hooks/useApiFilter';
 
 export function UserWebsites({ userId }) {
-  const { formatMessage, messages } = useMessages();
   const { filter, page, pageSize, handleFilterChange, handlePageChange, handlePageSizeChange } =
     useApiFilter();
   const { get, useQuery } = useApi();
-  const { data, isLoading } = useQuery(['user:websites', userId, filter, page, pageSize], () =>
-    get(`/users/${userId}/websites`, {
-      filter,
-      page,
-      pageSize,
-    }),
+  const { data, isLoading, error } = useQuery(
+    ['user:websites', userId, filter, page, pageSize],
+    () =>
+      get(`/users/${userId}/websites`, {
+        filter,
+        page,
+        pageSize,
+      }),
   );
   const hasData = data && data.length !== 0;
 
   return (
-    <div>
+    <Page loading={isLoading} error={error}>
       {hasData && (
         <WebsitesTable
           data={data}
@@ -28,8 +29,7 @@ export function UserWebsites({ userId }) {
           filterValue={filter}
         />
       )}
-      {!hasData && formatMessage(messages.noDataAvailable)}
-    </div>
+    </Page>
   );
 }
 

components/pages/settings/websites/WebsitesTable.js

@@ -1,7 +1,7 @@
-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';
+import Empty from 'components/common/Empty';
 import useMessages from 'hooks/useMessages';
 import useConfig from 'hooks/useConfig';
 import useUser from 'hooks/useUser';
@@ -15,7 +15,7 @@ export function WebsitesTable({
   showTeam,
   showEditButton,
 }) {
-  const { formatMessage, labels, messages } = useMessages();
+  const { formatMessage, labels } = useMessages();
   const { openExternal } = useConfig();
   const { user } = useUser();
 
@@ -82,7 +82,7 @@ export function WebsitesTable({
           }}
         </SettingsTable>
       )}
-      {!showTable && <EmptyPlaceholder message={formatMessage(messages.noDataAvailable)} />}
+      {!showTable && <Empty />}
     </>
   );
 }