mirror of
https://github.com/dograh-hq/dograh.git
synced 2026-06-07 07:55:16 +02:00
chore: fix ui and add "Get Help" button (#27)
* chore: fix ui and add "Get Help" button * fix: fix instrumentation client
This commit is contained in:
Abhishek
GitHub
parent
e9c0afd517
commit
795f0be80e
11 changed files with 92 additions and 109 deletions
|
|
@ -6,8 +6,7 @@
|
|||
import * as Sentry from "@sentry/nextjs";
|
||||
|
||||
// Only initialize Sentry if explicitly enabled and DSN is provided
|
||||
const enableSentry = process.env.NEXT_PUBLIC_ENABLE_SENTRY === 'true' &&
|
||||
process.env.NEXT_PUBLIC_SENTRY_DSN;
|
||||
const enableSentry = process.env.NEXT_PUBLIC_SENTRY_DSN;
|
||||
|
||||
if (enableSentry) {
|
||||
Sentry.init({
|
||||
|
|
|
|||
|
|
@ -5,8 +5,7 @@
|
|||
import * as Sentry from "@sentry/nextjs";
|
||||
|
||||
// Only initialize Sentry if explicitly enabled and DSN is provided
|
||||
const enableSentry = process.env.NEXT_PUBLIC_ENABLE_SENTRY === 'true' &&
|
||||
process.env.NEXT_PUBLIC_SENTRY_DSN;
|
||||
const enableSentry = process.env.NEXT_PUBLIC_SENTRY_DSN;
|
||||
|
||||
if (enableSentry) {
|
||||
Sentry.init({
|
||||
|
|
|
|||
|
|
@ -4,14 +4,13 @@ import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/com
|
|||
|
||||
export default function AutomationPage() {
|
||||
return (
|
||||
<div className="min-h-[calc(100vh-73px)] bg-gray-50 p-6">
|
||||
<div className="max-w-7xl mx-auto">
|
||||
<div className="mb-6">
|
||||
<h1 className="text-3xl font-bold text-gray-900 mb-2">Automation</h1>
|
||||
<p className="text-gray-600">Automate your workflows and processes</p>
|
||||
</div>
|
||||
<div className="container mx-auto p-6 space-y-6">
|
||||
<div>
|
||||
<h1 className="text-3xl font-bold text-gray-900 mb-2">Automation</h1>
|
||||
<p className="text-gray-600">Automate your workflows and processes</p>
|
||||
</div>
|
||||
|
||||
<Card>
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>Coming Soon</CardTitle>
|
||||
<CardDescription>
|
||||
|
|
@ -29,7 +28,6 @@ export default function AutomationPage() {
|
|||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -284,12 +284,10 @@ export default function CampaignDetailPage() {
|
|||
|
||||
if (isLoadingCampaign) {
|
||||
return (
|
||||
<div className="min-h-[calc(100vh-73px)] bg-gray-50 p-6">
|
||||
<div className="max-w-7xl mx-auto">
|
||||
<div className="animate-pulse">
|
||||
<div className="h-8 bg-gray-200 rounded w-1/4 mb-4"></div>
|
||||
<div className="h-64 bg-gray-200 rounded"></div>
|
||||
</div>
|
||||
<div className="container mx-auto p-6 space-y-6">
|
||||
<div className="animate-pulse">
|
||||
<div className="h-8 bg-gray-200 rounded w-1/4 mb-4"></div>
|
||||
<div className="h-64 bg-gray-200 rounded"></div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
@ -297,29 +295,26 @@ export default function CampaignDetailPage() {
|
|||
|
||||
if (!campaign) {
|
||||
return (
|
||||
<div className="min-h-[calc(100vh-73px)] bg-gray-50 p-6">
|
||||
<div className="max-w-7xl mx-auto">
|
||||
<p className="text-center text-gray-500">Campaign not found</p>
|
||||
</div>
|
||||
<div className="container mx-auto p-6 space-y-6">
|
||||
<p className="text-center text-gray-500">Campaign not found</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="min-h-[calc(100vh-73px)] bg-gray-50 p-6">
|
||||
<div className="max-w-7xl mx-auto">
|
||||
<div className="mb-6">
|
||||
<Button
|
||||
variant="ghost"
|
||||
onClick={handleBack}
|
||||
className="mb-4"
|
||||
>
|
||||
<ArrowLeft className="h-4 w-4 mr-2" />
|
||||
Back to Campaigns
|
||||
</Button>
|
||||
<div className="flex justify-between items-start">
|
||||
<div>
|
||||
<h1 className="text-3xl font-bold text-gray-900 mb-2">{campaign.name}</h1>
|
||||
<div className="container mx-auto p-6 space-y-6">
|
||||
<div>
|
||||
<Button
|
||||
variant="ghost"
|
||||
onClick={handleBack}
|
||||
className="mb-4"
|
||||
>
|
||||
<ArrowLeft className="h-4 w-4 mr-2" />
|
||||
Back to Campaigns
|
||||
</Button>
|
||||
<div className="flex justify-between items-start">
|
||||
<div>
|
||||
<h1 className="text-3xl font-bold text-gray-900 mb-2">{campaign.name}</h1>
|
||||
<div className="flex items-center gap-4">
|
||||
<Badge variant={getStateBadgeVariant(campaign.state)}>
|
||||
{campaign.state}
|
||||
|
|
@ -457,7 +452,6 @@ export default function CampaignDetailPage() {
|
|||
)}
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -121,22 +121,21 @@ export default function NewCampaignPage() {
|
|||
};
|
||||
|
||||
return (
|
||||
<div className="min-h-[calc(100vh-73px)] bg-gray-50 p-6">
|
||||
<div className="max-w-2xl mx-auto">
|
||||
<div className="mb-6">
|
||||
<Button
|
||||
variant="ghost"
|
||||
onClick={handleBack}
|
||||
className="mb-4"
|
||||
>
|
||||
<ArrowLeft className="h-4 w-4 mr-2" />
|
||||
Back to Campaigns
|
||||
</Button>
|
||||
<h1 className="text-3xl font-bold text-gray-900 mb-2">Create New Campaign</h1>
|
||||
<p className="text-gray-600">Set up a new campaign to execute workflows at scale</p>
|
||||
</div>
|
||||
<div className="container mx-auto p-6 space-y-6 max-w-2xl">
|
||||
<div>
|
||||
<Button
|
||||
variant="ghost"
|
||||
onClick={handleBack}
|
||||
className="mb-4"
|
||||
>
|
||||
<ArrowLeft className="h-4 w-4 mr-2" />
|
||||
Back to Campaigns
|
||||
</Button>
|
||||
<h1 className="text-3xl font-bold text-gray-900 mb-2">Create New Campaign</h1>
|
||||
<p className="text-gray-600">Set up a new campaign to execute workflows at scale</p>
|
||||
</div>
|
||||
|
||||
<Card>
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>Campaign Details</CardTitle>
|
||||
<CardDescription>
|
||||
|
|
@ -221,7 +220,6 @@ export default function NewCampaignPage() {
|
|||
</form>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -97,13 +97,12 @@ export default function CampaignsPage() {
|
|||
};
|
||||
|
||||
return (
|
||||
<div className="min-h-[calc(100vh-73px)] bg-gray-50 p-6">
|
||||
<div className="max-w-7xl mx-auto">
|
||||
<div className="mb-6 flex justify-between items-center">
|
||||
<div>
|
||||
<h1 className="text-3xl font-bold text-gray-900 mb-2">Campaigns</h1>
|
||||
<p className="text-gray-600">Manage your bulk workflow execution campaigns</p>
|
||||
</div>
|
||||
<div className="container mx-auto p-6 space-y-6">
|
||||
<div className="flex justify-between items-center">
|
||||
<div>
|
||||
<h1 className="text-3xl font-bold text-gray-900 mb-2">Campaigns</h1>
|
||||
<p className="text-gray-600">Manage your bulk workflow execution campaigns</p>
|
||||
</div>
|
||||
<Button onClick={handleCreateCampaign}>
|
||||
<Plus className="h-4 w-4 mr-2" />
|
||||
Create Campaign
|
||||
|
|
@ -180,7 +179,6 @@ export default function CampaignsPage() {
|
|||
)}
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -49,14 +49,13 @@ export default function SuperadminPage() {
|
|||
|
||||
return (
|
||||
<>
|
||||
<main className="min-h-[calc(100vh-73px)] bg-gray-50 px-4 sm:px-6 lg:px-8 py-8">
|
||||
<div className="max-w-4xl mx-auto">
|
||||
<div className="text-center mb-8">
|
||||
<h1 className="text-3xl font-bold text-gray-900 mb-2">Superadmin Dashboard</h1>
|
||||
<p className="text-sm text-gray-600">Manage users and view system-wide data</p>
|
||||
</div>
|
||||
<main className="container mx-auto p-6 space-y-6 max-w-4xl">
|
||||
<div className="text-center">
|
||||
<h1 className="text-3xl font-bold text-gray-900 mb-2">Superadmin Dashboard</h1>
|
||||
<p className="text-sm text-gray-600">Manage users and view system-wide data</p>
|
||||
</div>
|
||||
|
||||
<div className="grid gap-6 md:grid-cols-2">
|
||||
<div className="grid gap-6 md:grid-cols-2">
|
||||
{/* User Impersonation Card */}
|
||||
<Card>
|
||||
<CardHeader>
|
||||
|
|
@ -126,7 +125,6 @@ export default function SuperadminPage() {
|
|||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</>
|
||||
|
|
|
|||
|
|
@ -316,7 +316,7 @@ export default function RunsPage() {
|
|||
|
||||
if (isLoading && runs.length === 0) {
|
||||
return (
|
||||
<div className="min-h-[calc(100vh-73px)] bg-gray-50 flex items-center justify-center">
|
||||
<div className="container mx-auto p-6 flex items-center justify-center min-h-[400px]">
|
||||
<div className="flex items-center space-x-2">
|
||||
<Loader2 className="h-6 w-6 animate-spin" />
|
||||
<span>Loading workflow runs...</span>
|
||||
|
|
@ -326,14 +326,13 @@ export default function RunsPage() {
|
|||
}
|
||||
|
||||
return (
|
||||
<div className="min-h-[calc(100vh-73px)] bg-gray-50 p-6">
|
||||
<div className="max-w-full mx-auto">
|
||||
<div className="mb-6">
|
||||
<h1 className="text-3xl font-bold text-gray-900 mb-2">Workflow Runs</h1>
|
||||
<p className="text-gray-600">View and manage all workflow runs across organizations</p>
|
||||
</div>
|
||||
<div className="container mx-auto p-6 space-y-6 max-w-full">
|
||||
<div>
|
||||
<h1 className="text-3xl font-bold text-gray-900 mb-2">Workflow Runs</h1>
|
||||
<p className="text-gray-600">View and manage all workflow runs across organizations</p>
|
||||
</div>
|
||||
|
||||
{error && (
|
||||
{error && (
|
||||
<div className="mb-6 bg-red-50 border border-red-200 text-red-600 px-4 py-3 rounded-lg">
|
||||
{error}
|
||||
</div>
|
||||
|
|
@ -671,7 +670,6 @@ export default function RunsPage() {
|
|||
{/* Media Preview Dialog */}
|
||||
{mediaPreview.dialog}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -309,14 +309,13 @@ export default function UsagePage() {
|
|||
};
|
||||
|
||||
return (
|
||||
<div className="min-h-[calc(100vh-73px)] bg-gray-50 p-6">
|
||||
<div className="max-w-7xl mx-auto">
|
||||
<div className="mb-6">
|
||||
<div className="flex justify-between items-start">
|
||||
<div>
|
||||
<h1 className="text-3xl font-bold text-gray-900 mb-2">Usage Dashboard</h1>
|
||||
<p className="text-gray-600">Monitor your Dograh Token usage and quota</p>
|
||||
</div>
|
||||
<div className="container mx-auto p-6 space-y-6">
|
||||
<div>
|
||||
<div className="flex justify-between items-start">
|
||||
<div>
|
||||
<h1 className="text-3xl font-bold text-gray-900 mb-2">Usage Dashboard</h1>
|
||||
<p className="text-gray-600">Monitor your Dograh Token usage and quota</p>
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
<Globe className="h-4 w-4 text-gray-500" />
|
||||
<div className="w-[300px]">
|
||||
|
|
@ -569,7 +568,6 @@ export default function UsagePage() {
|
|||
|
||||
{/* Media Preview Dialog */}
|
||||
{mediaPreview.dialog}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
"use client";
|
||||
|
||||
import { CircleDollarSign, Star } from 'lucide-react';
|
||||
import { CircleDollarSign, HelpCircle,Star } from 'lucide-react';
|
||||
import Link from 'next/link';
|
||||
import { usePathname, useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
|
|
@ -133,15 +133,26 @@ export default function BaseHeader({ headerActions, backButton, showFeaturesNav
|
|||
/>
|
||||
</React.Suspense>
|
||||
) : (
|
||||
<a
|
||||
href="https://github.com/dograh-hq/dograh"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex items-center gap-2 px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-md hover:bg-gray-50 transition-colors"
|
||||
>
|
||||
<Star className="w-4 h-4 fill-yellow-400 text-yellow-400" />
|
||||
Star us on GitHub
|
||||
</a>
|
||||
<>
|
||||
<a
|
||||
href="https://github.com/dograh-hq/dograh/issues/new/choose"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex items-center gap-2 px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-md hover:bg-gray-50 transition-colors"
|
||||
>
|
||||
<HelpCircle className="w-4 h-4" />
|
||||
Get Help
|
||||
</a>
|
||||
<a
|
||||
href="https://github.com/dograh-hq/dograh"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex items-center gap-2 px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-md hover:bg-gray-50 transition-colors"
|
||||
>
|
||||
<Star className="w-4 h-4 fill-yellow-400 text-yellow-400" />
|
||||
Star us on GitHub
|
||||
</a>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</nav>
|
||||
|
|
|
|||
|
|
@ -7,18 +7,14 @@ import posthog from "posthog-js";
|
|||
|
||||
// Initialize Sentry - prioritize NEXT_PUBLIC env vars, fallback to API
|
||||
const initSentry = () => {
|
||||
const hasPublicConfig = process.env.NEXT_PUBLIC_ENABLE_SENTRY === 'true' &&
|
||||
process.env.NEXT_PUBLIC_SENTRY_DSN;
|
||||
const hasPublicConfig = process.env.NEXT_PUBLIC_SENTRY_DSN;
|
||||
|
||||
|
||||
if (hasPublicConfig) {
|
||||
// Use client-side environment variables
|
||||
Sentry.init({
|
||||
dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
|
||||
integrations: [Sentry.replayIntegration()],
|
||||
replaysSessionSampleRate: 0.1,
|
||||
replaysOnErrorSampleRate: 1.0,
|
||||
debug: false,
|
||||
enabled: process.env.NEXT_PUBLIC_NODE_ENV === 'production'
|
||||
});
|
||||
console.log('Sentry initialized from NEXT_PUBLIC config');
|
||||
} else {
|
||||
|
|
@ -29,11 +25,7 @@ const initSentry = () => {
|
|||
if (config.enabled && config.dsn) {
|
||||
Sentry.init({
|
||||
dsn: config.dsn,
|
||||
integrations: [Sentry.replayIntegration()],
|
||||
replaysSessionSampleRate: 0.1,
|
||||
replaysOnErrorSampleRate: 1.0,
|
||||
debug: false,
|
||||
enabled: config.environment === 'production'
|
||||
});
|
||||
console.log('Sentry initialized from API config');
|
||||
} else {
|
||||
|
|
@ -50,8 +42,8 @@ initSentry();
|
|||
|
||||
// Initialize PostHog - prioritize NEXT_PUBLIC env vars, fallback to API
|
||||
const initPostHog = () => {
|
||||
const hasPublicConfig = process.env.NEXT_PUBLIC_ENABLE_POSTHOG === 'true' &&
|
||||
process.env.NEXT_PUBLIC_POSTHOG_KEY;
|
||||
const hasPublicConfig = process.env.NEXT_PUBLIC_POSTHOG_KEY;
|
||||
|
||||
|
||||
if (hasPublicConfig) {
|
||||
// Use client-side environment variables
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue