feat: add app ping url (#2380)

Co-authored-by: Meier Lukas <meierschlumpf@gmail.com>

packages/forms-collection/src/new-app/_form.tsx

@@ -1,8 +1,10 @@
 "use client";
 
+import type { ChangeEventHandler } from "react";
 import { useRef } from "react";
 import Link from "next/link";
-import { Button, Group, Stack, Textarea, TextInput } from "@mantine/core";
+import { Button, Checkbox, Collapse, Group, Stack, Textarea, TextInput } from "@mantine/core";
+import { useDisclosure } from "@mantine/hooks";
 import type { z } from "zod";
 
 import { useZodForm } from "@homarr/form";
@@ -39,6 +41,7 @@ export const AppForm = ({
       description: initialValues?.description ?? "",
       iconUrl: initialValues?.iconUrl ?? "",
       href: initialValues?.href ?? "",
+      pingUrl: initialValues?.pingUrl ?? "",
     },
   });
 
@@ -54,6 +57,17 @@ export const AppForm = ({
     originalHandleSubmit(values, redirect, afterSuccess);
   };
 
+  const [opened, { open, close }] = useDisclosure((initialValues?.pingUrl?.length ?? 0) > 0);
+
+  const handleClickDifferentUrlPing: ChangeEventHandler<HTMLInputElement> = () => {
+    if (!opened) {
+      open();
+    } else {
+      close();
+      form.setFieldValue("pingUrl", "");
+    }
+  };
+
   return (
     <form onSubmit={form.onSubmit(handleSubmit)}>
       <Stack>
@@ -62,6 +76,18 @@ export const AppForm = ({
         <Textarea {...form.getInputProps("description")} label={t("app.field.description.label")} />
         <TextInput {...form.getInputProps("href")} label={t("app.field.url.label")} />
 
+        <Checkbox
+          checked={opened}
+          onChange={handleClickDifferentUrlPing}
+          label={t("app.field.useDifferentUrlForPing.checkbox.label")}
+          description={t("app.field.useDifferentUrlForPing.checkbox.description")}
+          mt="md"
+        />
+
+        <Collapse in={opened}>
+          <TextInput {...form.getInputProps("pingUrl")} />
+        </Collapse>
+
         <Group justify="end">
           {showBackToOverview && (
             <Button variant="default" component={Link} href="/manage/apps">