@lobehub/lobehub 2.0.0-next.276 → 2.0.0-next.278

package/packages/types/src/topic/topic.ts

@@ -1,6 +1,8 @@
 import type { BaseDataModel } from '../meta';
 
 // Type definitions
+export type ShareVisibility = 'private' | 'link';
+
 export type TimeGroupId =
   | 'today'
   | 'yesterday'
@@ -126,3 +128,47 @@ export interface QueryTopicParams {
   isInbox?: boolean;
   pageSize?: number;
 }
+
+/**
+ * Shared message data for public sharing
+ */
+export interface SharedMessage {
+  content: string;
+  createdAt: Date;
+  id: string;
+  role: string;
+}
+
+/**
+ * Shared topic data returned by public API
+ */
+export interface SharedTopicData {
+  agentId: string | null;
+  agentMeta?: {
+    avatar?: string | null;
+    backgroundColor?: string | null;
+    marketIdentifier?: string | null;
+    slug?: string | null;
+    title?: string | null;
+  };
+  groupId: string | null;
+  groupMeta?: {
+    avatar?: string | null;
+    backgroundColor?: string | null;
+    members?: { avatar: string | null; backgroundColor: string | null }[];
+    title?: string | null;
+  };
+  shareId: string;
+  title: string | null;
+  topicId: string;
+  visibility: ShareVisibility;
+}
+
+/**
+ * Topic share info returned to the owner
+ */
+export interface TopicShareInfo {
+  id: string;
+  topicId: string;
+  visibility: ShareVisibility;
+}

package/src/app/[variants]/(main)/agent/_layout/Sidebar/Cron/Actions.tsx

@@ -0,0 +1,31 @@
+import { ActionIcon, Dropdown } from '@lobehub/ui';
+import { MoreHorizontal } from 'lucide-react';
+import { memo } from 'react';
+
+import { useCronJobDropdownMenu } from './useDropdownMenu';
+
+interface ActionsProps {
+  cronJobId: string;
+  topics: Array<{ id: string }>;
+}
+
+const Actions = memo<ActionsProps>(({ cronJobId, topics }) => {
+  const dropdownMenu = useCronJobDropdownMenu(cronJobId, topics);
+
+  return (
+    <Dropdown
+      arrow={false}
+      menu={{
+        items: dropdownMenu,
+        onClick: ({ domEvent }) => {
+          domEvent.stopPropagation();
+        },
+      }}
+      trigger={['click']}
+    >
+      <ActionIcon icon={MoreHorizontal} size={'small'} />
+    </Dropdown>
+  );
+});
+
+export default Actions;

package/src/app/[variants]/(main)/agent/_layout/Sidebar/Cron/CronTopicGroup.tsx

@@ -9,6 +9,7 @@ import { useParams } from 'react-router-dom';
 import { useRouter } from '@/app/[variants]/(main)/hooks/useRouter';
 import type { AgentCronJob } from '@/database/schemas/agentCronJob';
 
+import Actions from './Actions';
 import CronTopicItem from './CronTopicItem';
 
 interface CronTopicGroupProps {
@@ -43,12 +44,15 @@ const CronTopicGroup = memo<CronTopicGroupProps>(({ cronJob, cronJobId, topics }
   return (
     <AccordionItem
       action={
-        <ActionIcon
-          icon={Settings2Icon}
-          onClick={handleOpenCronJob}
-          size="small"
-          title={t('agentCronJobs.editJob')}
-        />
+        <Flexbox align="center" gap={4} horizontal>
+          <ActionIcon
+            icon={Settings2Icon}
+            onClick={handleOpenCronJob}
+            size="small"
+            title={t('agentCronJobs.editJob')}
+          />
+          <Actions cronJobId={cronJobId} topics={topics} />
+        </Flexbox>
       }
       itemKey={cronJobId}
       paddingBlock={4}

package/src/app/[variants]/(main)/agent/_layout/Sidebar/Cron/index.tsx

@@ -1,6 +1,5 @@
 'use client';
 
-import { ENABLE_BUSINESS_FEATURES } from '@lobechat/business-const';
 import { Accordion, AccordionItem, ActionIcon, Flexbox, Text } from '@lobehub/ui';
 import { Plus } from 'lucide-react';
 import { memo, useCallback } from 'react';
@@ -12,6 +11,7 @@ import EmptyNavItem from '@/features/NavPanel/components/EmptyNavItem';
 import SkeletonList from '@/features/NavPanel/components/SkeletonList';
 import { useQueryRoute } from '@/hooks/useQueryRoute';
 import { useAgentStore } from '@/store/agent';
+import { serverConfigSelectors, useServerConfigStore } from '@/store/serverConfig';
 
 import CronTopicGroup from './CronTopicGroup';
 
@@ -22,24 +22,20 @@ interface CronTopicListProps {
 const CronTopicList = memo<CronTopicListProps>(({ itemKey }) => {
   const { t } = useTranslation('setting');
   const router = useQueryRoute();
-  const [agentId, createAgentCronJob, useFetchCronTopicsWithJobInfo] = useAgentStore((s) => [
+  const [agentId, useFetchCronTopicsWithJobInfo] = useAgentStore((s) => [
     s.activeAgentId,
-    s.createAgentCronJob,
     s.useFetchCronTopicsWithJobInfo,
   ]);
   const { data: cronTopicsGroupsWithJobInfo = [], isLoading } =
     useFetchCronTopicsWithJobInfo(agentId);
+  const enableBusinessFeatures = useServerConfigStore(serverConfigSelectors.enableBusinessFeatures);
 
-  const handleCreateCronJob = useCallback(async () => {
+  const handleCreateCronJob = useCallback(() => {
     if (!agentId) return;
+    router.push(urlJoin('/agent', agentId, 'cron', 'new'));
+  }, [agentId, router]);
 
-    const cronJobId = await createAgentCronJob();
-    if (cronJobId) {
-      router.push(urlJoin('/agent', agentId, 'cron', cronJobId));
-    }
-  }, [agentId, createAgentCronJob, router]);
-
-  if (!ENABLE_BUSINESS_FEATURES) return null;
+  if (!enableBusinessFeatures) return null;
 
   const addAction = (
     <ActionIcon

package/src/app/[variants]/(main)/agent/_layout/Sidebar/Cron/useDropdownMenu.tsx

@@ -0,0 +1,102 @@
+import { Icon, type MenuProps } from '@lobehub/ui';
+import { App } from 'antd';
+import { Trash } from 'lucide-react';
+import { useCallback, useMemo } from 'react';
+import { useTranslation } from 'react-i18next';
+
+import { agentCronJobService } from '@/services/agentCronJob';
+import { topicService } from '@/services/topic';
+import { useAgentStore } from '@/store/agent';
+
+export const useCronJobDropdownMenu = (
+  cronJobId: string,
+  topics: Array<{ id: string }>,
+): MenuProps['items'] => {
+  const { t } = useTranslation(['setting', 'common']);
+  const { modal } = App.useApp();
+
+  const refreshCronTopics = useAgentStore((s) => s.internal_refreshCronTopics);
+
+  const handleDeleteCronJob = useCallback(async () => {
+    try {
+      // Delete all topics associated with this cron job
+      if (topics.length > 0) {
+        const topicIds = topics.map((t) => t.id);
+        await topicService.batchRemoveTopics(topicIds);
+      }
+
+      // Delete the cron job
+      await agentCronJobService.delete(cronJobId);
+
+      // Refresh the cron topics list
+      await refreshCronTopics();
+    } catch (error) {
+      console.error('Failed to delete cron job:', error);
+      modal.error({
+        content: t('agentCronJobs.deleteFailed' as any),
+        title: t('error' as any, { ns: 'common' }),
+      });
+    }
+  }, [cronJobId, topics, refreshCronTopics, modal, t]);
+
+  const handleClearTopics = useCallback(async () => {
+    if (topics.length === 0) return;
+
+    try {
+      const topicIds = topics.map((t) => t.id);
+      await topicService.batchRemoveTopics(topicIds);
+
+      // Refresh the cron topics list
+      await refreshCronTopics();
+    } catch (error) {
+      console.error('Failed to clear topics:', error);
+      modal.error({
+        content: t('agentCronJobs.clearTopicsFailed' as any),
+        title: t('error' as any, { ns: 'common' }),
+      });
+    }
+  }, [topics, refreshCronTopics, modal, t]);
+
+  return useMemo(
+    () =>
+      [
+        {
+          icon: <Icon icon={Trash} />,
+          key: 'clearTopics',
+          label: t('agentCronJobs.clearTopics' as any),
+          onClick: () => {
+            modal.confirm({
+              cancelText: t('cancel', { ns: 'common' }),
+              centered: true,
+              content: t('agentCronJobs.confirmClearTopics' as any, { count: topics.length }),
+              okButtonProps: { danger: true },
+              okText: t('ok', { ns: 'common' }),
+              onOk: handleClearTopics,
+              title: t('agentCronJobs.clearTopics' as any),
+            });
+          },
+        },
+        {
+          type: 'divider' as const,
+        },
+        {
+          danger: true,
+          icon: <Icon icon={Trash} />,
+          key: 'deleteCronJob',
+          label: t('agentCronJobs.deleteCronJob' as any),
+          onClick: () => {
+            modal.confirm({
+              cancelText: t('cancel', { ns: 'common' }),
+              centered: true,
+              content: t('agentCronJobs.confirmDeleteCronJob' as any),
+              okButtonProps: { danger: true },
+              okText: t('ok', { ns: 'common' }),
+              onOk: handleDeleteCronJob,
+              title: t('agentCronJobs.deleteCronJob' as any),
+            });
+          },
+        },
+      ].filter(Boolean) as MenuProps['items'],
+    [topics.length, handleClearTopics, handleDeleteCronJob, t, modal],
+  );
+};

package/src/app/[variants]/(main)/agent/cron/[cronId]/CronConfig.ts

@@ -0,0 +1,179 @@
+import type { Dayjs } from 'dayjs';
+
+export type ScheduleType = 'daily' | 'hourly' | 'weekly';
+
+// Schedule type options
+export const SCHEDULE_TYPE_OPTIONS = [
+  { label: 'agentCronJobs.scheduleType.daily', value: 'daily' },
+  { label: 'agentCronJobs.scheduleType.hourly', value: 'hourly' },
+  { label: 'agentCronJobs.scheduleType.weekly', value: 'weekly' },
+] as const;
+
+// Timezone options - covering major cities worldwide
+export const TIMEZONE_OPTIONS = [
+  { label: 'UTC', value: 'UTC' },
+
+  // Americas
+  { label: 'America/New_York (EST/EDT, UTC-5/-4)', value: 'America/New_York' },
+  { label: 'America/Chicago (CST/CDT, UTC-6/-5)', value: 'America/Chicago' },
+  { label: 'America/Denver (MST/MDT, UTC-7/-6)', value: 'America/Denver' },
+  { label: 'America/Los_Angeles (PST/PDT, UTC-8/-7)', value: 'America/Los_Angeles' },
+  { label: 'America/Toronto (EST/EDT, UTC-5/-4)', value: 'America/Toronto' },
+  { label: 'America/Vancouver (PST/PDT, UTC-8/-7)', value: 'America/Vancouver' },
+  { label: 'America/Mexico_City (CST, UTC-6)', value: 'America/Mexico_City' },
+  { label: 'America/Sao_Paulo (BRT, UTC-3)', value: 'America/Sao_Paulo' },
+  { label: 'America/Buenos_Aires (ART, UTC-3)', value: 'America/Buenos_Aires' },
+
+  // Europe
+  { label: 'Europe/London (GMT/BST, UTC+0/+1)', value: 'Europe/London' },
+  { label: 'Europe/Paris (CET/CEST, UTC+1/+2)', value: 'Europe/Paris' },
+  { label: 'Europe/Berlin (CET/CEST, UTC+1/+2)', value: 'Europe/Berlin' },
+  { label: 'Europe/Madrid (CET/CEST, UTC+1/+2)', value: 'Europe/Madrid' },
+  { label: 'Europe/Rome (CET/CEST, UTC+1/+2)', value: 'Europe/Rome' },
+  { label: 'Europe/Amsterdam (CET/CEST, UTC+1/+2)', value: 'Europe/Amsterdam' },
+  { label: 'Europe/Brussels (CET/CEST, UTC+1/+2)', value: 'Europe/Brussels' },
+  { label: 'Europe/Moscow (MSK, UTC+3)', value: 'Europe/Moscow' },
+  { label: 'Europe/Istanbul (TRT, UTC+3)', value: 'Europe/Istanbul' },
+
+  // Asia
+  { label: 'Asia/Dubai (GST, UTC+4)', value: 'Asia/Dubai' },
+  { label: 'Asia/Kolkata (IST, UTC+5:30)', value: 'Asia/Kolkata' },
+  { label: 'Asia/Shanghai (CST, UTC+8)', value: 'Asia/Shanghai' },
+  { label: 'Asia/Hong_Kong (HKT, UTC+8)', value: 'Asia/Hong_Kong' },
+  { label: 'Asia/Taipei (CST, UTC+8)', value: 'Asia/Taipei' },
+  { label: 'Asia/Singapore (SGT, UTC+8)', value: 'Asia/Singapore' },
+  { label: 'Asia/Tokyo (JST, UTC+9)', value: 'Asia/Tokyo' },
+  { label: 'Asia/Seoul (KST, UTC+9)', value: 'Asia/Seoul' },
+  { label: 'Asia/Bangkok (ICT, UTC+7)', value: 'Asia/Bangkok' },
+  { label: 'Asia/Jakarta (WIB, UTC+7)', value: 'Asia/Jakarta' },
+
+  // Oceania
+  { label: 'Australia/Sydney (AEDT/AEST, UTC+11/+10)', value: 'Australia/Sydney' },
+  { label: 'Australia/Melbourne (AEDT/AEST, UTC+11/+10)', value: 'Australia/Melbourne' },
+  { label: 'Australia/Brisbane (AEST, UTC+10)', value: 'Australia/Brisbane' },
+  { label: 'Australia/Perth (AWST, UTC+8)', value: 'Australia/Perth' },
+  { label: 'Pacific/Auckland (NZDT/NZST, UTC+13/+12)', value: 'Pacific/Auckland' },
+
+  // Africa & Middle East
+  { label: 'Africa/Cairo (EET, UTC+2)', value: 'Africa/Cairo' },
+  { label: 'Africa/Johannesburg (SAST, UTC+2)', value: 'Africa/Johannesburg' },
+];
+
+// Weekday options for checkbox group
+export const WEEKDAY_OPTIONS = [
+  { label: 'Mon', value: 1 },
+  { label: 'Tue', value: 2 },
+  { label: 'Wed', value: 3 },
+  { label: 'Thu', value: 4 },
+  { label: 'Fri', value: 5 },
+  { label: 'Sat', value: 6 },
+  { label: 'Sun', value: 0 },
+];
+
+// Weekday labels for display
+export const WEEKDAY_LABELS: Record<number, string> = {
+  0: 'Sunday',
+  1: 'Monday',
+  2: 'Tuesday',
+  3: 'Wednesday',
+  4: 'Thursday',
+  5: 'Friday',
+  6: 'Saturday',
+};
+
+/**
+ * Parse cron pattern to extract schedule info
+ * Format: minute hour day month weekday
+ */
+export const parseCronPattern = (
+  cronPattern: string,
+): {
+  hourlyInterval?: number;
+  scheduleType: ScheduleType;
+  triggerHour: number;
+  triggerMinute: number;
+  weekdays?: number[];
+} => {
+  const parts = cronPattern.split(' ');
+  if (parts.length !== 5) {
+    return { scheduleType: 'daily', triggerHour: 0, triggerMinute: 0 };
+  }
+
+  // eslint-disable-next-line unicorn/no-unreadable-array-destructuring
+  const [minute, hour, , , weekday] = parts;
+  const rawMinute = minute === '*' ? 0 : Number.parseInt(minute);
+  // Normalize to nearest 30-minute interval (0 or 30)
+  const triggerMinute = rawMinute >= 15 && rawMinute < 45 ? 30 : 0;
+
+  // Hourly: 0 * * * * or 0 */N * * *
+  if (hour.startsWith('*/')) {
+    const interval = Number.parseInt(hour.slice(2));
+    return {
+      hourlyInterval: interval,
+      scheduleType: 'hourly',
+      triggerHour: 0,
+      triggerMinute,
+    };
+  }
+  if (hour === '*') {
+    return {
+      hourlyInterval: 1,
+      scheduleType: 'hourly',
+      triggerHour: 0,
+      triggerMinute,
+    };
+  }
+
+  const triggerHour = Number.parseInt(hour);
+
+  // Weekly: has specific weekday(s)
+  if (weekday !== '*') {
+    const weekdays = weekday.split(',').map((d) => Number.parseInt(d));
+    return {
+      scheduleType: 'weekly',
+      triggerHour,
+      triggerMinute,
+      weekdays,
+    };
+  }
+
+  // Daily: specific hour, any weekday
+  return {
+    scheduleType: 'daily',
+    triggerHour,
+    triggerMinute,
+  };
+};
+
+/**
+ * Build cron pattern from schedule info
+ * Format: minute hour day month weekday
+ */
+export const buildCronPattern = (
+  scheduleType: ScheduleType,
+  triggerTime: Dayjs,
+  hourlyInterval?: number,
+  weekdays?: number[],
+): string => {
+  const rawMinute = triggerTime.minute();
+  // Normalize to 0 or 30
+  const minute = rawMinute >= 15 && rawMinute < 45 ? 30 : 0;
+  const hour = triggerTime.hour();
+
+  switch (scheduleType) {
+    case 'hourly': {
+      const interval = hourlyInterval || 1;
+      if (interval === 1) {
+        return `${minute} * * * *`;
+      }
+      return `${minute} */${interval} * * *`;
+    }
+    case 'daily': {
+      return `${minute} ${hour} * * *`;
+    }
+    case 'weekly': {
+      const days = weekdays && weekdays.length > 0 ? weekdays.sort().join(',') : '0,1,2,3,4,5,6';
+      return `${minute} ${hour} * * ${days}`;
+    }
+  }
+};

package/src/app/[variants]/(main)/agent/cron/[cronId]/features/CronJobContentEditor.tsx

@@ -0,0 +1,111 @@
+import {
+  ReactCodePlugin,
+  ReactCodemirrorPlugin,
+  ReactHRPlugin,
+  ReactLinkPlugin,
+  ReactListPlugin,
+  ReactMathPlugin,
+  ReactTablePlugin,
+} from '@lobehub/editor';
+import { Editor, useEditor } from '@lobehub/editor/react';
+import { Flexbox, Icon, Text } from '@lobehub/ui';
+import { Card } from 'antd';
+import { Clock } from 'lucide-react';
+import { memo, useCallback, useEffect, useRef } from 'react';
+import { useTranslation } from 'react-i18next';
+
+interface CronJobContentEditorProps {
+  enableRichRender: boolean;
+  initialValue: string;
+  onChange: (value: string) => void;
+}
+
+const CronJobContentEditor = memo<CronJobContentEditorProps>(
+  ({ enableRichRender, initialValue, onChange }) => {
+    const { t } = useTranslation('setting');
+    const editor = useEditor();
+    const currentValueRef = useRef(initialValue);
+
+    // Update currentValueRef when initialValue changes
+    useEffect(() => {
+      currentValueRef.current = initialValue;
+    }, [initialValue]);
+
+    // Initialize editor content when editor is ready
+    useEffect(() => {
+      if (!editor) return;
+      try {
+        setTimeout(() => {
+          if (initialValue) {
+            editor.setDocument(enableRichRender ? 'markdown' : 'text', initialValue);
+          }
+        }, 100);
+      } catch (error) {
+        console.error('[CronJobContentEditor] Failed to initialize editor content:', error);
+        setTimeout(() => {
+          editor.setDocument(enableRichRender ? 'markdown' : 'text', initialValue);
+        }, 100);
+      }
+    }, [editor, enableRichRender, initialValue]);
+
+    // Handle content changes
+    const handleContentChange = useCallback(
+      (e: any) => {
+        const nextContent = enableRichRender
+          ? (e.getDocument('markdown') as unknown as string)
+          : (e.getDocument('text') as unknown as string);
+
+        const finalContent = nextContent || '';
+
+        // Only call onChange if content actually changed
+        if (finalContent !== currentValueRef.current) {
+          currentValueRef.current = finalContent;
+          onChange(finalContent);
+        }
+      },
+      [enableRichRender, onChange],
+    );
+
+    return (
+      <Flexbox gap={12}>
+        <Flexbox align="center" gap={6} horizontal>
+          <Icon icon={Clock} size={16} />
+          <Text style={{ fontWeight: 600 }}>{t('agentCronJobs.content')}</Text>
+        </Flexbox>
+        <Card
+          size="small"
+          style={{ borderRadius: 12, overflow: 'hidden' }}
+          styles={{ body: { padding: 0 } }}
+        >
+          <Flexbox padding={16} style={{ minHeight: 220 }}>
+            <Editor
+              content={''}
+              editor={editor}
+              lineEmptyPlaceholder={t('agentCronJobs.form.content.placeholder')}
+              onTextChange={handleContentChange}
+              placeholder={t('agentCronJobs.form.content.placeholder')}
+              plugins={
+                enableRichRender
+                  ? [
+                      ReactListPlugin,
+                      ReactCodePlugin,
+                      ReactCodemirrorPlugin,
+                      ReactHRPlugin,
+                      ReactLinkPlugin,
+                      ReactTablePlugin,
+                      ReactMathPlugin,
+                    ]
+                  : undefined
+              }
+              style={{ paddingBottom: 48 }}
+              type={'text'}
+              variant={'chat'}
+            />
+          </Flexbox>
+        </Card>
+      </Flexbox>
+    );
+  },
+);
+
+export default CronJobContentEditor;

package/src/app/[variants]/(main)/agent/cron/[cronId]/features/CronJobHeader.tsx

@@ -0,0 +1,45 @@
+import { Flexbox, Input } from '@lobehub/ui';
+import { Switch } from 'antd';
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+
+interface CronJobHeaderProps {
+  enabled?: boolean;
+  isNewJob?: boolean;
+  name: string;
+  onNameChange: (name: string) => void;
+  onToggleEnabled?: (enabled: boolean) => void;
+}
+
+const CronJobHeader = memo<CronJobHeaderProps>(
+  ({ enabled, isNewJob, name, onNameChange, onToggleEnabled }) => {
+    const { t } = useTranslation(['setting', 'common']);
+
+    return (
+      <Flexbox gap={16}>
+        {/* Title Input */}
+        <Input
+          onChange={(e) => onNameChange(e.target.value)}
+          placeholder={t('agentCronJobs.form.name.placeholder')}
+          style={{
+            fontSize: 28,
+            fontWeight: 600,
+            padding: 0,
+          }}
+          value={name}
+          variant={'borderless'}
+        />
+
+        {/* Controls Row */}
+        {!isNewJob && (
+          <Flexbox align="center" gap={12} horizontal>
+            {/* Enable/Disable Switch */}
+            <Switch checked={enabled ?? false} onChange={onToggleEnabled} />
+          </Flexbox>
+        )}
+      </Flexbox>
+    );
+  },
+);
+
+export default CronJobHeader;

package/src/app/[variants]/(main)/agent/cron/[cronId]/features/CronJobSaveButton.tsx

@@ -0,0 +1,31 @@
+import { Button, Flexbox } from '@lobehub/ui';
+import { Save } from 'lucide-react';
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+
+interface CronJobSaveButtonProps {
+  disabled?: boolean;
+  loading?: boolean;
+  onSave: () => void;
+}
+
+const CronJobSaveButton = memo<CronJobSaveButtonProps>(({ disabled, loading, onSave }) => {
+  const { t } = useTranslation('setting');
+
+  return (
+    <Flexbox paddingBlock={16}>
+      <Button
+        disabled={disabled}
+        icon={Save}
+        loading={loading}
+        onClick={onSave}
+        style={{ width: 200 }}
+        type="primary"
+      >
+        {t('agentCronJobs.saveAsNew', { defaultValue: 'Save as New Scheduled Task' })}
+      </Button>
+    </Flexbox>
+  );
+});
+
+export default CronJobSaveButton;