6ec95262af
- Updated .env.example to include configuration for OnlyOffice Document Server. - Modified the workspace configuration to remove the drive-suite path. - Adjusted TypeScript environment imports for consistency. - Enhanced Next.js configuration to disable canvas in Webpack. - Updated package.json to include new dependencies for OnlyOffice and PDF.js. - Added global styles for OnlyOffice theme integration in the CSS. - Created new layout and page components for the Drive feature, including public sharing and editing functionalities. - Updated metadata handling across various layouts to reflect the new app structure.
92 lines
3.5 KiB
TypeScript
92 lines
3.5 KiB
TypeScript
"use client"
|
|
|
|
import { useState } from "react"
|
|
import { Trash2 } from "lucide-react"
|
|
import { Button } from "@/components/ui/button"
|
|
import { Input } from "@/components/ui/input"
|
|
import { Label } from "@/components/ui/label"
|
|
import {
|
|
useMailWebhooks,
|
|
useCreateMailWebhook,
|
|
useDeleteMailWebhook,
|
|
} from "@/lib/api/hooks/use-mail-automation-queries"
|
|
import { useAuthReady } from "@/lib/api/use-auth-ready"
|
|
import { SettingsSyncBanner } from "@/components/gmail/settings/settings-sync-banner"
|
|
import { WebhookTemplateVariablesPanel } from "@/components/gmail/settings/automation/webhook-template-variables-panel"
|
|
import { AutomationTabMasonry } from "@/components/gmail/settings/automation/automation-tab-masonry"
|
|
|
|
export function WebhooksPanel() {
|
|
const { ready, authenticated } = useAuthReady()
|
|
const { data: webhooks = [], isFetching, isError, refetch, isPending } = useMailWebhooks()
|
|
const createWebhook = useCreateMailWebhook()
|
|
const deleteWebhook = useDeleteMailWebhook()
|
|
const [name, setName] = useState("")
|
|
const [url, setUrl] = useState("")
|
|
const [template, setTemplate] = useState(
|
|
'{"text":"Nouveau mail de $sender.name : $subject"}'
|
|
)
|
|
const showInitialLoad = ready && authenticated && isPending && webhooks.length === 0
|
|
|
|
return (
|
|
<div className="space-y-4">
|
|
<SettingsSyncBanner isFetching={isFetching} isError={isError} onRetry={() => refetch()} />
|
|
<AutomationTabMasonry columns={2}>
|
|
<WebhookTemplateVariablesPanel />
|
|
<div className="space-y-2 rounded-lg border border-border p-4">
|
|
<Label className="text-xs">Nouveau webhook</Label>
|
|
<Input placeholder="Nom" value={name} onChange={(e) => setName(e.target.value)} />
|
|
<Input placeholder="URL HTTPS" value={url} onChange={(e) => setUrl(e.target.value)} />
|
|
<textarea
|
|
className="min-h-20 w-full rounded-md border border-input bg-background px-3 py-2 font-mono text-xs"
|
|
value={template}
|
|
onChange={(e) => setTemplate(e.target.value)}
|
|
placeholder="body_template JSON"
|
|
/>
|
|
<Button
|
|
type="button"
|
|
disabled={!name.trim() || !url.trim() || createWebhook.isPending}
|
|
onClick={() =>
|
|
createWebhook.mutate({
|
|
name: name.trim(),
|
|
url: url.trim(),
|
|
method: "POST",
|
|
body_template: template,
|
|
})
|
|
}
|
|
>
|
|
Créer le webhook
|
|
</Button>
|
|
</div>
|
|
|
|
{showInitialLoad ? (
|
|
<p className="text-sm text-muted-foreground">Chargement…</p>
|
|
) : webhooks.length === 0 ? (
|
|
<p className="text-sm text-muted-foreground">Aucun webhook.</p>
|
|
) : (
|
|
<ul className="divide-y divide-border rounded-lg border border-border">
|
|
{webhooks.map((hook) => (
|
|
<li
|
|
key={hook.id}
|
|
className="flex items-start justify-between gap-2 px-3 py-3"
|
|
>
|
|
<div className="min-w-0">
|
|
<p className="text-sm font-medium">{hook.name}</p>
|
|
<p className="truncate text-xs text-muted-foreground">{hook.url}</p>
|
|
</div>
|
|
<Button
|
|
type="button"
|
|
variant="ghost"
|
|
size="icon"
|
|
onClick={() => deleteWebhook.mutate(hook.id)}
|
|
>
|
|
<Trash2 className="size-4" />
|
|
</Button>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
)}
|
|
</AutomationTabMasonry>
|
|
</div>
|
|
)
|
|
}
|