ui(server): fix used backup count

resources/scripts/api/swr/getServerBackups.ts

@@ -12,16 +12,19 @@ interface ctx {
 
 export const Context = createContext<ctx>({ page: 1, setPage: () => 1 });
 
+type BackupResponse = PaginatedResult<ServerBackup> & { usedBackupCount: number };
+
 export default () => {
     const { page } = useContext(Context);
     const uuid = ServerContext.useStoreState(state => state.server.data!.uuid);
 
-    return useSWR<PaginatedResult<ServerBackup>>([ 'server:backups', uuid, page ], async () => {
+    return useSWR<BackupResponse>([ 'server:backups', uuid, page ], async () => {
         const { data } = await http.get(`/api/client/servers/${uuid}/backups`, { params: { page } });
 
         return ({
             items: (data.data || []).map(rawDataToServerBackup),
             pagination: getPaginationSet(data.meta.pagination),
+            usedBackupCount: data.meta.used_backup_count,
         });
     });
 };

resources/scripts/components/server/backups/BackupContainer.tsx

@@ -65,12 +65,12 @@ const BackupContainer = () => {
             }
             <Can action={'backup.create'}>
                 <div css={tw`mt-6 sm:flex items-center justify-end`}>
-                    {(backupLimit > 0 && backups.pagination.total > 0) &&
+                    {(backupLimit > 0 && backups.usedBackupCount > 0) &&
                     <p css={tw`text-sm text-neutral-300 mb-4 sm:mr-6 sm:mb-0`}>
-                        {backups.pagination.total} of {backupLimit} backups have been created for this server.
+                        {backups.usedBackupCount} of {backupLimit} backups have been created for this server.
                     </p>
                     }
-                    {backupLimit > 0 && backupLimit !== backups.pagination.total &&
+                    {backupLimit > 0 && backupLimit > backups.usedBackupCount &&
                     <CreateBackupButton css={tw`w-full sm:w-auto`}/>
                     }
                 </div>

resources/scripts/components/server/backups/BackupContextMenu.tsx

@@ -58,6 +58,7 @@ export default ({ backup }: Props) => {
             .then(() => mutate(data => ({
                 ...data,
                 items: data.items.filter(b => b.uuid !== backup.uuid),
+                usedBackupCount: data.usedBackupCount - 1,
             }), false))
             .catch(error => {
                 console.error(error);

resources/scripts/components/server/backups/CreateBackupButton.tsx

@@ -81,7 +81,7 @@ export default () => {
         clearFlashes('backups:create');
         createServerBackup(uuid, values)
             .then(backup => {
-                mutate(data => ({ ...data, items: data.items.concat(backup) }), false);
+                mutate(data => ({ ...data, items: data.items.concat(backup), usedBackupCount: data.usedBackupCount + 1 }), false);
                 setVisible(false);
             })
             .catch(error => {