From 670c26774aa93188c273ffb2e9c636228cf0d1db Mon Sep 17 00:00:00 2001
From: Ayaka <ayaka@mail.shn.hk>
Date: Mon, 6 Mar 2023 23:41:34 +0930
Subject: [PATCH] Update texts in the about menu (#30)

* Update description and texts in About menu

* Format code
---
 README.md                              |  2 +-
 src/components/AboutMenu/AboutMenu.tsx | 14 ++++++++++++--
 src/components/ApiMenu/ApiMenu.tsx     |  6 +++---
 src/main.css                           |  4 ++++
 4 files changed, 20 insertions(+), 6 deletions(-)

diff --git a/README.md b/README.md
index 7b59922..4377bc5 100644
--- a/README.md
+++ b/README.md
@@ -69,4 +69,4 @@ Liked it? Please give a ⭐️ to **ChatGPTFreeApp**.
 
 ## 🛠️ Usage
 
-To get started, simply visit our website at [https://freechatgpt.chat/](https://freechatgpt.chat). You can start enjoying the power of ChatGPT powered by the [ayaka14732/ChatGPTAPIFree](https://github.com/ayaka14732/ChatGPTAPIFree) or use your own OpenAI API Key obtained from [OpenAI API Keys](https://platform.openai.com/account/api-keys)
+To get started, simply visit our website at [https://freechatgpt.chat/](https://freechatgpt.chat). You can start enjoying the power of ChatGPT powered by the [ayaka14732/ChatGPTAPIFree](https://github.com/ayaka14732/ChatGPTAPIFree) or use your own OpenAI API Key obtained from [OpenAI API Keys](https://platform.openai.com/account/api-keys).
diff --git a/src/components/AboutMenu/AboutMenu.tsx b/src/components/AboutMenu/AboutMenu.tsx
index b02ca18..602cac5 100644
--- a/src/components/AboutMenu/AboutMenu.tsx
+++ b/src/components/AboutMenu/AboutMenu.tsx
@@ -25,8 +25,18 @@ const AboutMenu = () => {
           cancelButton={false}
         >
           <div className='p-6 border-b border-gray-200 dark:border-gray-600'>
-            <div className='min-w-fit text-gray-900 dark:text-gray-300 text-sm'>
-              Description
+            <div className='min-w-fit text-gray-900 dark:text-gray-300 text-sm flex flex-col gap-2'>
+              <p>Free ChatGPT is an amazing open-source web app that allows you to play with OpenAI's ChatGPT API for free!</p>
+
+              <h2 className='text-lg font-bold'>Discord Server</h2>
+              <p>We invite you to join our Discord community! Our Discord server is a great place to exchange ChatGPT ideas and tips, and submit feature requests for Free ChatGPT. You'll have the opportunity to interact with the developers behind Free ChatGPT as well as other AI enthusiasts who share your passion.</p>
+
+              <p>To join our server, simply click on the following link: <a className='link' href='https://discord.gg/g3Qnwy4V6A' target='_blank'>https://discord.gg/g3Qnwy4V6A</a>. We can't wait to see you there!</p>
+
+              <h2 className='text-lg font-bold'>Privacy Statement</h2>
+              <p>We highly value your privacy and are committed to safeguarding the privacy of our users. We do not collect or store any text you enter or receive from the OpenAI server in any form. Our source code is available for your inspection to verify this statement.</p>
+
+              <p>We prioritise the security of your API key and handle it with utmost care. If you use your own API key, your key is exclusively stored on your browser and never shared with any third-party entity. It is solely used for the intended purpose of accessing the OpenAI API and not for any other unauthorised use.</p>
             </div>
           </div>
         </PopupModal>
diff --git a/src/components/ApiMenu/ApiMenu.tsx b/src/components/ApiMenu/ApiMenu.tsx
index 1c23720..6f46804 100644
--- a/src/components/ApiMenu/ApiMenu.tsx
+++ b/src/components/ApiMenu/ApiMenu.tsx
@@ -112,7 +112,7 @@ const ApiMenu = ({
         <div className='min-w-fit text-gray-900 dark:text-gray-300 text-sm mt-4 text-center'>
           Get your personal API key{' '}
           <a
-            className='underline dark:hover:text-white hover:text-black'
+            className='link'
             href='https://platform.openai.com/account/api-keys'
             target='_blank'
           >
@@ -120,10 +120,10 @@ const ApiMenu = ({
           </a>
         </div>
         <div className='min-w-fit text-gray-900 dark:text-gray-300 text-sm mt-4'>
-          We prioritize the security of your API key and handle it with utmost
+          We prioritise the security of your API key and handle it with utmost
           care. Your key is exclusively stored on your browser and never shared
           with any third-party entity. It is solely used for the intended
-          purpose of accessing the OpenAI API and not for any other unauthorized
+          purpose of accessing the OpenAI API and not for any other unauthorised
           use.
         </div>
       </div>
diff --git a/src/main.css b/src/main.css
index 8185ac1..a987cea 100644
--- a/src/main.css
+++ b/src/main.css
@@ -72,6 +72,10 @@
   textarea:focus {
     outline: none;
   }
+
+  a.link {
+    @apply underline dark:hover:text-white hover:text-black;
+  }
 }
 
 @layer components {