External/portabase
1
0
Fork 0
mirror of https://github.com/Portabase/portabase.git synced 2026-07-14 11:16:13 +02:00
Code Issues Packages Projects Releases Wiki Activity

Working on notifications channels.

Browse Source
This commit is contained in:
charlesgauthereau
2025-11-29 23:12:06 +01:00
parent ac951378e8
commit 8980e6d4a8
10 changed files with 83 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/wrappers/dashboard/common/notifier/notifier-add-edit-modal.tsx
+3 -1
View File
@@ -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
+4 -1
View File
@@ -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
+5 -3
View File
@@ -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
+1 -1
View File
@@ -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
+13 -8
View File
@@ -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
+2 -3
View File
@@ -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}
src/features/notifications/dispatch.ts
+4 -1
View File
@@ -11,8 +11,10 @@ export async function dispatchNotification(
payload: EventPayload,
policyId?: string,
channelId?: string,
organizationId?: string,
): Promise<DispatchResult> {
// // 1. Get policy + channel
// const policy = await db
// .select({
@@ -66,7 +68,7 @@ export async function dispatchNotification(
.values({
channelId: channel.id,
// policyId: policy.id,
// organizationId: organizationId || null,
organizationId: organizationId || null,
title: payload.title,
message: payload.message,
level: payload.level,
@@ -74,6 +76,7 @@ export async function dispatchNotification(
success: result.success,
error: result.success ? null : result.error,
providerResponse: result.response || null,
})
.returning({id: notificationLog.id});
src/features/notifications/providers/index.ts
+4 -4
View File
@@ -1,13 +1,13 @@
"use server"
import type { ProviderKind, EventPayload, DispatchResult } from '../types';
// import { sendSlack } from './slack';
import { sendSmtp } from './smtp';
import type {ProviderKind, EventPayload, DispatchResult} from '../types';
import {sendSlack} from './slack';
import {sendSmtp} from './smtp';
const handlers: Record<
ProviderKind,
(config: any, payload: EventPayload) => Promise<DispatchResult>
> = {
// slack: sendSlack,
slack: sendSlack,
smtp: sendSmtp,
};
src/features/notifications/providers/slack.ts
+46
View File
@@ -0,0 +1,46 @@
import type {EventPayload, DispatchResult} from '../types';
export async function sendSlack(
config: { slackWebhook: string },
payload: EventPayload
): Promise<DispatchResult> {
const {slackWebhook: webhookUrl} = config;
const text = `*${payload.title}*\n${payload.message}`;
const blocks = [
{
type: 'section',
text: {type: 'mrkdwn', text: `*${payload.title}*`},
},
{type: 'section', text: {type: 'mrkdwn', text: payload.message}},
payload.data
? {
type: 'context',
elements: [{type: 'mrkdwn', text: `*Data:* \`\`\`${JSON.stringify(payload.data, null, 2)}\`\`\``}],
}
: null,
].filter(Boolean);
const body = {
text,
blocks,
};
const res = await fetch(webhookUrl, {
method: 'POST',
body: JSON.stringify(body),
headers: {'Content-Type': 'application/json'},
});
if (!res.ok) {
const err = await res.text();
throw new Error(`Slack error: ${res.status} ${err}`);
}
return {
success: true,
provider: 'slack',
message: 'Sent to Slack',
response: await res.text(),
};
}
src/features/notifications/types.ts
+1 -2
View File
@@ -1,5 +1,4 @@
// export type ProviderKind = 'slack' | 'smtp';
export type ProviderKind = 'smtp';
export type ProviderKind = 'slack' | 'smtp';
export interface DispatchResult {
success: boolean;