refactor(web): admin layout (#4461)

web/src/routes/admin/jobs-status/+page.svelte

@@ -1,7 +1,14 @@
 <script lang="ts">
   import JobsPanel from '$lib/components/admin-page/jobs/jobs-panel.svelte';
+  import LinkButton from '$lib/components/elements/buttons/link-button.svelte';
+  import UserPageLayout from '$lib/components/layouts/user-page-layout.svelte';
+  import { AppRoute } from '$lib/constants';
   import { AllJobStatusResponseDto, api } from '@api';
   import { onDestroy, onMount } from 'svelte';
+  import CogIcon from 'svelte-material-icons/Cog.svelte';
+  import type { PageData } from './$types';
+
+  export let data: PageData;
 
   let timer: ReturnType<typeof setInterval>;
 
@@ -22,6 +29,22 @@
   });
 </script>
 
-{#if jobs}
-  <JobsPanel {jobs} />
-{/if}
+<UserPageLayout user={data.user} title={data.meta.title} admin>
+  <div class="flex justify-end" slot="buttons">
+    <a href="{AppRoute.ADMIN_SETTINGS}?open=job-settings">
+      <LinkButton>
+        <div class="flex place-items-center gap-2 text-sm">
+          <CogIcon size="18" />
+          Manage Concurrency
+        </div>
+      </LinkButton>
+    </a>
+  </div>
+  <section id="setting-content" class="flex place-content-center sm:mx-4">
+    <section class="w-full pb-28 sm:w-5/6 md:w-[850px]">
+      {#if jobs}
+        <JobsPanel {jobs} />
+      {/if}
+    </section>
+  </section>
+</UserPageLayout>