Skip to content

Commit fad2d2c

Browse files
committed
fix:create channel
1 parent cf34c6f commit fad2d2c

1 file changed

Lines changed: 107 additions & 108 deletions

File tree

src/frontend/client/src/pages/Subscription/CreateChannel/CreateChannelDrawer.tsx

Lines changed: 107 additions & 108 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ import { useConfirm, useToastContext } from "~/Providers";
55
import { NotificationSeverity } from "~/common";
66
import {
77
Sheet,
8-
SheetClose,
98
SheetContent,
109
SheetHeader,
1110
SheetTitle,
@@ -201,47 +200,48 @@ export function CreateChannelDrawer({
201200
<SheetContent
202201
side="right"
203202
hideClose
204-
className="w-full max-w-[900px] sm:max-w-[1000px] overflow-hidden bg-white pl-20 pr-20 flex flex-col"
203+
className="w-full max-w-[900px] sm:max-w-[1000px] overflow-y-auto scroll-on-scroll bg-white pl-20 pr-20 flex flex-col"
204+
onScroll={handleBodyScroll}
205+
data-scrolling={isBodyScrolling ? "true" : "false"}
205206
>
206-
<SheetClose className="ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute top-4 right-4 z-20 rounded-xs opacity-70 transition-opacity hover:opacity-100 disabled:pointer-events-none">
207+
<button
208+
type="button"
209+
onClick={() => handleClose(false)}
210+
className="ring-offset-background focus:ring-ring data-[state=open]:bg-secondary fixed top-4 right-4 z-[60] rounded-xs opacity-70 transition-opacity hover:opacity-100 disabled:pointer-events-none"
211+
>
207212
<XIcon className="size-4" />
208213
<span className="sr-only">Close</span>
209-
</SheetClose>
210-
<div
211-
className="min-h-0 flex-1 overflow-y-auto scroll-on-scroll"
212-
onScroll={handleBodyScroll}
213-
data-scrolling={isBodyScrolling ? "true" : "false"}
214-
>
215-
<SheetHeader className="sticky top-0 z-10 ml-6 mr-6 pt-6 pb-4 border-b border-[#E5E6EB] bg-white">
216-
<SheetTitle className="text-[16px] -ml-4 font-medium text-[#1D2129]">
217-
{isEditMode ? localize("com_subscription.channel_settings") : localize("com_subscription.create_channel")}
218-
</SheetTitle>
219-
</SheetHeader>
214+
</button>
215+
<SheetHeader className="sticky top-0 z-10 ml-6 mr-6 pt-6 pb-4 border-b border-[#E5E6EB] bg-white">
216+
<SheetTitle className="text-[16px] -ml-4 font-medium text-[#1D2129]">
217+
{isEditMode ? localize("com_subscription.channel_settings") : localize("com_subscription.create_channel")}
218+
</SheetTitle>
219+
</SheetHeader>
220220

221-
{form.showSuccess && !isEditMode ? (
222-
<CreateChannelSuccessContent
223-
onViewChannel={() => {
224-
if (form.createdChannelId) {
225-
onViewChannel?.(form.createdChannelId);
226-
}
227-
form.resetForm();
228-
}}
229-
onManageMembers={() => {
230-
if (form.createdChannelId) {
231-
onManageMembers?.(form.createdChannelId);
232-
onViewChannel?.(form.createdChannelId);
221+
{form.showSuccess && !isEditMode ? (
222+
<CreateChannelSuccessContent
223+
onViewChannel={() => {
224+
if (form.createdChannelId) {
225+
onViewChannel?.(form.createdChannelId);
226+
}
227+
form.resetForm();
228+
}}
229+
onManageMembers={() => {
230+
if (form.createdChannelId) {
231+
onManageMembers?.(form.createdChannelId);
232+
onViewChannel?.(form.createdChannelId);
233233

234-
}
235-
form.resetForm();
236-
onOpenChange(false);
237-
}}
238-
/>
239-
) : (
240-
<div
241-
className={cn(
242-
"overflow-visible px-6 py-5 space-y-5"
243-
)}
244-
>
234+
}
235+
form.resetForm();
236+
onOpenChange(false);
237+
}}
238+
/>
239+
) : (
240+
<div
241+
className={cn(
242+
"overflow-visible px-6 py-5 space-y-5"
243+
)}
244+
>
245245
{/* 添加信息源 */}
246246
<div className="space-y-2">
247247
<Label className="text-[14px] text-[#1D2129]">
@@ -605,83 +605,82 @@ export function CreateChannelDrawer({
605605
</div>
606606
)}
607607
</div>
608-
</div>
609-
)}
608+
</div>
609+
)}
610610

611-
{/* 底部操作按钮 */}
612-
{(!form.showSuccess || isEditMode) && (
613-
<div className="sticky bottom-0 z-10 mt-auto flex justify-end gap-3 px-6 pt-10 pb-5 border-t border-[#E5E6EB] bg-white">
614-
<Button
615-
variant="secondary"
616-
onClick={() => handleClose(false)}
617-
className="h-8 rounded-[6px] px-4 inline-flex items-center justify-center leading-none bg-[#F2F3F5] hover:bg-[#E5E6EB] border-none text-[14px] !font-normal text-[#4E5969]"
618-
>
619-
{localize("cancel")}
620-
</Button>
621-
<Button
622-
disabled={form.submitting}
623-
onClick={async () => {
624-
const data: CreateChannelFormData = {
625-
sources: form.sources,
626-
channelName: form.channelName.trim(),
627-
channelDesc: form.channelDesc.trim(),
628-
visibility: form.visibility,
629-
publishToSquare: form.publishToSquare,
630-
contentFilter: form.contentFilter,
631-
filterGroups: form.filterGroups,
632-
topFilterRelation: form.topFilterRelation,
633-
createSubChannel: form.createSubChannel,
634-
subChannels: form.subChannels
635-
};
611+
{/* 底部操作按钮 */}
612+
{(!form.showSuccess || isEditMode) && (
613+
<div className="sticky bottom-0 z-10 mt-auto flex justify-end gap-3 px-6 pt-10 pb-5 border-t border-[#E5E6EB] bg-white">
614+
<Button
615+
variant="secondary"
616+
onClick={() => handleClose(false)}
617+
className="h-8 rounded-[6px] px-4 inline-flex items-center justify-center leading-none bg-[#F2F3F5] hover:bg-[#E5E6EB] border-none text-[14px] !font-normal text-[#4E5969]"
618+
>
619+
{localize("cancel")}
620+
</Button>
621+
<Button
622+
disabled={form.submitting}
623+
onClick={async () => {
624+
const data: CreateChannelFormData = {
625+
sources: form.sources,
626+
channelName: form.channelName.trim(),
627+
channelDesc: form.channelDesc.trim(),
628+
visibility: form.visibility,
629+
publishToSquare: form.publishToSquare,
630+
contentFilter: form.contentFilter,
631+
filterGroups: form.filterGroups,
632+
topFilterRelation: form.topFilterRelation,
633+
createSubChannel: form.createSubChannel,
634+
subChannels: form.subChannels
635+
};
636636

637-
// 创建和编辑统一走同一套校验逻辑:
638-
// 1) 至少 1 个信息源
639-
// 2) 频道名称不能为空
640-
// 3) 主频道 / 子频道筛选条件中的关键词不能为空
641-
const validationError = validateCreateChannelForm(data, localize);
642-
if (validationError) {
643-
showToast({
644-
message: validationError,
645-
severity: NotificationSeverity.WARNING
646-
});
647-
return;
648-
}
637+
// 创建和编辑统一走同一套校验逻辑:
638+
// 1) 至少 1 个信息源
639+
// 2) 频道名称不能为空
640+
// 3) 主频道 / 子频道筛选条件中的关键词不能为空
641+
const validationError = validateCreateChannelForm(data, localize);
642+
if (validationError) {
643+
showToast({
644+
message: validationError,
645+
severity: NotificationSeverity.WARNING
646+
});
647+
return;
648+
}
649649

650-
if (!onConfirm) return;
651-
try {
652-
form.setSubmitting(true);
653-
const res = await onConfirm(data);
654-
if (!isEditMode) {
655-
form.setCreatedChannelId(res.channelId);
656-
form.setShowSuccess(true);
657-
} else {
658-
showToast({
659-
message: localize("com_subscription.save_success"),
660-
severity: NotificationSeverity.SUCCESS
661-
});
662-
form.resetForm();
663-
onOpenChange(false);
664-
}
665-
} catch {
650+
if (!onConfirm) return;
651+
try {
652+
form.setSubmitting(true);
653+
const res = await onConfirm(data);
654+
if (!isEditMode) {
655+
form.setCreatedChannelId(res.channelId);
656+
form.setShowSuccess(true);
657+
} else {
666658
showToast({
667-
message: localize("channel_create_failed") || localize("com_subscription.create_channel_failed_retry"),
668-
severity: NotificationSeverity.ERROR
659+
message: localize("com_subscription.save_success"),
660+
severity: NotificationSeverity.SUCCESS
669661
});
670-
} finally {
671-
form.setSubmitting(false);
662+
form.resetForm();
663+
onOpenChange(false);
672664
}
673-
}}
674-
className="h-8 rounded-[6px] px-4 inline-flex items-center justify-center leading-none bg-[#165DFF] hover:bg-[#4080FF] text-white border-none text-[14px] !font-normal disabled:opacity-50"
675-
>
676-
{isEditMode
677-
? form.submitting ? localize("com_subscription.saving") : localize("com_subscription.save")
678-
: form.submitting
679-
? (localize("creating") || localize("com_subscription.creating"))
680-
: (localize("com_subscription.confirm_creation") || localize("com_subscription.confirm_create"))}
681-
</Button>
682-
</div>
683-
)}
684-
</div>
665+
} catch {
666+
showToast({
667+
message: localize("channel_create_failed") || localize("com_subscription.create_channel_failed_retry"),
668+
severity: NotificationSeverity.ERROR
669+
});
670+
} finally {
671+
form.setSubmitting(false);
672+
}
673+
}}
674+
className="h-8 rounded-[6px] px-4 inline-flex items-center justify-center leading-none bg-[#165DFF] hover:bg-[#4080FF] text-white border-none text-[14px] !font-normal disabled:opacity-50"
675+
>
676+
{isEditMode
677+
? form.submitting ? localize("com_subscription.saving") : localize("com_subscription.save")
678+
: form.submitting
679+
? (localize("creating") || localize("com_subscription.creating"))
680+
: (localize("com_subscription.confirm_creation") || localize("com_subscription.confirm_create"))}
681+
</Button>
682+
</div>
683+
)}
685684
</SheetContent>
686685
</Sheet>
687686

0 commit comments

Comments
 (0)