From 6474504c30f1437542f3626d3dc6d3aa94ddbada Mon Sep 17 00:00:00 2001
From: suyiiyii <suyiiyii@gmail.com>
Date: Mon, 21 Oct 2024 11:22:54 +0800
Subject: [PATCH] =?UTF-8?q?:sparkles:=20(admin)=20=E6=B7=BB=E5=8A=A0?=
 =?UTF-8?q?=E9=AA=8C=E8=AF=81Cookie=E6=9C=89=E6=95=88=E6=80=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../features/cookieManager/CookieAddModal.tsx | 34 ++++++++++++++++---
 .../cookieManager/cookieConfigSlice.ts        |  2 +-
 .../cookieManager/cookieValidateReq.ts        | 20 +++++++++++
 admin-frontend/src/utils/type.ts              | 10 +++---
 4 files changed, 55 insertions(+), 11 deletions(-)
 create mode 100644 admin-frontend/src/features/cookieManager/cookieValidateReq.ts

diff --git a/admin-frontend/src/features/cookieManager/CookieAddModal.tsx b/admin-frontend/src/features/cookieManager/CookieAddModal.tsx
index 1460d31..0b0718a 100644
--- a/admin-frontend/src/features/cookieManager/CookieAddModal.tsx
+++ b/admin-frontend/src/features/cookieManager/CookieAddModal.tsx
@@ -1,6 +1,8 @@
 import React, { useState } from 'react';
 import { Form, Input, Modal } from '@arco-design/web-react';
 import { useNewCookieMutation } from './cookieConfigSlice';
+import { useAppDispatch } from '../../app/hooks';
+import validateCookie from './cookieValidateReq';
 
 interface CookieAddModalProps {
   visible: boolean;
@@ -12,10 +14,11 @@ function CookieAddModal({ visible, setVisible, siteName }: CookieAddModalProps)
   const FormItem = Form.Item;
   const [content, setContent] = useState<string>('');
   const [confirmLoading, setConfirmLoading] = useState(false);
-  const [newCoookie] = useNewCookieMutation();
+  const [newCookie] = useNewCookieMutation();
+  const dispatch = useAppDispatch();
 
   const onSubmit = () => {
-    const postPromise: ReturnType<typeof newCoookie> = newCoookie({ siteName, content });
+    const postPromise: ReturnType<typeof newCookie> = newCookie({ siteName, content });
     setConfirmLoading(true);
     postPromise.then(() => {
       setConfirmLoading(false);
@@ -35,12 +38,33 @@ function CookieAddModal({ visible, setVisible, siteName }: CookieAddModalProps)
     >
 
       <Form autoComplete="off">
-        <FormItem label="Site Name" required>
+        <FormItem label="站点" required>
           <Input placeholder="Please enter site name" value={siteName} disabled />
         </FormItem>
-        <FormItem label="Content" required>
+        <FormItem
+          label="Cookie"
+          required
+          field="content"
+          hasFeedback
+          rules={[
+            {
+              validator: (value, callback) => new Promise<void>((resolve) => {
+                dispatch(validateCookie(siteName, value))
+                  .then((res) => {
+                    if (res) {
+                      callback();
+                    } else {
+                      callback('Cookie 格式错误');
+                    }
+                    resolve();
+                  });
+              }),
+            },
+          ]}
+
+        >
           <Input.TextArea
-            placeholder="Please enter content"
+            placeholder="请输入 Cookie"
             value={content}
             onChange={setContent}
           />
diff --git a/admin-frontend/src/features/cookieManager/cookieConfigSlice.ts b/admin-frontend/src/features/cookieManager/cookieConfigSlice.ts
index 683d7cc..497b270 100644
--- a/admin-frontend/src/features/cookieManager/cookieConfigSlice.ts
+++ b/admin-frontend/src/features/cookieManager/cookieConfigSlice.ts
@@ -40,7 +40,7 @@ export const cookieTargetApi = createApi({
   baseQuery: baseQueryWithAuth,
   tagTypes: ['CookieTarget'],
   endpoints: (builder) => ({
-    getCookieTargets: builder.query<CookieTarget[], {cookieId: number }>({
+    getCookieTargets: builder.query<CookieTarget[], { cookieId: number }>({
       query: ({ cookieId }) => `/cookie_target?cookie_id=${cookieId}`,
       providesTags: ['CookieTarget'],
     }),
diff --git a/admin-frontend/src/features/cookieManager/cookieValidateReq.ts b/admin-frontend/src/features/cookieManager/cookieValidateReq.ts
new file mode 100644
index 0000000..6e8e5cb
--- /dev/null
+++ b/admin-frontend/src/features/cookieManager/cookieValidateReq.ts
@@ -0,0 +1,20 @@
+import { AppThunk } from '../../app/store';
+import { baseUrl } from '../../utils/urls';
+
+// eslint-disable-next-line
+export const validCookie =
+  (siteName: string, content: string): AppThunk<Promise<string>> => async (_, getState) => {
+    const url = `${baseUrl}cookie/validate?site_name=${siteName}&content=${content}`;
+    const state = getState();
+    const authToken = state.auth.token;
+    const res = await fetch(url, {
+      headers: {
+        Authorization: `Bearer ${authToken}`,
+      },
+      method: 'POST',
+    });
+    const resObj = await res.json();
+    return resObj.ok;
+  };
+
+export default validCookie;
diff --git a/admin-frontend/src/utils/type.ts b/admin-frontend/src/utils/type.ts
index 6b224fe..a32d58b 100644
--- a/admin-frontend/src/utils/type.ts
+++ b/admin-frontend/src/utils/type.ts
@@ -33,8 +33,8 @@ export interface PlatformConfig {
 }
 
 export interface SiteConfig {
-  name: string
-  enable_cookie: string
+  name: string;
+  enable_cookie: string;
 }
 
 export interface SubscribeConfig {
@@ -106,12 +106,12 @@ export interface CookieTarget {
 }
 
 export interface NewCookieParam {
-  siteName: string
-  content: string
+  siteName: string;
+  content: string;
 }
 
 export interface DelCookieParam {
-  cookieId: string
+  cookieId: string;
 }
 
 export interface NewCookieTargetParam {