From 2b98e6ef5e76f15b7accb95b1af3ada9bfabd216 Mon Sep 17 00:00:00 2001
From: Stephen Zhou <38493346+hyoban@users.noreply.github.com>
Date: Mon, 21 Oct 2024 22:26:14 +0800
Subject: [PATCH] feat: allow disable action

close https://github.com/RSSNext/Follow/issues/989
---
 .../src/components/ui/input/Input.tsx         |  1 +
 apps/renderer/src/models/types.ts             |  1 +
 .../src/modules/settings/action-card.tsx      | 77 ++++++++++++++-----
 packages/shared/src/hono.ts                   | 17 ++++
 4 files changed, 78 insertions(+), 18 deletions(-)

diff --git a/apps/renderer/src/components/ui/input/Input.tsx b/apps/renderer/src/components/ui/input/Input.tsx
index f1ad58703..77a836ef8 100644
--- a/apps/renderer/src/components/ui/input/Input.tsx
+++ b/apps/renderer/src/components/ui/input/Input.tsx
@@ -24,6 +24,7 @@ export const Input = forwardRef<
         "border border-border",
         "placeholder:text-theme-placeholder-text dark:bg-zinc-700/[0.15] dark:text-zinc-200",
         "hover:border-accent/60",
+        "disabled:cursor-not-allowed disabled:opacity-50",
         props.type === "password" ? "font-mono placeholder:font-sans" : "font-sans",
         "w-full",
         className,
diff --git a/apps/renderer/src/models/types.ts b/apps/renderer/src/models/types.ts
index 822eb8acf..851b6736f 100644
--- a/apps/renderer/src/models/types.ts
+++ b/apps/renderer/src/models/types.ts
@@ -101,6 +101,7 @@ export type ActionsInput = {
     value?: string
   }[]
   result: {
+    disabled?: boolean
     translation?: string
     summary?: boolean
     readability?: boolean
diff --git a/apps/renderer/src/modules/settings/action-card.tsx b/apps/renderer/src/modules/settings/action-card.tsx
index db4762545..899d45d11 100644
--- a/apps/renderer/src/modules/settings/action-card.tsx
+++ b/apps/renderer/src/modules/settings/action-card.tsx
@@ -73,7 +73,7 @@ const DeleteTableCell = ({ disabled, onClick }: { disabled?: boolean; onClick?:
   </TableCell>
 )
 
-const AddTableRow = ({ onClick }: { onClick?: () => void }) => {
+const AddTableRow = ({ onClick, disabled }: { onClick?: () => void; disabled?: boolean }) => {
   const { t } = useTranslation("settings")
   return (
     <Button
@@ -81,6 +81,7 @@ const AddTableRow = ({ onClick }: { onClick?: () => void }) => {
       className="mt-1 w-full gap-1"
       buttonClassName="py-1"
       onClick={onClick}
+      disabled={disabled}
     >
       <i className="i-mgc-add-cute-re" /> {t("actions.action_card.add")}
     </Button>
@@ -91,10 +92,12 @@ const OperationTableCell = ({
   type,
   value,
   onValueChange,
+  disabled,
 }: {
   type: string
   value?: ActionOperation
   onValueChange?: (value: ActionOperation) => void
+  disabled?: boolean
 }) => {
   const { t } = useTranslation("settings")
 
@@ -141,7 +144,7 @@ const OperationTableCell = ({
   const options = OperationOptions.filter((option) => option.types.includes(type))
   return (
     <TableCell size="sm">
-      <Select value={value} onValueChange={onValueChange}>
+      <Select disabled={disabled} value={value} onValueChange={onValueChange}>
         <SelectTrigger className="h-8">
           <SelectValue />
         </SelectTrigger>
@@ -260,6 +263,8 @@ export function ActionCard({
     ]
   }, [t])
 
+  const { disabled } = data.result
+
   return (
     <Card>
       <CardHeader className="space-y-4 px-6 py-4">
@@ -287,6 +292,14 @@ export function ActionCard({
               />
 
               <div className="name-placeholder flex-1 text-sm">{data.name}</div>
+              <Switch
+                checked={!data.result.disabled}
+                onCheckedChange={(checked) => {
+                  data.result.disabled = !checked
+                  onChange(data)
+                }}
+                onClick={stopPropagation}
+              />
             </div>
           }
         >
@@ -307,8 +320,12 @@ export function ActionCard({
                     onChange(data)
                   }}
                 >
-                  <Radio label={t("actions.action_card.all")} value="all" />
-                  <Radio label={t("actions.action_card.custom_filters")} value="filter" />
+                  <Radio disabled={disabled} label={t("actions.action_card.all")} value="all" />
+                  <Radio
+                    disabled={disabled}
+                    label={t("actions.action_card.custom_filters")}
+                    value="filter"
+                  />
                 </RadioGroup>
               </div>
 
@@ -331,6 +348,7 @@ export function ActionCard({
                         return (
                           <TableRow key={conditionIdx}>
                             <DeleteTableCell
+                              disabled={disabled}
                               onClick={() => {
                                 data.condition.splice(conditionIdx, 1)
                                 onChange(data)
@@ -338,6 +356,7 @@ export function ActionCard({
                             />
                             <TableCell size="sm">
                               <Select
+                                disabled={disabled}
                                 value={condition.field}
                                 onValueChange={(value: ActionFeedField) => change("field", value)}
                               >
@@ -353,12 +372,14 @@ export function ActionCard({
                             </TableCell>
                             <OperationTableCell
                               type={type}
+                              disabled={disabled}
                               value={condition.operator}
                               onValueChange={(value) => change("operator", value)}
                             />
                             <TableCell size="sm">
                               {type === "view" ? (
                                 <Select
+                                  disabled={disabled}
                                   onValueChange={(value) => change("value", value)}
                                   value={condition.value}
                                 >
@@ -367,6 +388,7 @@ export function ActionCard({
                                 </Select>
                               ) : (
                                 <Input
+                                  disabled={disabled}
                                   type={type}
                                   value={condition.value}
                                   className="h-8"
@@ -380,6 +402,7 @@ export function ActionCard({
                     </TableBody>
                   </Table>
                   <AddTableRow
+                    disabled={disabled}
                     onClick={() => {
                       data.condition.push({})
                       onChange(data)
@@ -396,6 +419,7 @@ export function ActionCard({
                     {t("actions.action_card.generate_summary")}
                   </span>
                   <Switch
+                    disabled={disabled}
                     checked={data.result.summary}
                     onCheckedChange={(checked) => {
                       data.result.summary = checked
@@ -410,6 +434,7 @@ export function ActionCard({
                     {t("actions.action_card.translate_into")}
                   </span>
                   <Select
+                    disabled={disabled}
                     value={data.result.translation}
                     onValueChange={(value) => {
                       if (value === "none") {
@@ -443,6 +468,7 @@ export function ActionCard({
                     {t("actions.action_card.enable_readability")}
                   </span>
                   <Switch
+                    disabled={disabled}
                     checked={data.result.readability}
                     onCheckedChange={(checked) => {
                       data.result.readability = checked
@@ -452,11 +478,27 @@ export function ActionCard({
                 </div>
                 <Divider />
 
+                <div className="flex w-full items-center justify-between">
+                  <span className="w-0 shrink grow truncate">
+                    {t("actions.action_card.source_content")}
+                  </span>
+                  <Switch
+                    disabled={disabled}
+                    checked={data.result.sourceContent}
+                    onCheckedChange={(checked) => {
+                      data.result.sourceContent = checked
+                      onChange(data)
+                    }}
+                  />
+                </div>
+                <Divider />
+
                 <div className="flex w-full items-center justify-between">
                   <span className="w-0 shrink grow truncate">
                     {t("actions.action_card.new_entry_notification")}
                   </span>
                   <Switch
+                    disabled={disabled}
                     checked={data.result.newEntryNotification}
                     onCheckedChange={(checked) => {
                       data.result.newEntryNotification = checked
@@ -471,6 +513,7 @@ export function ActionCard({
                     {t("actions.action_card.silence")}
                   </span>
                   <Switch
+                    disabled={disabled}
                     checked={data.result.silence}
                     onCheckedChange={(checked) => {
                       data.result.silence = checked
@@ -480,20 +523,6 @@ export function ActionCard({
                 </div>
                 <Divider />
 
-                <div className="flex w-full items-center justify-between">
-                  <span className="w-0 shrink grow truncate">
-                    {t("actions.action_card.source_content")}
-                  </span>
-                  <Switch
-                    checked={data.result.sourceContent}
-                    onCheckedChange={(checked) => {
-                      data.result.sourceContent = checked
-                      onChange(data)
-                    }}
-                  />
-                </div>
-                <Divider />
-
                 <SettingCollapsible
                   title={t("actions.action_card.rewrite_rules")}
                   onOpenChange={(open) => {
@@ -529,6 +558,7 @@ export function ActionCard({
                           return (
                             <TableRow key={rewriteIdx}>
                               <DeleteTableCell
+                                disabled={disabled}
                                 onClick={() => {
                                   if (data.result.rewriteRules?.length === 1) {
                                     delete data.result.rewriteRules
@@ -540,6 +570,7 @@ export function ActionCard({
                               />
                               <TableCell size="sm">
                                 <Input
+                                  disabled={disabled}
                                   value={rule.from}
                                   className="h-8"
                                   onChange={(e) => change("from", e.target.value)}
@@ -547,6 +578,7 @@ export function ActionCard({
                               </TableCell>
                               <TableCell size="sm">
                                 <Input
+                                  disabled={disabled}
                                   value={rule.to}
                                   className="h-8"
                                   onChange={(e) => change("to", e.target.value)}
@@ -559,6 +591,7 @@ export function ActionCard({
                     </Table>
                   )}
                   <AddTableRow
+                    disabled={disabled}
                     onClick={() => {
                       if (!data.result.rewriteRules) {
                         data.result.rewriteRules = []
@@ -596,6 +629,7 @@ export function ActionCard({
                           return (
                             <TableRow key={index}>
                               <DeleteTableCell
+                                disabled={disabled}
                                 onClick={() => {
                                   if (data.result.blockRules?.length === 1) {
                                     delete data.result.blockRules
@@ -607,6 +641,7 @@ export function ActionCard({
                               />
                               <TableCell size="sm">
                                 <Select
+                                  disabled={disabled}
                                   value={rule.field}
                                   onValueChange={(value) => change("field", value)}
                                 >
@@ -621,12 +656,14 @@ export function ActionCard({
                                 </Select>
                               </TableCell>
                               <OperationTableCell
+                                disabled={disabled}
                                 type={type}
                                 value={rule.operator}
                                 onValueChange={(value) => change("operator", value)}
                               />
                               <TableCell size="sm">
                                 <Input
+                                  disabled={disabled}
                                   type={type}
                                   value={rule.value}
                                   className="h-8"
@@ -640,6 +677,7 @@ export function ActionCard({
                     </Table>
                   )}
                   <AddTableRow
+                    disabled={disabled}
                     onClick={() => {
                       if (!data.result.blockRules) {
                         data.result.blockRules = []
@@ -666,6 +704,7 @@ export function ActionCard({
                         return (
                           <div key={rewriteIdx} className="flex items-center gap-2">
                             <DeleteTableCell
+                              disabled={disabled}
                               onClick={() => {
                                 if (data.result.webhooks?.length === 1) {
                                   delete data.result.webhooks
@@ -676,6 +715,7 @@ export function ActionCard({
                               }}
                             />
                             <Input
+                              disabled={disabled}
                               value={webhook}
                               className="h-8"
                               placeholder="https://"
@@ -690,6 +730,7 @@ export function ActionCard({
                     </>
                   )}
                   <AddTableRow
+                    disabled={disabled}
                     onClick={() => {
                       if (!data.result.webhooks) {
                         data.result.webhooks = []
diff --git a/packages/shared/src/hono.ts b/packages/shared/src/hono.ts
index 6d410905f..02e5d0e77 100644
--- a/packages/shared/src/hono.ts
+++ b/packages/shared/src/hono.ts
@@ -213,6 +213,7 @@ declare const actions: drizzle_orm_pg_core.PgTableWithColumns<{
                     value: string;
                 }[];
                 result: {
+                    disabled?: boolean;
                     translation?: z.infer<typeof languageSchema>;
                     summary?: boolean;
                     readability?: boolean;
@@ -260,6 +261,7 @@ declare const actionsItemOpenAPISchema: z.ZodObject<{
         operator: "contains" | "not_contains" | "eq" | "not_eq" | "gt" | "lt" | "regex";
     }>, "many">;
     result: z.ZodObject<{
+        disabled: z.ZodOptional<z.ZodBoolean>;
         translation: z.ZodOptional<z.ZodEnum<["en", "ja", "zh-CN", "zh-TW"]>>;
         summary: z.ZodOptional<z.ZodBoolean>;
         readability: z.ZodOptional<z.ZodBoolean>;
@@ -292,6 +294,7 @@ declare const actionsItemOpenAPISchema: z.ZodObject<{
         webhooks: z.ZodOptional<z.ZodArray<z.ZodString, "many">>;
     }, "strip", z.ZodTypeAny, {
         summary?: boolean | undefined;
+        disabled?: boolean | undefined;
         translation?: "en" | "ja" | "zh-CN" | "zh-TW" | undefined;
         readability?: boolean | undefined;
         sourceContent?: boolean | undefined;
@@ -309,6 +312,7 @@ declare const actionsItemOpenAPISchema: z.ZodObject<{
         webhooks?: string[] | undefined;
     }, {
         summary?: boolean | undefined;
+        disabled?: boolean | undefined;
         translation?: "en" | "ja" | "zh-CN" | "zh-TW" | undefined;
         readability?: boolean | undefined;
         sourceContent?: boolean | undefined;
@@ -329,6 +333,7 @@ declare const actionsItemOpenAPISchema: z.ZodObject<{
     name: string;
     result: {
         summary?: boolean | undefined;
+        disabled?: boolean | undefined;
         translation?: "en" | "ja" | "zh-CN" | "zh-TW" | undefined;
         readability?: boolean | undefined;
         sourceContent?: boolean | undefined;
@@ -354,6 +359,7 @@ declare const actionsItemOpenAPISchema: z.ZodObject<{
     name: string;
     result: {
         summary?: boolean | undefined;
+        disabled?: boolean | undefined;
         translation?: "en" | "ja" | "zh-CN" | "zh-TW" | undefined;
         readability?: boolean | undefined;
         sourceContent?: boolean | undefined;
@@ -400,6 +406,7 @@ declare const actionsOpenAPISchema: z.ZodObject<z.objectUtil.extendShape<Omit<{
             operator: "contains" | "not_contains" | "eq" | "not_eq" | "gt" | "lt" | "regex";
         }>, "many">;
         result: z.ZodObject<{
+            disabled: z.ZodOptional<z.ZodBoolean>;
             translation: z.ZodOptional<z.ZodEnum<["en", "ja", "zh-CN", "zh-TW"]>>;
             summary: z.ZodOptional<z.ZodBoolean>;
             readability: z.ZodOptional<z.ZodBoolean>;
@@ -432,6 +439,7 @@ declare const actionsOpenAPISchema: z.ZodObject<z.objectUtil.extendShape<Omit<{
             webhooks: z.ZodOptional<z.ZodArray<z.ZodString, "many">>;
         }, "strip", z.ZodTypeAny, {
             summary?: boolean | undefined;
+            disabled?: boolean | undefined;
             translation?: "en" | "ja" | "zh-CN" | "zh-TW" | undefined;
             readability?: boolean | undefined;
             sourceContent?: boolean | undefined;
@@ -449,6 +457,7 @@ declare const actionsOpenAPISchema: z.ZodObject<z.objectUtil.extendShape<Omit<{
             webhooks?: string[] | undefined;
         }, {
             summary?: boolean | undefined;
+            disabled?: boolean | undefined;
             translation?: "en" | "ja" | "zh-CN" | "zh-TW" | undefined;
             readability?: boolean | undefined;
             sourceContent?: boolean | undefined;
@@ -469,6 +478,7 @@ declare const actionsOpenAPISchema: z.ZodObject<z.objectUtil.extendShape<Omit<{
         name: string;
         result: {
             summary?: boolean | undefined;
+            disabled?: boolean | undefined;
             translation?: "en" | "ja" | "zh-CN" | "zh-TW" | undefined;
             readability?: boolean | undefined;
             sourceContent?: boolean | undefined;
@@ -494,6 +504,7 @@ declare const actionsOpenAPISchema: z.ZodObject<z.objectUtil.extendShape<Omit<{
         name: string;
         result: {
             summary?: boolean | undefined;
+            disabled?: boolean | undefined;
             translation?: "en" | "ja" | "zh-CN" | "zh-TW" | undefined;
             readability?: boolean | undefined;
             sourceContent?: boolean | undefined;
@@ -522,6 +533,7 @@ declare const actionsOpenAPISchema: z.ZodObject<z.objectUtil.extendShape<Omit<{
         name: string;
         result: {
             summary?: boolean | undefined;
+            disabled?: boolean | undefined;
             translation?: "en" | "ja" | "zh-CN" | "zh-TW" | undefined;
             readability?: boolean | undefined;
             sourceContent?: boolean | undefined;
@@ -550,6 +562,7 @@ declare const actionsOpenAPISchema: z.ZodObject<z.objectUtil.extendShape<Omit<{
         name: string;
         result: {
             summary?: boolean | undefined;
+            disabled?: boolean | undefined;
             translation?: "en" | "ja" | "zh-CN" | "zh-TW" | undefined;
             readability?: boolean | undefined;
             sourceContent?: boolean | undefined;
@@ -5841,6 +5854,7 @@ declare const _routes: hono_hono_base.HonoBase<Env, {
                     } | undefined;
                     settings?: {
                         summary?: boolean | undefined;
+                        disabled?: boolean | undefined;
                         translation?: "en" | "ja" | "zh-CN" | "zh-TW" | undefined;
                         readability?: boolean | undefined;
                         sourceContent?: boolean | undefined;
@@ -6088,6 +6102,7 @@ declare const _routes: hono_hono_base.HonoBase<Env, {
                     } | undefined;
                     settings?: {
                         summary?: boolean | undefined;
+                        disabled?: boolean | undefined;
                         translation?: "en" | "ja" | "zh-CN" | "zh-TW" | undefined;
                         readability?: boolean | undefined;
                         sourceContent?: boolean | undefined;
@@ -6585,6 +6600,7 @@ declare const _routes: hono_hono_base.HonoBase<Env, {
                         name: string;
                         result: {
                             summary?: boolean | undefined;
+                            disabled?: boolean | undefined;
                             translation?: "en" | "ja" | "zh-CN" | "zh-TW" | undefined;
                             readability?: boolean | undefined;
                             sourceContent?: boolean | undefined;
@@ -6619,6 +6635,7 @@ declare const _routes: hono_hono_base.HonoBase<Env, {
                         name: string;
                         result: {
                             summary?: boolean | undefined;
+                            disabled?: boolean | undefined;
                             translation?: "en" | "ja" | "zh-CN" | "zh-TW" | undefined;
                             readability?: boolean | undefined;
                             sourceContent?: boolean | undefined;