Working on notifications channels.

src/components/wrappers/dashboard/common/notifier/notifier-add-edit-modal.tsx

@@ -9,6 +9,7 @@ import {Button} from "@/components/ui/button";
 import {NotifierForm} from "@/components/wrappers/dashboard/common/notifier/notifier-form/notifier-form";
 import {OrganizationWithMembers} from "@/db/schema/03_organization";
 import {NotificationChannel} from "@/db/schema/09_notification-channel";
+import {useIsMobile} from "@/hooks/use-mobile";
 
 type OrganizationNotifierAddModalProps = {
     notificationChannel?: NotificationChannel
@@ -24,6 +25,7 @@ export const NotifierAddEditModal = ({
                                          open,
                                          onOpenChangeAction
                                      }: OrganizationNotifierAddModalProps) => {
+    const isMobile = useIsMobile();
 
     const isCreate = !Boolean(notificationChannel);
 
@@ -32,7 +34,7 @@ export const NotifierAddEditModal = ({
             <DialogTrigger asChild>
                 {isCreate ?
                     <Button>
-                        <Plus/> Add notification channel
+                        <Plus/>{!isMobile && `Add notification channel` }
                     </Button>
                     :
                     <Button

src/components/wrappers/dashboard/common/notifier/notifier-card/button-edit-notifier.tsx

@@ -9,12 +9,14 @@ import {
 } from "@/components/wrappers/dashboard/common/notifier/notifier-form/notifier-form.action";
 import {toast} from "sonner";
 import {useState} from "react";
+import {Organization, OrganizationWithMembers} from "@/db/schema/03_organization";
 
 export type EditNotifierButtonProps = {
     notificationChannel: NotificationChannel;
+    organization? : OrganizationWithMembers;
 };
 
-export const EditNotifierButton = ({notificationChannel}: EditNotifierButtonProps) => {
+export const EditNotifierButton = ({notificationChannel, organization}: EditNotifierButtonProps) => {
     const router = useRouter();
     const [isAddModalOpen, setIsAddModalOpen] = useState(false);
 
@@ -51,6 +53,7 @@ export const EditNotifierButton = ({notificationChannel}: EditNotifierButtonProp
             }}
             />
             <NotifierAddEditModal
+                organization={organization}
                 notificationChannel={notificationChannel}
                 open={isAddModalOpen}
                 onOpenChangeAction={setIsAddModalOpen}

src/components/wrappers/dashboard/common/notifier/notifier-card/notifier-card.tsx

@@ -9,11 +9,11 @@ import {
     DeleteNotifierButton
 } from "@/components/wrappers/dashboard/common/notifier/notifier-card/button-delete-notifier";
 import {EditNotifierButton} from "@/components/wrappers/dashboard/common/notifier/notifier-card/button-edit-notifier";
-import {Organization} from "@/db/schema/03_organization";
+import {Organization, OrganizationWithMembers} from "@/db/schema/03_organization";
 
 export type NotifierCardProps = {
     data: NotificationChannel;
-    organization?: Organization;
+    organization?: OrganizationWithMembers;
 };
 
 export const NotifierCard = (props: NotifierCardProps) => {
@@ -40,7 +40,9 @@ export const NotifierCard = (props: NotifierCardProps) => {
                 </div>
 
                 <div className="flex items-center gap-2">
-                    <EditNotifierButton notificationChannel={data}/>
+                    <EditNotifierButton
+                        organization={organization}
+                        notificationChannel={data}/>
                     <DeleteNotifierButton
                         organizationId={organization?.id}
                         notificationChannelId={data.id}

src/components/wrappers/dashboard/common/notifier/notifier-form/notifier-form.tsx

@@ -136,7 +136,7 @@ export const NotifierForm = ({onSuccessAction, organization, defaultValues}: Not
             <div className="flex justify-between">
                 <div>
                     {defaultValues && (
-                        <NotifierTestChannelButton notificationChannel={defaultValues}/>
+                        <NotifierTestChannelButton organizationId={organization?.id} notificationChannel={defaultValues}/>
                     )}
                 </div>
                 <div className="flex gap-2">

src/components/wrappers/dashboard/common/notifier/notifier-form/notifier-test-channel-button.tsx

@@ -6,13 +6,17 @@ import {dispatchNotification} from "@/features/notifications/dispatch";
 import {EventPayload} from "@/features/notifications/types";
 import {Send} from "lucide-react";
 import {toast} from "sonner";
+import {useIsMobile} from "@/hooks/use-mobile";
+import {cn} from "@/lib/utils";
 
 type NotifierTestChannelButtonProps = {
     notificationChannel: NotificationChannel;
+    organizationId?: string;
 }
 
-export const NotifierTestChannelButton = ({notificationChannel}: NotifierTestChannelButtonProps) => {
+export const NotifierTestChannelButton = ({notificationChannel, organizationId}: NotifierTestChannelButtonProps) => {
 
+    const isMobile = useIsMobile()
     const mutation = useMutation({
         mutationFn: async () => {
 
@@ -23,6 +27,8 @@ export const NotifierTestChannelButton = ({notificationChannel}: NotifierTestCha
             //     data: {host: 'db-prod-01', error: 'connection timeout'},
             // };
 
+            console.log("organizationId ici", organizationId);
+
             const payload: EventPayload = {
                 title: 'Test Channel',
                 message: `We are testing channel ${notificationChannel.name}`,
@@ -30,7 +36,7 @@ export const NotifierTestChannelButton = ({notificationChannel}: NotifierTestCha
                 // data: {host: 'db-prod-01', error: 'connection timeout'},
             };
 
-            const result = await dispatchNotification(payload, undefined, notificationChannel.id);
+            const result = await dispatchNotification(payload, undefined, notificationChannel.id, organizationId);
 
             if (result.success) {
                 toast.success(result.message);
@@ -51,14 +57,13 @@ export const NotifierTestChannelButton = ({notificationChannel}: NotifierTestCha
         >
             {mutation.isPending ? (
                 <>
-                    <div className="mr-2 h-4 w-4 animate-spin rounded-full border-2 border-white/30 border-t-white"/>
-                    Sending...
+                    <div className={cn(" h-4 w-4 animate-spin rounded-full border-2 border-white/30 border-t-white", !isMobile && "mr-2")}/>
+                    {!isMobile && `Sending...`}
                 </>
             ) : (
-                <>
-                    <Send className="mr-2 h-4 w-4"/>
-                    Test Channel
-                </>
+                <div className="flex flex-row justify-center items-center">
+                    <Send className={cn("h-4 w-4", !isMobile && "mr-2")}/>{!isMobile && ` Test Channel`}
+                </div>
             )}
         </Button>
     )

src/components/wrappers/dashboard/organization/tabs/organization-notifiers-tab/organization-notifiers-tab.tsx

@@ -63,17 +63,16 @@ export const OrganizationNotifiersTab = ({
         <div className="flex flex-col gap-y-6 h-full py-4">
             <div className="h-full flex flex-col gap-y-6">
                 <div className={cn("hidden flex-row justify-between items-start", hasNotifiers && "flex")}>
-                    <div className="max-w-2xl">
+                    <div className="max-w-2xl ">
                         <h3 className="text-xl font-semibold text-balance mb-1">
                             Notification Settings
                         </h3>
-                        <p className="text-muted-foreground leading-relaxed">
+                        <p className="text-muted-foreground leading-relaxed ">
                             Configure how and when you receive alerts about your services and
                             infrastructure.
                         </p>
                     </div>
                     <NotifierAddEditModal
-
                         organization={organization}
                         open={isAddModalOpen}
                         onOpenChangeAction={setIsAddModalOpen}