Update docs

Author: raidensakura

README.md

@@ -3,7 +3,7 @@
   <strong><i>Raiden's personal fork of Python Discord Modmail bot.</i></strong><br><br>
 
   <a href="#"><img src="https://img.shields.io/badge/Version-4.1.0-7d5edd?style=shield&logo=https://modmail-docs.netlify.app/favicon.png"></a>
-  <a href="https://www.python.org/downloads/"><img src="https://img.shields.io/badge/Python-3.8_--_3.11-blue.svg?style=shield&logo=Python" alt="Made with Python 3.8"></a>
+  <img src="https://img.shields.io/badge/3.8_--_3.11-red?logo=python&logoColor=white&label=Python&labelColor=%233772a2&color=%23ffdd54">
   <a href="https://github.com/ambv/black"><img src="https://img.shields.io/badge/Code%20Style-Black-black?style=shield"></a>
   <a href="https://github.com/modmail-dev/modmail/blob/master/LICENSE"><img src="https://img.shields.io/badge/License-AGPL--3.0-e74c3c.svg?style=shield" alt="MIT License"></a>
   <a href="https://discord.gg/cnUpwrnpYb"><img src="https://img.shields.io/discord/616969119685935162.svg?label=Discord&logo=Discord&colorB=7289da&style=shield" alt="Support"></a>

docs/pages/_meta.json

@@ -3,15 +3,20 @@
 	"getting-started": "Getting started",
 	"installation": "Installing Modmail",
 	"logviewer-installation": "Installing Logviewer",
-	"configuration": "Configuring Modmail",
 	"updating": "Updating Modmail",
-	"updating-logviewer": "Updating Logviewer",
-	"setting-up-auto-restart": "Set up auto-restart",
+	"configuring": {
+		"title": "Configuring Modmail",
+		"href": "https://docs.modmail.dev/usage-guide/configuration",
+		"newWindow": true
+	},
 	"contact": {
 	  "title": "Discord ↗",
 	  "type": "page",
 	  "href": "https://dsc.gg/transience",
 	  "newWindow": true
-	}
+	},
+	"frequently-asked-questions": "Common Questions",
+	"plugins": "Plugin Documentation",
+	"community-guides": "Community Guides"
   }
 

docs/pages/community-guides.mdx

@@ -7,21 +7,6 @@ import { Card, Cards } from 'nextra-theme-docs'
 	Community guides are not verified by the Modmail team, so use them at your own risks.
 </Callout>
 
-### Hosting on [Replit](https://replit.com/)
-
-Replit is an online code execution playground. You can host Modmail there for free using certain exploits.
-The legitimate method costs $7 USD per month. However, regardless if you pay or host for free, 
-hosting on Replit are often unstable and thus not recommended. But for now, this is the one of the only options
-for those without a payment method for hosting or verification.
-  <br/>
-  <Card
-    icon={
-      <img src="https://replit.com/public/icons/favicon-prompt-192.png" alt="drawing" width="25"/>
-  	}
-    title="Replit Hosting Guide by AnonDev"
-    href="https://gist.github.com/anondev-sudo/24978429b85b44348bcff5c0885afe82"
-  />
-
 ### Hosting on [Northflank](https://northflank.com/)
 
 Northflank is a Platform as a Service (PaaS) like Railway that offers abilities to run micro-services like bots,
@@ -51,5 +36,6 @@ They will not charge your card if you go over resource usage as you have limited
 	  ALwN4cq7wQvVMBxDHYaxCn0UduolhZ6Rwo/qb53/83/+AFhNZSejAD8zAAAAAElFTkSuQmCC" alt="drawing" width="25"/>
   	}
     title="Northflank Guide by raidensakura"
-    href="#"
+    href="https://blog.project-mei.xyz/posts/2023-08-02-hosting-modmail-on-northflank.html"
+	target="_blank"
   />

docs/pages/configuration.mdx

@@ -39,11 +39,11 @@ The first step in setting up Modmail is to create a Discord bot.
 Head over to the Discord Developer Portal and create a new application.
 
 Once you've created a new application, head over to the Bot tab and create a new bot.
-<Image src="/create-bot.png" alt="Hello" width={500} height={500} />
+<Image src="/create-bot.png" alt="Hello" width={850} height={500} />
 <sub>Navigate to the Bot tab on the sidebar. On this page, you can also edit the About Me section of your bot.</sub>
 
 Click Add bot to create the bot. After adding a bot, reset the token and copy and store the newly generated token in your Text editor for later use.
-<Image src="/reset-token.png" alt="Hello" width={500} height={500} />
+<Image src="/reset-token.png" alt="Hello" width={850} height={500} />
 <Callout emoji="⚠️" type="warning">
 	Make sure to keep this token private! Anyone who has this token can control your bot and potentially cause malicious damage.
 </Callout>
@@ -66,7 +66,7 @@ We recommend keeping this toggled off to save computational resources.
 
 Navigate back to the General Information tab and copy the application ID.
 Click Copy to copy the application ID. This is also known as your "Bot ID".
-<Image src="/bot-id.png" alt="Hello" width={500} height={500} />
+<Image src="/bot-id.png" alt="Hello" width={850} height={500} />
 
 Using the following URL as template, replace `YOUR-ID-HERE` with the ID you just copied. Do not change anything else! Open a new browser tab and go to that URL.
 ```
@@ -75,7 +75,7 @@ https://discord.com/oauth2/authorize?scope=bot&permissions=416075476184&client_i
 
 Discord should prompt you to choose a server to invite your bot, followed by a list of permissions. Scroll to the bottom and click Authorize.
 Choose your server to invite, then click Continue.
-<Image src="/invite-bot.png" alt="Hello" width={500} height={500} />
+<Image src="/invite-bot.png" alt="Hello" width={850} height={500} />
 
 Scroll to the bottom and click Authorize. Don't un-check any permissions. Only Administrator is optional.
 <Callout emoji="ℹ️" type="info">
@@ -108,29 +108,29 @@ asking you to "tell us a few things about yourself and your project". You can an
 In the next step for "deploy a cloud database", choose the **Shared** option. Choose the region that's closest to where you're hosting your bot.
 Make sure the **Cluster Tier** is set to **M0 Sandbox** and the price shows as **FREE**.
 
-<Image src="/mongo-shared.png" alt="Hello" width={500} height={500} />
+<Image src="/mongo-shared.png" alt="Hello" width={850} height={500} />
 <sub>Choose the free **Shared** option and click **Create**.</sub>
 
 On the following **Security Quickstart** page, do the following:
 
 1.  Authentication method: _Username and Password_
     ```Username: `modmail`
     Password: Click **Autogenerate Secure Password** - don't type your own password!```
-	<Image src="/mongo-password.png" alt="Hello" width={500} height={500} />
+	<Image src="/mongo-password.png" alt="Hello" width={850} height={500} />
 2.  Copy and **save the password** into your text editor, you will need this for later.
     From now on, we will be referring to these credentials as the _database username_ and _database password_.
 3. Click **Create User**.
 4. Scroll down, we will be connecting from: _My Local Environment_
 5.  Set IP address as **`0.0.0.0/0`** and anything for the description.
-	<Image src="/mongo-ip.png" alt="Hello" width={500} height={500} />
+	<Image src="/mongo-ip.png" alt="Hello" width={850} height={500} />
 	**You must** set the IP address exactly to this, unless you know what you're doing.
 	**Do not** set it to anything else or click add my current IP address. This allows Modmail to connect to your database.
 6. Click **Add Entry**.
 
 Next, we will need to generate a MongoDB connection string. Simply click `Connect` on the main dashboard,
 choose `Connect your application`, then copy the connection string (the default driver is fine) and paste it into your Notepad.
 
-<Image src="/mongo-connect.png" alt="Hello" width={500} height={500} />
+<Image src="/mongo-connect.png" alt="Hello" width={850} height={500} />
 
 If you followed all the steps so far, your Notepad should contain three lines:
 the bot token, the database password, and the MongoDB connection string. For example:

docs/pages/getting-started.mdx

@@ -2,6 +2,8 @@ import Image from 'next/image'
 
 # Introduction
 
+This is the documentation for a fork of [modmail-dev/Modmail](https://github.com/modmail-dev/Modmail), a Discord Modmail bot written in Python.
+
 Modmail is a self-hosted Python Discord bot for your server. 
 It serves as a shared inbox for server staff to communicate with their users in a seamless way.
 Users create a ticket by direct-messaging the bot on Discord, and it will create a ticket channel
@@ -10,11 +12,11 @@ in your chosen server relaying the messages between you and the server staff sea
 It comes with many advanced features and customizable configurations to help you handle tickets smoothly,
 such as custom snippets, command aliases, adding multiple users and so on.
 
-<Image src="/header-pic.png" alt="Hello" width={500} height={500} />
+<br /><Image src="/header-pic.png" alt="Hello" width={500} height={500} />
 
-With the built-in Logviewer plugin, you can also view previous tickets created on your browser.
+With the Logviewer plugin, you can also view previous tickets created on your browser:
 
-<Image src="/logviewer.png" alt="Hello" width={500} height={500} />
+<br /><Image src="/logviewer.png" alt="Hello" width={500} height={500} />
 
 ## Features
 
@@ -46,10 +48,47 @@ With the built-in Logviewer plugin, you can also view previous tickets created o
 
 This list is ever-growing thanks to active development by our exceptional contributors. See a full list of available commands by using the `?help` command.
 
-## Contributing to Modmail
+## Contributing to this fork
+
+import { useData } from 'nextra/data'
 
-* Be a stargazer by giving the repository a ⭐
-* Fork the repository and Submit a Pull Request containing your features 🔧
-* Help us find the bugs and submit a GitHub Issue 🐛
+export const getStaticProps = ({ params }) => {
+  return fetch(`https://api.github.com/repos/raidensakura/modmail`)
+    .then(res => res.json())
+    .then(repo => ({
+      props: {
+        ssg: {
+          stars: repo.stargazers_count,
+		  forks: repo.forks_count,
+		  issues: repo.open_issues_count
+        }
+      },
+      revalidate: 60
+    }))
+}
+ 
+export const Stars = () => {
+  const { stars } = useData()
+  return <strong>{stars}</strong>
+}
+
+export const Forks = () => {
+  const { forks } = useData()
+  return <strong>{forks}</strong>
+}
 
-You can also support the original project on their [GitHub repository](https://github.com/modmail-dev/modmail).
+export const Issues = () => {
+  const { issues } = useData()
+  return <strong>{issues}</strong>
+}
+
+Support the project on our [GitHub repository](https://github.com/raidensakura/modmail).
+
+[<img src="https://img.shields.io/badge/ko--fi.com%2Fraidensakura-d11df9?logo=kofi&logoColor=white&label=Support%20me&color=%23ff5b62"/>](https://ko-fi.com/raidensakura)
+ 
+* [Be a stargazer](https://github.com/raidensakura/modmail/stargazers) by giving the repository a ⭐
+<br /><sub>This fork has <Stars /> stargazers on GitHub!</sub>
+* [Fork the repository](https://github.com/raidensakura/modmail/forks) and [Submit a Pull Request](https://github.com/raidensakura/modmail/pulls) containing your features 🔧
+<br /><sub>Forking fork! This fork also has <Forks /> other fork(s) on GitHub!</sub>
+* Help us find issues with the bot and [submit a GitHub Issue](https://github.com/raidensakura/modmail/issues) 🐛
+<br /><sub>This fork currently has <Issues /> open issues on GitHub!</sub>