chore: import upstream snapshot with attribution

2026-07-13 13:32:57 +08:00
commit cd420f9332
4811 changed files with 884702 additions and 0 deletions
@@ -0,0 +1,94 @@
+import { Header3 } from "~/components/primitives/Headers";
+import { InfoIconTooltip, SimpleTooltip } from "~/components/primitives/Tooltip";
+import { useOrganization } from "~/hooks/useOrganizations";
+import { v3SchedulesAddOnPath } from "~/utils/pathBuilder";
+import { ScheduleLimitActions } from "./ScheduleLimitActions";
+import { type SchedulePricing } from "./PurchaseSchedulesModal";
+
+type Props = {
+  limits: { used: number; limit: number };
+  /** True when the user has used all available schedules and cannot exceed the plan limit. */
+  requiresUpgrade: boolean;
+  /** True when the plan would let them upgrade (vs being already on the highest plan). */
+  canUpgrade: boolean;
+  canPurchaseSchedules: boolean;
+  extraSchedules: number;
+  maxScheduleQuota: number;
+  planScheduleLimit: number;
+  schedulePricing: SchedulePricing | null;
+};
+
+export function SchedulesUsageBar({
+  limits,
+  requiresUpgrade,
+  canUpgrade,
+  canPurchaseSchedules,
+  extraSchedules,
+  maxScheduleQuota,
+  planScheduleLimit,
+  schedulePricing,
+}: Props) {
+  const organization = useOrganization();
+  const actionPath = v3SchedulesAddOnPath(organization);
+  const ratio = limits.limit > 0 ? Math.min(limits.used / limits.limit, 1) : 0;
+
+  return (
+    <div className="flex w-full items-start justify-between">
+      <div className="flex h-fit w-full items-center gap-4 border-t border-grid-bright bg-background-bright p-[0.86rem] pl-4">
+        <SimpleTooltip
+          button={
+            <div className="size-6">
+              <svg className="h-full w-full -rotate-90 overflow-visible">
+                <circle
+                  className="fill-none stroke-grid-bright"
+                  strokeWidth="4"
+                  r="10"
+                  cx="12"
+                  cy="12"
+                />
+                <circle
+                  className={`fill-none ${requiresUpgrade ? "stroke-error" : "stroke-success"}`}
+                  strokeWidth="4"
+                  r="10"
+                  cx="12"
+                  cy="12"
+                  strokeDasharray={`${ratio * 62.8} 62.8`}
+                  strokeDashoffset="0"
+                  strokeLinecap="round"
+                />
+              </svg>
+            </div>
+          }
+          content={`${Math.round(ratio * 100)}%`}
+        />
+        <div className="flex w-full items-center justify-between gap-6">
+          {requiresUpgrade ? (
+            <Header3 className="text-error">
+              You've used all {limits.limit} of your available schedules. Upgrade your plan to
+              enable more.
+            </Header3>
+          ) : (
+            <div className="flex items-center gap-1">
+              <Header3>
+                You've used {limits.used}/{limits.limit} of your schedules
+              </Header3>
+              <InfoIconTooltip content="Schedules created in Dev don't count towards your limit." />
+            </div>
+          )}
+
+          <ScheduleLimitActions
+            actionPath={actionPath}
+            canPurchaseSchedules={canPurchaseSchedules}
+            schedulePricing={schedulePricing}
+            extraSchedules={extraSchedules}
+            limits={limits}
+            maxScheduleQuota={maxScheduleQuota}
+            planScheduleLimit={planScheduleLimit}
+            canUpgrade={canUpgrade}
+            organization={organization}
+          />
+        </div>
+      </div>
+    </div>
+  );
+}