From 7171eaf0b55b0452941326de1387b469d6de4b63 Mon Sep 17 00:00:00 2001
From: yyh <yuanyouhuilyz@gmail.com>
Date: Wed, 10 Dec 2025 15:25:38 +0800
Subject: [PATCH 1/2] refactor: replace Modal with PlanUpgradeModal in
 TriggerEventsLimitModal

---
 .../index.module.css                          | 29 --------
 .../trigger-events-limit-modal/index.tsx      | 71 +++++--------------
 2 files changed, 18 insertions(+), 82 deletions(-)
 delete mode 100644 web/app/components/billing/trigger-events-limit-modal/index.module.css

diff --git a/web/app/components/billing/trigger-events-limit-modal/index.module.css b/web/app/components/billing/trigger-events-limit-modal/index.module.css
deleted file mode 100644
index 50ad488388..0000000000
--- a/web/app/components/billing/trigger-events-limit-modal/index.module.css
+++ /dev/null
@@ -1,29 +0,0 @@
-.surface {
-  border: 0.5px solid var(--color-components-panel-border, rgba(16, 24, 40, 0.08));
-  background:
-    linear-gradient(109deg, var(--color-background-section, #f9fafb) 0%, var(--color-background-section-burn, #f2f4f7) 100%),
-    var(--color-components-panel-bg, #fff);
-}
-
-.heroOverlay {
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='54' height='54' fill='none'%3E%3Crect x='1' y='1' width='48' height='48' rx='12' stroke='rgba(16, 24, 40, 0.3)' stroke-width='1' opacity='0.08'/%3E%3C/svg%3E");
-  background-size: 54px 54px;
-  background-position: 31px -23px;
-  background-repeat: repeat;
-  mask-image: linear-gradient(180deg, rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 0) 75%);
-  -webkit-mask-image: linear-gradient(180deg, rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 0) 75%);
-}
-
-.icon {
-  border: 0.5px solid transparent;
-  background:
-    linear-gradient(180deg, var(--color-components-avatar-bg-mask-stop-0, rgba(255, 255, 255, 0.12)) 0%, var(--color-components-avatar-bg-mask-stop-100, rgba(255, 255, 255, 0.08)) 100%),
-    var(--color-util-colors-blue-brand-blue-brand-500, #296dff);
-}
-
-.highlight {
-  background: linear-gradient(97deg, var(--color-components-input-border-active-prompt-1, rgba(11, 165, 236, 0.95)) -4%, var(--color-components-input-border-active-prompt-2, rgba(21, 90, 239, 0.95)) 45%);
-  -webkit-background-clip: text;
-  background-clip: text;
-  -webkit-text-fill-color: transparent;
-}
diff --git a/web/app/components/billing/trigger-events-limit-modal/index.tsx b/web/app/components/billing/trigger-events-limit-modal/index.tsx
index 9434e12441..9176c3d542 100644
--- a/web/app/components/billing/trigger-events-limit-modal/index.tsx
+++ b/web/app/components/billing/trigger-events-limit-modal/index.tsx
@@ -2,12 +2,9 @@
 import type { FC } from 'react'
 import React from 'react'
 import { useTranslation } from 'react-i18next'
-import Modal from '@/app/components/base/modal'
-import Button from '@/app/components/base/button'
 import { TriggerAll } from '@/app/components/base/icons/src/vender/workflow'
 import UsageInfo from '@/app/components/billing/usage-info'
-import UpgradeBtn from '@/app/components/billing/upgrade-btn'
-import styles from './index.module.css'
+import PlanUpgradeModal from '@/app/components/billing/plan-upgrade-modal'
 
 type Props = {
   show: boolean
@@ -29,57 +26,25 @@ const TriggerEventsLimitModal: FC<Props> = ({
   const { t } = useTranslation()
 
   return (
-    <Modal
-      isShow={show}
+    <PlanUpgradeModal
+      show={show}
       onClose={onClose}
-      closable={false}
-      clickOutsideNotClose
-      className={`${styles.surface} w-[580px] rounded-2xl !p-0`}
-    >
-      <div className='relative'>
-        <div
-          aria-hidden
-          className={`${styles.heroOverlay} pointer-events-none absolute inset-0`}
+      onUpgrade={onUpgrade}
+      Icon={TriggerAll as React.ComponentType<React.SVGProps<SVGSVGElement>>}
+      title={t('billing.triggerLimitModal.title')}
+      description={t('billing.triggerLimitModal.description')}
+      extraInfo={(
+        <UsageInfo
+          className='mt-4 w-full rounded-[12px] bg-components-panel-on-panel-item-bg'
+          Icon={TriggerAll}
+          name={t('billing.triggerLimitModal.usageTitle')}
+          usage={usage}
+          total={total}
+          resetInDays={resetInDays}
+          hideIcon
         />
-        <div className='px-8 pt-8'>
-          <div className={`${styles.icon} flex size-12 items-center justify-center rounded-xl shadow-lg backdrop-blur-[5px]`}>
-            <TriggerAll className='size-6 text-text-primary-on-surface' />
-          </div>
-          <div className='mt-6 space-y-2'>
-            <div className={`${styles.highlight} title-3xl-semi-bold`}>
-              {t('billing.triggerLimitModal.title')}
-            </div>
-            <div className='system-md-regular text-text-tertiary'>
-              {t('billing.triggerLimitModal.description')}
-            </div>
-          </div>
-          <UsageInfo
-            className='mt-4 w-full rounded-[12px] bg-components-panel-on-panel-item-bg'
-            Icon={TriggerAll}
-            name={t('billing.triggerLimitModal.usageTitle')}
-            usage={usage}
-            total={total}
-            resetInDays={resetInDays}
-            hideIcon
-          />
-        </div>
-      </div>
-
-      <div className='mb-8 mt-10 flex justify-end space-x-2 px-8'>
-        <Button
-          onClick={onClose}
-        >
-          {t('billing.triggerLimitModal.dismiss')}
-        </Button>
-        <UpgradeBtn
-          isShort
-          onClick={onUpgrade}
-          className='!h-8 !rounded-lg'
-          labelKey='billing.triggerLimitModal.upgrade'
-          loc='trigger-events-limit-modal'
-        />
-      </div>
-    </Modal>
+      )}
+    />
   )
 }
 

From 55dd5f71d775f594d3cdea0f327b612871063933 Mon Sep 17 00:00:00 2001
From: Joel <iamjoel007@gmail.com>
Date: Wed, 10 Dec 2025 15:36:18 +0800
Subject: [PATCH 2/2] fix: can add logic

---
 web/app/components/datasets/create/step-one/index.tsx         | 4 +++-
 .../datasets/documents/detail/segment-add/index.tsx           | 2 +-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/web/app/components/datasets/create/step-one/index.tsx b/web/app/components/datasets/create/step-one/index.tsx
index 523bf6e141..966aaa8479 100644
--- a/web/app/components/datasets/create/step-one/index.tsx
+++ b/web/app/components/datasets/create/step-one/index.tsx
@@ -24,6 +24,7 @@ import NotionConnector from '@/app/components/base/notion-connector'
 import type { DataSourceAuth } from '@/app/components/header/account-setting/data-source-page-new/types'
 import PlanUpgradeModal from '@/app/components/billing/plan-upgrade-modal'
 import { useBoolean } from 'ahooks'
+import { Plan } from '@/app/components/billing/type'
 
 type IStepOneProps = {
   datasetId?: string
@@ -112,7 +113,8 @@ const StepOne = ({
   const hasNotin = notionPages.length > 0
   const isVectorSpaceFull = plan.usage.vectorSpace >= plan.total.vectorSpace
   const isShowVectorSpaceFull = (allFileLoaded || hasNotin) && isVectorSpaceFull && enableBilling
-  const notSupportBatchUpload = enableBilling && plan.type === 'sandbox'
+  const supportBatchUpload = !enableBilling || plan.type !== Plan.sandbox
+  const notSupportBatchUpload = !supportBatchUpload
 
   const [isShowPlanUpgradeModal, {
     setTrue: showPlanUpgradeModal,
diff --git a/web/app/components/datasets/documents/detail/segment-add/index.tsx b/web/app/components/datasets/documents/detail/segment-add/index.tsx
index 22e4a478ef..5204354138 100644
--- a/web/app/components/datasets/documents/detail/segment-add/index.tsx
+++ b/web/app/components/datasets/documents/detail/segment-add/index.tsx
@@ -44,7 +44,7 @@ const SegmentAdd: FC<ISegmentAddProps> = ({
   }] = useBoolean(false)
   const { plan, enableBilling } = useProviderContext()
   const { usage, total } = plan
-  const canAdd = enableBilling && (usage.vectorSpace < total.vectorSpace)
+  const canAdd = enableBilling ? (usage.vectorSpace < total.vectorSpace) : true
 
   const withNeedUpgradeCheck = useCallback((fn: () => void) => {
     return () => {