update: file README

Author: 521xueweihan

README.md

@@ -1,12 +1,18 @@
-## 介绍
+<p align="center">
+  <img src="docs/img/2024-08-14.png"/>
+  <br>中文 | <a href="README_en.md">English</a>
+  <br>HelloGitHub 是一个发现和分享有趣、入门级开源项目的平台<br>
+</p>
 
 Geese 译为「惊鸿」可理解为轻盈、快速的形态，希望它清爽、简约的界面可以带给你「惊鸿」一般的访问体验。
 
-我想让玩开源的人有个“家”，所以就用 Next.js+Tailwind CSS 构建了一个轻量级的开源社区，也就是「HelloGitHub 社区」的源码。
+## 介绍
+
+Geese 是用 Next.js+Tailwind CSS 构建了一个轻量级的开源社区，也就是「HelloGitHub 社区」的源码。
 
 ![](docs/img/2023-04-18.png)
 
-该社区提供了不同 **编程语言/类别/标签** 有趣、入门级的开源项目，用户可以这里 **发现/搜索/收藏/评论/分享** 感兴趣的开源项目，还可以 **点赞/提交/打分** 开源项目，让优秀的开源项目脱颖而出。围绕开源项目，社区聚集了一群热爱开源的玩家、技术精湛的大牛、热衷分享的作者，感谢**开源**让我们相识，或许开源精神就是一种交朋友的方式吧！
+HelloGitHub 社区提供了不同 **编程语言/类别/标签** 有趣、入门级的开源项目，用户可以这里 **发现/搜索/收藏/评论/分享** 感兴趣的开源项目，还可以 **点赞/提交/打分** 开源项目，让优秀的开源项目脱颖而出。围绕开源项目，社区聚集了一群热爱开源的玩家、技术精湛的大牛、热衷分享的作者，感谢**开源**让我们相识，或许开源精神就是一种交朋友的方式吧！
 
 目前，该社区 **已上线** [在线体验](https://hellogithub.com) 如遇到问题或发现 BUG 可以[一键反馈](https://github.com/HelloGitHub-Team/geese/issues/new)。
 

docs/en/README.md renamed to README_en.md

@@ -1,6 +1,12 @@
-## Introduction
+<p align="center">
+  <img src="docs/img/2024-08-14_en.png"/>
+  <br><a href="README.md">中文</a> | English
+  <br>HelloGitHub is a platform for discovering and sharing beginner-friendly open source projects<br>
+</p>
+
+"Geese" translated as "Jinghong" (meaning a fleeting glimpse), embodies a light and swift form, aiming to provide you with a "Jinghong"-like browsing experience through its refreshing and minimalist interface.
 
-"Geese," translated as "Jinghong" (meaning a fleeting glimpse), embodies a light and swift form, aiming to provide you with a "Jinghong"-like browsing experience through its refreshing and minimalist interface.
+## Introduction
 
 I wanted to create a home for those who enjoy open-source projects, so I built a lightweight open-source community using Next.js and Tailwind CSS. This repository contains the source code for the [HelloGitHub](https://hellogithub.com/) Community.
 
@@ -27,4 +33,4 @@ Development guidelines can be found [here](../content.md). Thanks to every [cont
 
 <a href="mailto:[email protected]">Contact me</a>
 
-<a rel="license" href="https://creativecommons.org/licenses/by-nc-nd/4.0/deed.zh"><img alt="知识共享许可协议" style="border-width: 0" src="https://licensebuttons.net/l/by-nc-nd/4.0/88x31.png"></a><br>This work is licensed under a <a rel="license" href="https://creativecommons.org/licenses/by-nc-nd/4.0/deed.zh">Creative Commons Attribution-NonCommercial-NoDerivatives 4.0 International License</a>.
+<a rel="license" href="https://creativecommons.org/licenses/by-nc-nd/4.0/deed.zh"><img alt="知识共享许可协议" style="border-width: 0" src="https://licensebuttons.net/l/by-nc-nd/4.0/88x31.png"></a><br>This work is licensed under a <a rel="license" href="https://creativecommons.org/licenses/by-nc-nd/4.0/deed.zh">Creative Commons Attribution-NonCommercial-NoDerivatives 4.0 International License</a>.

data/level_en.md

@@ -8,7 +8,7 @@ Everyone is encouraged to share interesting, beginner-friendly open-source proje
 
 The HelloGitHub Community Level is calculated and upgraded in real-time based on contribution points.
 
-![](https://img.hellogithub.com/article/level.png)
+![](https://img.hellogithub.com/article/lSthE0PgBGoUCQd_1723623130.png)
 
 ## Earning and Deducting Contribution Points
 

docs/content_en.md

@@ -0,0 +1,64 @@
+## Before Development
+
+Firstly, the project utilizes yarn for package installation, which you can search for and install on your own. After installation is complete, set the version number with the command `yarn set version v1.22.19`.
+
+Next, to get the 'Geese' project running locally, follow these detailed steps:
+
+1. Clone the project: `git clone [email protected]:HelloGitHub-Team/geese.git`
+2. Install dependencies: `yarn install`
+3. Run the project: `yarn dev`
+4. Access in the browser: `http://localhost:3000/`
+
+Potential issues you may encounter after starting up:
+
+1. CORS issue: Please check that the front-end service is started on port `3000` with the host as `localhost` or `127.0.0.1`.
+2. Images not displaying: Add `127.0.0.1 dev.hg.com` to the end of your local hosts file, then access `http://dev.hg.com:3000/`.
+3. Login status: Obtain a test environment login token from @521xueweihan, then manually add an Authorization: token item to the browser's LocalStorage.
+4. If the machine freezes during build, you can resolve this by setting the concurrency number with yarn: `yarn config set cloneConcurrency 1`.
+
+**Tech Stack**
+
+- [Next.js](https://nextjs.org/)
+- [Tailwind CSS](https://tailwindcss.com/)
+- [SWR](https://swr.vercel.app/zh-CN)
+- Scaffold: [ts-nextjs-tailwind-starter](https://github.com/theodorusclarence/ts-nextjs-tailwind-starter)
+- Component styles: [hyperui](https://github.com/markmead/hyperui)
+
+Finally, find the API documentation here: [API Docs](https://frp.hellogithub.com/docs#)
+
+After getting the project running, you can play around with it locally. If you find it interesting, [click here](https://github.com/orgs/HelloGitHub-Team/projects/1/views/1) to check out the unclaimed requirements, find a feature, bug, or optimization that interests you, and then let @521xueweihan know 'claim the task' under the corresponding issues before starting development to **prevent duplicate development**.
+
+## During Development
+
+Since this is collaborative development, the `main` branch may be continuously updated. Before each development session, you need to pull the latest code to ensure you are developing based on the most recent `main` branch.
+
+When developing specific requirements, split the code into corresponding directories:
+
+- Components: `components` directory
+- Pages: `pages` directory
+- Define data: `types` directory
+- Requests: `services` directory
+
+After completing feature development/bug fixes, you need to perform self-testing, check code style, and improve code reusability.
+
+Finally, execute the following commands locally and try to resolve any **warnings** you can:
+
+- `yarn lint:fix`
+- `yarn lint`
+- `yarn typecheck`
+
+## After Development
+
+Get the latest `main` branch code and resolve conflicts locally.
+
+For your first code submission, you need to submit it via a PR (Pull Request).
+
+After your code is successfully merged, @521xueweihan will invite you to become a member of the 'Geese' project. Please check your GitHub notification emails.
+
+For subsequent code submissions, you can develop in a 'self-created branch' or a branch automatically created when 'claiming a requirement.'
+
+After submitting your code, please pay attention to the project's **issues** and **prs** notifications because I will provide feedback and optimization suggestions after reviewing the submitted code.
+
+## Finally
+
+I am very happy to build 'Geese' with you and hope that you also gain something from the process of contributing code.

docs/img/2024-08-14.png

@@ -1,6 +1,6 @@
 // components/LanguageSwitcher.tsx
 import { useRouter } from 'next/router';
-import { useRef, useState } from 'react';
+import { useState } from 'react';
 // eslint-disable-next-line @typescript-eslint/no-var-requires
 const Cookies = require('js-cookie');
 
@@ -11,15 +11,11 @@ type LanguageSwitchProps = {
 const LanguageSwitcher = (props: LanguageSwitchProps) => {
   const router = useRouter();
   const { locale, asPath } = router;
-  const [isHovered, setIsHovered] = useState(false);
   const [selectedLocale, setSelectedLocale] = useState(locale);
-  const dropdownRef = useRef<HTMLDivElement>(null);
-  const timeoutRef = useRef<NodeJS.Timeout | null>(null);
 
   const changeLanguage = (language: string) => {
     Cookies.set('locale', language);
     setSelectedLocale(language);
-    setIsHovered(false);
     router.push(asPath, asPath, { locale: language });
   };
 
@@ -33,68 +29,15 @@ const LanguageSwitcher = (props: LanguageSwitchProps) => {
     );
   }
 
-  const handleMouseEnter = () => {
-    if (timeoutRef.current) {
-      clearTimeout(timeoutRef.current);
-    }
-    setIsHovered(true);
-  };
-
-  const handleMouseLeave = () => {
-    timeoutRef.current = setTimeout(() => {
-      setIsHovered(false);
-    }, 300);
-  };
-
   return (
-    <div
-      className='relative inline-block text-left'
-      ref={dropdownRef}
-      onMouseEnter={handleMouseEnter}
-      onMouseLeave={handleMouseLeave}
-    >
-      <div>
-        <button
-          type='button'
-          className='inline-flex h-8 w-full items-center justify-center rounded-md border border-gray-300 bg-white px-2 text-sm font-medium text-gray-700 shadow-sm transition-colors duration-200 hover:bg-gray-50 dark:border-gray-600 dark:bg-gray-900 dark:text-gray-300 dark:hover:bg-gray-700'
-          id='options-menu'
-          aria-haspopup='true'
-          aria-expanded={isHovered ? 'true' : 'false'}
-        >
-          {/* <MdTranslate size={16} /> */}
-          {selectedLocale === 'zh' ? 'EN' : '中文'}
-        </button>
-      </div>
-
-      {isHovered && (
-        <div
-          className='absolute right-0 mt-2 w-[110px] origin-top-right rounded-md bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:bg-gray-800 dark:ring-gray-600'
-          onMouseEnter={handleMouseEnter}
-          onMouseLeave={handleMouseLeave}
-        >
-          <div
-            className='py-1'
-            role='menu'
-            aria-orientation='vertical'
-            aria-labelledby='options-menu'
-          >
-            <button
-              onClick={() => changeLanguage('zh')}
-              className='block w-full px-4 py-2 text-left text-sm text-gray-700 transition-colors duration-200 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-700'
-              role='menuitem'
-            >
-              🇨🇳 中文
-            </button>
-            <button
-              onClick={() => changeLanguage('en')}
-              className='block w-full px-4 py-2 text-left text-sm text-gray-700 transition-colors duration-200 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-700'
-              role='menuitem'
-            >
-              🇺🇸 English
-            </button>
-          </div>
-        </div>
-      )}
+    <div className='relative inline-block text-left'>
+      <button
+        onClick={() => changeLanguage(selectedLocale === 'zh' ? 'en' : 'zh')}
+        type='button'
+        className='inline-flex h-8 w-full items-center justify-center rounded-md border border-gray-300 bg-white px-2 text-sm font-medium text-gray-700 shadow-sm transition-colors duration-200 hover:bg-gray-50 dark:border-gray-600 dark:bg-gray-900 dark:text-gray-300 dark:hover:bg-gray-700'
+      >
+        {selectedLocale === 'zh' ? 'EN' : '中文'}
+      </button>
     </div>
   );
 };