optimize: build card

src/main.tsx

@@ -20,15 +20,15 @@ import "@/styles/core.scss";
 import "@/styles/inject.scss";
 
 import { ProConfigProvider } from "@ant-design/pro-provider";
-import { ConfigProvider, App } from "antd";
+import { App, ConfigProvider } from "antd";
 import zhCN from "antd/locale/zh_CN";
 import React from "react";
 import ReactDOM from "react-dom/client";
 
-import { NeosRouter } from "./ui/NeosRouter";
-
 import { theme } from "@/ui/theme";
 
+import { NeosRouter } from "./ui/NeosRouter";
+
 const root = ReactDOM.createRoot(
   document.getElementById("root") as HTMLElement
 );

src/ui/BuildDeck/Filter.tsx

@@ -3,10 +3,11 @@ import {
   Checkbox,
   Form,
   Input,
+  InputNumber,
   Select,
   type SelectProps,
-  InputNumber,
 } from "antd";
+
 import styles from "./Filter.module.scss";
 
 const options: SelectProps["options"] = [];
@@ -102,7 +103,7 @@ export const Filter: React.FC = () => {
       </div>
       <div className={styles.btns}>
         <Button type="primary">确定</Button>
-        <Button type="text">取消</Button>
+        <Button type="text">取&nbsp;消</Button>
       </div>
     </>
   );

src/ui/BuildDeck/index.tsx

@@ -8,14 +8,14 @@ import {
   UndoOutlined,
 } from "@ant-design/icons";
 import {
+  App,
   Badge,
   Button,
   ConfigProvider,
   Input,
+  message,
   Space,
   type ThemeConfig,
-  message,
-  App,
 } from "antd";
 import { memo, useEffect, useRef, useState } from "react";
 import { DndProvider, useDrag, useDrop } from "react-dnd";
@@ -26,6 +26,7 @@ import { proxy, useSnapshot } from "valtio";
 import { subscribeKey } from "valtio/utils";
 
 import { type CardMeta, searchCards } from "@/api";
+import { isExtraDeckCard, isToken } from "@/common";
 import { deckStore, type IDeck, initStore } from "@/stores";
 import {
   Background,
@@ -47,7 +48,6 @@ import {
   iDeckToEditingDeck,
   type Type,
 } from "./utils";
-import { isToken } from "@/common";
 
 const theme: ThemeConfig = {
   components: {
@@ -331,10 +331,19 @@ const DeckZone: React.FC<{
 const SearchResults: React.FC<{
   results: CardMeta[];
 }> = memo(({ results }) => {
+  const handleClick = (card: CardMeta) => {
+    const type = isExtraDeckCard(card.data.type ?? 0) ? "extra" : "main";
+    canAdd(card, type, editDeckStore).result && editDeckStore.add(type, card);
+  };
   return (
     <div className={styles["search-cards"]}>
-      {results.map((item) => (
-        <Card value={item} key={v4uuid()} source="search" />
+      {results.map((card) => (
+        <Card
+          value={card}
+          key={v4uuid()}
+          source="search"
+          onClick={() => handleClick(card)}
+        />
       ))}
     </div>
   );

src/ui/Duel/Main.tsx

@@ -15,8 +15,7 @@ import {
   SortCardModal,
   YesNoModal,
 } from "./Message";
-import { LifeBar, Mat, Menu } from "./PlayMat";
-import { Underlying } from "./PlayMat";
+import { LifeBar, Mat, Menu, Underlying } from "./PlayMat";
 
 export const Component: React.FC = () => {
   return (

src/ui/Duel/PlayMat/Underlying/index.tsx

-import { useEffect } from "react";
-import { createRoot } from "react-dom/client";
+import classNames from "classnames";
+import { useSnapshot } from "valtio";
+
+import { isMe, matStore } from "@/stores";
 import { withPortalToBody } from "@/ui/Shared";
 
 import styles from "./index.module.scss";
-import classNames from "classnames";
-import { matStore, isMe } from "@/stores";
-import { useSnapshot } from "valtio";
 
 export const Underlying: React.FC<{}> = withPortalToBody(() => {
   const { currentPlayer } = useSnapshot(matStore);

src/ui/theme.ts

-import { type ThemeConfig, theme as antdTheme } from "antd";
+import { theme as antdTheme, type ThemeConfig } from "antd";
 
 export const theme: ThemeConfig = {
   algorithm: antdTheme.darkAlgorithm,
+  token: {
+    colorPrimary: "#0085da",
+  },
   components: {
     Message: {
       colorBgElevated: "#3f4d60",