初始化项目

README.md

@@ -0,0 +1,101 @@
+<p align="center">
+    <a href="https://www.openim.online">
+        <img src="./docs/images/openim-logo.gif" width="60%" height="30%"/>
+    </a>
+</p>
+
+# OpenIM Electron Demo 💬💻
+
+<p>
+  <a href="https://docs.openim.io/">OpenIM Docs</a>
+  •
+  <a href="https://github.com/openimsdk/open-im-server">OpenIM Server</a>
+  •
+  <a href="https://github.com/openimsdk/open-im-sdk-web-wasm">openim-sdk-wasm</a>
+  •
+  <a href="https://github.com/openimsdk/openim-sdk-core">openim-sdk-core</a>
+</p>
+
+<br>
+
+OpenIM Electron Demo is an open-source instant messaging application built on OpenIM SDK Wasm, OpenIM Server, and Electron. It demonstrates how to quickly integrate instant messaging capabilities into any web app using OpenIM.
+
+## Tech Stack 🛠️
+
+- This is a [`Electron`](https://www.electronjs.org/) project bootstrapped with [`Vite`](https://vitejs.dev/).
+- App is built with [openim-sdk-wasm](https://github.com/openimsdk/open-im-sdk-web-wasm) library.
+
+## Live Demo 🌐
+
+Give it a try at [https://web-enterprise.rentsoft.cn](https://web-enterprise.rentsoft.cn).
+
+## Dev Setup 🛠️
+
+> It is recommended to use node version 16.x-18.x.
+
+Follow these steps to set up a local development environment:
+
+1. Run `npm install` to install all dependencies.
+2. Modify the request address to your own OpenIM Server IP in the following files:
+   > Note: You need to [deploy](https://docs.openim.io/guides/gettingStarted/dockerCompose) OpenIM Server first, the default port of OpenIM Server is 10001, 10002, 10008.
+   - `src/config/index.ts`
+     ```js
+     export const WS_URL = "ws://your-server-ip:10001";
+     export const API_URL = "http://your-server-ip:10002";
+     export const USER_URL = "http://your-server-ip:10008";
+     ```
+3. Run `npm run dev` to start the development server. Visit [http://localhost:5173](http://localhost:5173) to see the result. An Electron application will be launched by default.
+4. Start development! 🎉
+
+## Build 🚀
+
+> This project allows building web applications and Electron applications separately, but there will be some differences during the build process.
+
+### Web Application
+
+1. Run the following command to build the web application:
+   ```bash
+   npm run build
+   ```
+2. The build result will be located in the `dist` folder.
+
+### Electron Application
+
+1. Replace the contents of the `package_electron.json` file with `package.json`, keeping only the dependencies required for Electron to function. This significantly reduces the package size. Also, modify the packaging script.
+2. Run one of the following commands to build the Electron application:
+   - macOS:
+     ```bash
+     npm run build:mac
+     ```
+   - Windows:
+     ```bash
+     npm run build:win
+     ```
+   - Linux:
+     ```bash
+     npm run build:linux
+     ```
+3. The build result will be located in the `package` folder.
+
+## Community :busts_in_silhouette:
+
+- 📚 [OpenIM Community](https://github.com/OpenIMSDK/community)
+- 💕 [OpenIM Interest Group](https://github.com/Openim-sigs)
+- 🚀 [Join our Slack community](https://join.slack.com/t/openimsdk/shared_invite/zt-2ijy1ys1f-O0aEDCr7ExRZ7mwsHAVg9A)
+- :eyes: [Join our wechat (微信群)](https://openim-1253691595.cos.ap-nanjing.myqcloud.com/WechatIMG20.jpeg)
+
+## Community Meetings :calendar:
+
+We want anyone to get involved in our community and contributing code, we offer gifts and rewards, and we welcome you to join us every Thursday night.
+
+Our conference is in the [OpenIM Slack](https://join.slack.com/t/openimsdk/shared_invite/zt-2ijy1ys1f-O0aEDCr7ExRZ7mwsHAVg9A) 🎯, then you can search the Open-IM-Server pipeline to join
+
+We take notes of each [biweekly meeting](https://github.com/orgs/OpenIMSDK/discussions/categories/meeting) in [GitHub discussions](https://github.com/openimsdk/open-im-server/discussions/categories/meeting), Our historical meeting notes, as well as replays of the meetings are available at [Google Docs :bookmark_tabs:](https://docs.google.com/document/d/1nx8MDpuG74NASx081JcCpxPgDITNTpIIos0DS6Vr9GU/edit?usp=sharing).
+
+## Who are using OpenIM :eyes:
+
+Check out our [user case studies](https://github.com/OpenIMSDK/community/blob/main/ADOPTERS.md) page for a list of the project users. Don't hesitate to leave a [📝comment](https://github.com/openimsdk/open-im-server/issues/379) and share your use case.
+
+## License :page_facing_up:
+
+OpenIM is licensed under the Apache 2.0 license. See [LICENSE](https://github.com/openimsdk/open-im-server/tree/main/LICENSE) for the full license text.

README.zh-CN.md

@@ -1,3 +1,33 @@
+<p align="center">
+    <a href="https://www.openim.online">
+        <img src="./docs/images/openim-logo.gif" width="60%" height="30%"/>
+    </a>
+</p>
+
+# OpenIM Electron Demo 💬💻
+
+<p>
+  <a href="https://docs.openim.io/">OpenIM Docs</a>
+  •
+  <a href="https://github.com/openimsdk/open-im-server">OpenIM Server</a>
+  •
+  <a href="https://github.com/openimsdk/open-im-sdk-web-wasm">openim-sdk-wasm</a>
+  •
+  <a href="https://github.com/openimsdk/openim-sdk-core">openim-sdk-core</a>
+</p>
+
+<br>
+
+OpenIM Electron Demo 是一个基于`openim-sdk-wasm`、`openim-server`和`Electron`构建的开源即时通讯应用程序。它演示了如何使用 OpenIM 快速的将即时通讯功能集成到任何 Web 应用程序中。
+
+## 技术栈 🛠️
+
+- 这是一个使用 [`Electron`](https://www.electronjs.org/) 和 [`Vite`](https://vitejs.dev/) 构建的项目。
+- 应用程序使用了 [openim-sdk-wasm](https://github.com/openimsdk/open-im-sdk-web-wasm) 库构建。
+
+## 在线演示 🌐
+
+在 [https://web-enterprise.rentsoft.cn](https://web-enterprise.rentsoft.cn) 上体验一下。
 
 ## 开发设置 🛠️
 
@@ -46,3 +76,30 @@
      npm run build:linux
      ```
 3. 构建结果将位于 `package` 文件夹中。
+
+## 社区 :busts_in_silhouette:
+
+- 📚 [OpenIM 社区](https://github.com/OpenIMSDK/community)
+- 💕 [OpenIM 兴趣小组](https://github.com/Openim-sigs)
+- 🚀 [加入我们的 Slack 社区](https://join.slack.com/t/openimsdk/shared_invite/zt-22720d66b-o_FvKxMTGXtcnnnHiMqe9Q)
+- :eyes: [加入我们的微信群](https://openim-1253691595.cos.ap-nanjing.myqcloud.com/WechatIMG20.jpeg)
+
+## 社区会议 :calendar:
+
+我们希望任何人都能参与我们的社区并贡献代码，我们提供礼品和奖励，并欢迎您每个星期四晚上加入我们。
+
+我们的会议在 [OpenIM Slack](https://join.slack.com/t/openimsdk/shared_invite/zt-22720d66b-o_FvKxMTGXtcnnnHiMqe9Q) 🎯，然后您可以搜索 Open-IM-Server 管道加入
+
+我们在[GitHub discussions](https://github.com/openimsdk/open-im-server/discussions/categories/meeting)中记录了每一次[双周会议](https://github.com/orgs/OpenIMSDK/discussions/categories/meeting)的内容，我们的历史会议记录以及会议的回放都可以在[Google Docs :bookmark_tabs:](https://docs.google.com/document/d/1nx8MDpuG74NASx081JcCpxPgDITNTpIIos0DS6Vr9GU/edit?usp=sharing)中找到。
+
+## 谁在使用 OpenIM :eyes:
+
+查看我们的[用户案例](https://github.com/OpenIMSDK/community/blob/main/ADOPTERS.md)页面，以获取正在使用改项目用户的列表。不要犹豫留下[📝 评论](https://github.com/openimsdk/open-im-server/issues/379)并分享您的使用情况。
+
+## LICENSE :page_facing_up:
+
+OpenIM 在 Apache 2.0 许可下发布。查看[LICENSE](https://github.com/openimsdk/open-im-server/tree/main/LICENSE)以获取完整的信息。
+
+```
+
+```

package.json

@@ -12,20 +12,15 @@
   },
   "scripts": {
     "dev": "vite --force --host",
-    "build": "tsc && vite build && electron-builder",
+    "build": "vite build",
     "preview": "vite preview",
-    "build:mac": "vite build  &&  electron-builder --macos --x64",
-    "build:mac-arm": "vite build  &&  electron-builder --macos --arm64",
-    "build:win": "vite build  &&  electron-builder --win --x64",
-    "build:win-arm": "vite build  &&  electron-builder --win --arm64",
-    "build:linux": "vite build  &&  electron-builder --linux --x64",
-    "build:linux-arm": "vite build  &&  electron-builder --linux --arm64",
     "pree2e": "vite build --mode=test",
     "e2e": "playwright test",
     "format": "prettier --write .",
     "lint": "eslint --ext .js,.jsx,.ts,.tsx src",
     "lint:fix": "eslint --ext .js,.jsx,.ts,.tsx --fix --quiet src",
-    "prepare": "husky install"
+    "prepare": "husky install",
+    "postinstall": "patch-package"
   },
   "devDependencies": {
     "@commitlint/cli": "^17.4.4",

src/config/index.ts

@@ -4,9 +4,11 @@
 // export const API_URL = "https://xxx.com/api";
 // export const USER_URL = "https://xxx.com/chat";
 
-export const WS_URL = "ws://20.189.74.163:10001";
-export const API_URL = "http://20.189.74.163:10002";
-export const CHAT_URL = "http://20.189.74.163:10008";
+const serveIp = "20.189.74.163";
+
+export const WS_URL = `ws://${serveIp}:10001`;
+export const API_URL = `http://${serveIp}:10002`;
+export const CHAT_URL = `http://${serveIp}:10008`;
 
 export const getWsUrl = () => localStorage.getItem("wsUrl") || WS_URL;
 export const getApiUrl = () => localStorage.getItem("apiUrl") || API_URL;

src/layout/TopSearchBar/SearchUserOrGroup.tsx

@@ -65,14 +65,13 @@ const SearchUserOrGroup: ForwardRefRenderFunction<
         const {
           data: { total, users },
         } = await searchBusinessUserInfo(keyword);
-        console.log(users, "data");
-        // if (
-        //   !total ||
-        //   (users[0].userID !== keyword && users[0].phoneNumber !== keyword)
-        // ) {
-        //   message.warning(t("empty.noSearchResults"));
-        //   return;
-        // }
+        if (
+          !total ||
+          (users[0].userID !== keyword && users[0].phoneNumber !== keyword)
+        ) {
+          message.warning(t("empty.noSearchResults"));
+          return;
+        }
         const friendInfo = useContactStore
           .getState()
           .friendList.find((friend) => friend.userID === users[0].userID);

src/pages/common/RtcCallModal/RtcLayout.tsx

@@ -16,7 +16,7 @@ import {
   ParticipantEvent,
   Track,
 } from "livekit-client";
-import { useEffect, useRef, useState } from "react";
+import { useEffect, useState } from "react";
 
 import OIMAvatar from "@/components/OIMAvatar";
 import { CustomType } from "@/constants";
@@ -51,7 +51,7 @@ export const RtcLayout = ({
   const remoteParticipant = tracks.find((track) => !isLocal(track.participant));
   const isWaiting = !connect && !isConnected;
   const [isRemoteVideoMuted, setIsRemoteVideoMuted] = useState(false);
-  const callingRef = useRef<HTMLAudioElement>(null);
+
   const connectState = useConnectionState();
 
   useEffect(() => {
@@ -75,25 +75,6 @@ export const RtcLayout = ({
     );
   };
 
-  useEffect(() => {
-    if (isWaiting) {
-      handlePlay();
-    } else {
-      handlePause();
-    }
-  }, [isWaiting]);
-
-  const handlePlay = () => {
-    if (callingRef.current) {
-      callingRef.current.play();
-    }
-  };
-
-  const handlePause = () => {
-    if (callingRef.current) {
-      callingRef.current.pause();
-    }
-  };
   return (
     <Spin spinning={connectState === ConnectionState.Connecting}>
       <div
@@ -141,12 +122,6 @@ export const RtcLayout = ({
         )}
       </div>
       <RoomAudioRenderer />
-      <audio
-        controls={false}
-        ref={callingRef}
-        src="/src/assets/audios/calling.mp3"
-        loop={true}
-      />
     </Spin>
   );
 };