feat: search room by title info

package.json

@@ -16,7 +16,7 @@
   },
   "devDependencies": {
     "@babel/eslint-parser": "^7.19.1",
-    "@huolala-tech/page-spy": "^1.4.1",
+    "@huolala-tech/page-spy": "^1.4.3",
     "@mdx-js/rollup": "^2.3.0",
     "@types/lodash-es": "^4.17.7",
     "@types/mdx": "^2.0.4",

src/assets/locales/en.json

@@ -14,7 +14,8 @@
     "os": "OS",
     "browser": "Browser",
     "project": "Project",
-    "debug": "Debug"
+    "debug": "Debug",
+    "title": "Title"
   },
   "error": {
     "oops": "Oops! Errors happened~",

src/assets/locales/ja.json

@@ -14,7 +14,8 @@
     "os": "オペレーティング システム",
     "browser": "ブラウザ",
     "project": "プロジェクト",
-    "debug": "デバッグ"
+    "debug": "デバッグ",
+    "title": "タイトル"
   },
   "error": {
     "oops": "おっと！エラーが発生しました。",

src/assets/locales/ko.json

@@ -14,7 +14,8 @@
     "os": "운영 체제",
     "browser": "브라우저",
     "project": "프로젝트",
-    "debug": "디버그"
+    "debug": "디버그",
+    "title": "제목"
   },
   "error": {
     "oops": "이런! 오류가 발생했습니다.",

src/assets/locales/zh.json

@@ -14,7 +14,8 @@
     "os": "系统",
     "browser": "浏览器",
     "project": "项目",
-    "debug": "调试"
+    "debug": "调试",
+    "title": "标题"
   },
   "error": {
     "oops": " 哎呀！发生错误～",

src/pages/RoomList/index.tsx

@@ -39,10 +39,14 @@ const sortConnections = (data: I.SpyRoom[]) => {
 
 const filterConnections = (
   data: I.SpyRoom[],
-  condition: Record<'address' | 'os' | 'browser', string>,
+  condition: Record<'title' | 'address' | 'os' | 'browser', string>,
 ) => {
-  const { address = '', os = '', browser = '' } = condition;
+  const { title = '', address = '', os = '', browser = '' } = condition;
+  const lowerCaseTitle = String(title).trim().toLowerCase();
   return data
+    .filter(({ tags }) => {
+      return String(tags.title).toLowerCase().includes(lowerCaseTitle);
+    })
     .filter((i) => i.address.slice(0, 4).includes(address || ''))
     .filter(({ name }) => {
       const { osName, browserName } = resolveClientInfo(name);
@@ -86,6 +90,7 @@ export const RoomList = () => {
   );
 
   const [conditions, setConditions] = useState({
+    title: '',
     address: '',
     os: '',
     browser: '',
@@ -221,6 +226,11 @@ export const RoomList = () => {
                 <Input placeholder={t('common.project')!} allowClear />
               </Form.Item>
             </Col>
+            <Col span={8}>
+              <Form.Item label={t('common.title')} name="title">
+                <Input placeholder={t('common.title')!} allowClear />
+              </Form.Item>
+            </Col>
             <Col span={8}>
               <Form.Item label={t('common.device-id')} name="address">
                 <Input placeholder={t('common.device-id')!} allowClear />

yarn.lock

@@ -746,10 +746,10 @@
     "@huolala-tech/page-spy-api-win32-arm" "1.2.2"
     "@huolala-tech/page-spy-api-win32-arm64" "1.2.2"
 
-"@huolala-tech/page-spy@^1.4.1":
-  version "1.4.1"
-  resolved "https://registry.npmjs.org/@huolala-tech/page-spy/-/page-spy-1.4.1.tgz#98c2f85c222f9fb6749b4f360016157056d499f3"
-  integrity sha512-96QRoMiZggoF2o8y2Lr665/nImi7hwyGsISSAlboOhvIhaZh3RTk0IWHlJkbV5TL37h1AbMhNhOu5Q7NyTPZHg==
+"@huolala-tech/page-spy@^1.4.3":
+  version "1.4.3"
+  resolved "https://registry.npmjs.org/@huolala-tech/page-spy/-/page-spy-1.4.3.tgz#53cca424889bd7bc9f29ddc43659082caf10f37d"
+  integrity sha512-uRiv3JIpCFSoAjpqHOZtzd6QlhhKyQiKqznEtj09hOcwtDNVUNcet1uwjxtHTsreSKtEof+vgNzbffSwbnUqsA==
   dependencies:
     "@babel/runtime" "^7.13.0"
     copy-to-clipboard "^3.3.1"