feat: implement visibility control for monitors

- Private monitors are visible only to logged-in users
- Public monitors are accessible to all

src/lib/components/manage/homePage.svelte

@@ -259,7 +259,8 @@
       ...categories,
       {
         name: "",
-        description: ""
+        description: "",
+        visibility: true
       }
     ];
   }
@@ -652,8 +653,8 @@
   <Card.Content>
     <form class="mx-auto mt-4 space-y-4" on:submit|preventDefault={formSubmitCategories}>
       {#each categories as cat, i}
-        <div class="grid grid-cols-4 gap-2">
-          <div class="col-span-1">
+        <div class="flex items-center gap-4">
+          <div class="flex-1">
             <Label for="{i}catkey" class="block w-full">Name</Label>
             <Input
               bind:value={cat.name}
@@ -664,7 +665,7 @@
               disabled={i === 0}
             />
           </div>
-          <div class="relative col-span-3 pr-8">
+          <div class="flex-1">
             <Label for="{i}catdsc" class="block w-full">Description</Label>
             <Input
               bind:value={cat.description}
@@ -674,9 +675,26 @@
               placeholder="Category Description"
               disabled={i === 0}
             />
+          </div>
+          <div class="relative flex items-center mt-4">
+            <DropdownMenu.Root>
+              <DropdownMenu.Trigger disabled={i === 0}>
+                <Button variant="outline" class="mr-2" disabled={i === 0}>
+                  {cat.visibility ? "Public" : "Private"}
+                </Button>
+              </DropdownMenu.Trigger>
+              <DropdownMenu.Content>
+                <DropdownMenu.Group>
+                  <DropdownMenu.Item on:click={() => (cat.visibility = false)} disabled={i === 0}>Private</DropdownMenu.Item>
+                  <DropdownMenu.Item on:click={() => (cat.visibility = true)} disabled={i === 0}>Public</DropdownMenu.Item>
+                </DropdownMenu.Group>
+              </DropdownMenu.Content>
+            </DropdownMenu.Root>
+          </div>
+          <div class="flex items-center">
             <Button
               variant="ghost"
-              class="absolute right-0 top-8 ml-2 h-6 w-6 p-1 "
+              class="h-6 w-6 p-1"
               disabled={i === 0}
               on:click={() => (categories = categories.filter((_, index) => index !== i))}
             >

src/routes/(kener)/+page.server.js

@@ -3,6 +3,8 @@ import { FetchData } from "$lib/server/page";
 import { GetMonitors, GetIncidentsOpenHome, SystemDataMessage } from "$lib/server/controllers/controller.js";
 import { SortMonitor } from "$lib/clientTools.js";
 import moment from "moment";
+import { page } from "$app/stores";
+import { redirect, error } from '@sveltejs/kit';
 
 function removeTags(str) {
   if (str === null || str === "") return false;
@@ -150,6 +152,9 @@ export async function load({ parent, url }) {
     let allCategories = siteData.categories;
     let selectedCategory = allCategories.find((category) => category.name === query.get("category"));
     if (selectedCategory) {
+      if (!selectedCategory.visibility && !parentData.isLoggedIn) {
+        throw redirect(303, '/manage/app');
+      }
       pageTitle = selectedCategory.name + " - " + pageTitle;
       pageDescription = selectedCategory.description;
       canonical = canonical + "?category=" + query.get("category");
@@ -160,6 +165,9 @@ export async function load({ parent, url }) {
         image: selectedCategory.image,
       };
     }
+    else {
+      throw error(404, 'Category not found');
+    }
   }
   if (isCategoryPage || isMonitorPage || isGroupPage) {
     let eligibleTags = monitorsActive.map((monitor) => monitor.tag);

src/routes/(kener)/+page.svelte

@@ -17,7 +17,8 @@
   import { scale } from "svelte/transition";
   import { format } from "date-fns";
   import GMI from "$lib/components/gmi.svelte";
-
+  import { page } from "$app/stores";
+  
   export let data;
   let shareMenusToggle = false;
   function showShareMenu(e) {
@@ -263,7 +264,9 @@
   <section
     class="section-categories relative z-10 mx-auto mb-8 w-full max-w-[890px] flex-1 flex-col items-start backdrop-blur-[2px] md:w-[655px]"
   >
-    {#each data.site.categories.filter((e) => e.name != "Home") as category}
+  {#each data.site.categories.filter((category) => 
+    category.name != "Home" && 
+    (category.visibility || $page.data.isLoggedIn)) as category}
       <a href={`?category=${category.name}`} rel="external">
         <Card.Root class="mb-4 hover:bg-secondary">
           <Card.Header class="bounce-right relative w-full cursor-pointer px-4  ">