feat: Extend documentation for other products

.prettierrc

@@ -2,5 +2,6 @@
   "semi": false,
   "trailingComma": "all",
   "jsxSingleQuote": true,
-  "singleQuote": true
+  "singleQuote": true,
+  "endOfLine": "auto"
 }

content/docs/authentication/ratelimits.mdx → content/api/authentication/ratelimits.mdx

@@ -23,17 +23,17 @@ Global rate limits are applied on all routes
 
 
 ### Per Route Rate limit
-| Route                        | Requests Per Minute |
-|------------------------------|---------------------|
-| /search                      | 60                  |
-| /discord/bots/:id            | 60                  |
-| /discord/bots/:id/historical | 60                  |
-| /discord/bots/:id/recent     | 60                  |
-| /discord/compare             | 60                  |
-| /discord/compare/historical  | 60                  |
-| /discord/rankings            | 60                  |
-| /discord/tags                | 60                  |
-| /discord/users/:id/bots      | 60                  |
+| Route                                                         | Requests Per Minute |
+|---------------------------------------------------------------|---------------------|
+| [/search](../reference/search)                                | 60                  |
+| [/discord/bots/:id](../reference/discord/bots)                | 60                  |
+| [/discord/bots/:id/historical](../reference/discord/bots)     | 60                  |
+| [/discord/bots/:id/recent](../reference/discord/bots)         | 60                  |
+| [/discord/compare](../reference/discord/compare)              | 60                  |
+| [/discord/compare/historical](../reference/discord/compare)   | 60                  |
+| [/discord/rankings](../reference/discord/rankings)            | 60                  |
+| [/discord/tags](../reference/discord/tags)                    | 60                  |
+| [/discord/users/:id/bots](../reference/discord/users)         | 60                  |
 
 ### Rate limit response type
 <TypeTable

content/api/faq.mdx

@@ -0,0 +1,68 @@
+---
+title: FAQ
+description: Frequently Asked Questions about TopStats.gg's API.
+icon: TextSearch
+---
+
+import { Accordion, Accordions } from 'fumadocs-ui/components/accordion'
+import { File, Files, Folder } from 'fumadocs-ui/components/files'
+import { GithubInfo } from 'fumadocs-ui/components/github-info'
+import { Step, Steps } from 'fumadocs-ui/components/steps'
+
+<Accordions>
+  <Accordion id='contribute' title="How To Contribute To Documentation?">
+
+    We currently use Fumadocs as our doc engine, you can contribute by creating merge requests in our docs repository:
+    <GithubInfo
+      owner="top-stats"
+      repo="docs"
+    />
+
+
+    We recommend getting started on any of our pages under content/docs and get familiar with the engine!
+    <Files>
+      <Folder name="/content" defaultOpen>
+        <Folder name="/app/(home)" defaultOpen>
+          <File name="index.mdx" />
+        </Folder>
+      </Folder>
+      <Folder name="/app" defaultOpen className="opacity-50" disabled>
+        <Folder name="/app/(home)" defaultOpen className="opacity-50" disabled />
+      </Folder>
+    </Files>
+
+  </Accordion>
+  <Accordion id='create-lib' title="How Do I Create My Own Library?">
+    You’re free to do so! If you would like to be listed on our website, please contact one of our team members in our
+    Discord Server.
+  </Accordion>
+  <Accordion id='get-data' title="Where Do We Get Our Data?">
+    We source our bot data from Top.gg once an hour, through Top.gg's API.
+  </Accordion>
+  <Accordion id='update-frequency' title="When are the statistics updated?">
+    Our data is refreshed at the beginning of every hour, and the daily schedule is updated at midnight (00:00 UTC).
+      <Callout type={'info'}>
+            It may take a few minutes for the statistics of all bots to be updated.
+      </Callout>
+  </Accordion>
+  <Accordion id='get-api-key' title="How I get My API token?">
+    You can get your API token by navigating to your dashboard and clicking on the "Toggle showing your API token" button.
+    <Steps>
+      <Step>
+        ### Open the settings [!toc]
+        Click on the settings icon on the [home page](https://topstats.gg).
+        ![settings-image](/faq/settings/settings.png)
+      </Step>
+      <Step>
+        ### Open the developer settings [!toc]
+        Click on the "Developer" tab in the settings menu.
+        ![developer-image](/faq/settings/developer.png)
+      </Step>
+      <Step>
+        ### Reveal your API token [!toc]
+        Click on the "Toggle showing your API token" button to reveal your API token.
+        ![reveal-token-image](/faq/settings/reveal-token.png)
+      </Step>
+    </Steps>
+  </Accordion>
+</Accordions>

content/docs/index.mdx → content/api/index.mdx

@@ -28,16 +28,16 @@ https://api.topstats.gg/
   <a className="not-prose group text-sm uppercase">Get Started</a>
 </h4>
   <Cards>
-  <Card icon={<WorkflowIcon className="text-red-300" />} href="./docs/reference/search" title="API Reference">
+  <Card icon={<WorkflowIcon className="text-red-300" />} href="./api/reference/search" title="API Reference">
     Get started with our API and use our playground to send requests!
   </Card>
-  <Card icon={<ImagePlusIcon className="text-purple-300" />} href="./docs/reference/widgets" title="Widgets">
+  <Card icon={<ImagePlusIcon className="text-purple-300" />} href="./api/reference/widgets" title="Widgets">
     Embed your bot stats directly onto your site with no effort!
   </Card>
-  <Card icon={<BracesIcon className="text-yellow-500" />} href="./docs/libraries/javascript" title="JavaScript Library">
+  <Card icon={<BracesIcon className="text-yellow-500" />} href="./api/libraries/javascript" title="JavaScript Library">
     Start using our community maintained JavaScript library, and forget writing requests yourself!
   </Card>
-  <Card icon={<CodeIcon className="text-green-300" />} href="./docs/libraries/python" title="Python Library">
+  <Card icon={<CodeIcon className="text-green-300" />} href="./api/libraries/python" title="Python Library">
     Use our API with ease in your Python application!
   </Card>
 </Cards>

content/docs/meta.json → content/api/meta.json

@@ -1,9 +1,12 @@
 {
-  "title": "stacks",
+  "title": "API",
+  "icon": "Code",
   "root": true,
   "pages": [
     "index",
+    "faq",
     "get-started",
+    "premium",
     "---Authentication---",
     "...authentication",
     "---Libraries---",

content/api/premium.mdx

@@ -0,0 +1,25 @@
+---
+title: Premium
+description: Premium API features
+icon: Rocket
+---
+
+import { CheckIcon, MinusIcon, RocketIcon } from 'lucide-react'
+import { Card, Cards } from 'fumadocs-ui/components/card'
+
+<Card icon={<RocketIcon className="text-green-300" />} target={'_blank'} href="https://topstats.gg/premium" title="Purchase Premium">
+  Enhance your TopStats experience, and get deeper insights with premium today!
+</Card>
+
+## Features
+All features that come with the premium plan of TopStats!
+
+| Feature                                            | Free Plan            | Paid Plan                          |
+|----------------------------------------------------|----------------------|------------------------------------|
+| Previous time period comparisons                   | <MinusIcon/>         | <CheckIcon color={'lightgreen'} /> |
+| Greater data granularity (weekly data)             | <MinusIcon/>         | <CheckIcon color={'lightgreen'} /> |
+| More comparisons (up to 8 bots)                    | <MinusIcon/>         | <CheckIcon color={'lightgreen'} /> |
+| The above features accessible through API as well! | <MinusIcon/>         | <CheckIcon color={'lightgreen'} /> |
+| Priority Support                                   | <MinusIcon/>         | <CheckIcon color={'lightgreen'} /> |
+| More influence over our roadmap and new features   | <MinusIcon/>         | <CheckIcon color={'lightgreen'} /> |
+| Cool Discord role to show off your swag            | <MinusIcon/>         | <CheckIcon color={'lightgreen'} /> |

content/api/reference/widgets/bots.mdx

@@ -0,0 +1,45 @@
+---
+title: Bots
+full: true
+
+_openapi:
+  method: GET
+---
+
+import { Tab, Tabs } from 'fumadocs-ui/components/tabs';
+
+<APIPage document={"./openapi/widgetapi.json"} operations={[
+  { "path": "/{id}/{type}", "method": "get" },
+]} webhooks={[]} hasHead={true} />
+
+## Examples
+<Tabs items={['servers', 'monthlyvotes', 'totalvotes']}>
+  <Tab value="servers">
+
+    ```sh
+    https://widgets.topstats.gg/762217899355013120/servers.png?timeframe=alltime
+    ```
+    <img
+      src="https://widgets.topstats.gg/762217899355013120/servers.png?timeframe=alltime"
+      alt="bot-graph-image"
+    />
+  </Tab>
+  <Tab value="monthlyvotes">
+    ```sh
+    https://widgets.topstats.gg/762217899355013120/monthlyvotes.png?timeframe=30d
+    ```
+    <img
+      src="https://widgets.topstats.gg/762217899355013120/monthlyvotes.png?timeframe=30d"
+      alt="bot-graph-image"
+    />
+  </Tab>
+  <Tab value="totalvotes">
+    ```sh
+    https://widgets.topstats.gg/762217899355013120/totalvotes.png?timeframe=90d
+    ```
+    <img
+      src="https://widgets.topstats.gg/762217899355013120/totalvotes.png?timeframe=90d"
+      alt="bot-graph-image"
+    />
+  </Tab>
+</Tabs>

content/app/commands.mdx

@@ -0,0 +1,17 @@
+---
+title: Commands
+description: Command list and usage for TopStats.gg's Discord App.
+icon: SquareSlash
+---
+
+| Command   | Description                                    |
+|-----------|------------------------------------------------|
+|`/auctions`| Get useful information about Top.gg's Auctions.|
+|`/botinfo` | Get info about a specific bot.                 |
+|`/bots`    | Get bots owned by a specific user.             |
+|`/graph`   | Get the top bots for a specific category       |
+|`/help`    | Get help about the bot.                        |
+|`/ping`    | Replies with Pong!                             |
+|`/search`  | Search bots directly on TopStats!              |
+|`/top`     | Get the top bots for a specific category       |
+|`/ping`    | Check if the bot is responsive                 |

content/app/faq.mdx

@@ -0,0 +1,65 @@
+---
+title: FAQ
+description: Frequently Asked Questions about TopStats.gg's App.
+icon: TextSearch
+---
+
+import { Accordion, Accordions } from 'fumadocs-ui/components/accordion'
+import { Step, Steps } from 'fumadocs-ui/components/steps'
+
+<Accordions type='single'>
+  <Accordion id='disable-command' title='How can I disable a command?'>
+    <Steps>
+      <Step>
+        Go to your Discord **Server Settings**.
+        ![server-settings-image](/faq/app/server-settings.png)
+      </Step>
+      <Step>
+        Click **Integrations**. You should see **TopStats** listed there.
+      </Step>
+      <Step>
+        Click **TopStats** to open an overview of its commands.
+        ![get-bot-image](/faq/app/get-bot.png)
+      </Step>
+      <Step>
+        Click the command you want to disable, select the **@everyone** role,
+        set it to **❌**, then click **Save**.
+        ![edit-permissions-image](/faq/app/edit-permissions.png)
+      </Step>
+    </Steps>
+    <Callout type={'info'}>
+      This hides the command for members, but it will remain visible to
+      administrators.
+    </Callout>
+    [Learn more about Discord Command
+    Permissions](https://discord.com/blog/slash-commands-permissions-discord-apps-bots)
+  </Accordion>
+  <Accordion
+    id='external-emojis'
+    title='Why arent external emojis showing properly?'
+  >
+    Make sure the bot has the **Use External Emojis** permission in your server.
+    ![permission-image](/faq/app/permission-external-emojis.png)
+  </Accordion>
+  <Accordion
+    id='interaction-failed'
+    title='Slash Commands Respond With "This Interaction Failed"'
+  >
+    If you get a "This Interaction Failed" error when using slash commands, try
+    updating Discord. If that does not work, make sure that TopStats is online
+    and that there is not currently an outage. If none of this works, reach out
+    to our [Support Server](https://discord.gg/x48WXcTFVD).
+  </Accordion>
+  <Accordion id='slash-command-failed' title='Slash Commands Wont Work'>
+    If slash commands are not appearing in your server, try the following:
+    1. Make sure they are enabled. Go to the [Install the App](./invite/index.mdx) page to learn more.
+    2. Make sure you have the `Use Application Commands` permission in role and channel settings.
+    3. Try [re-inviting the bot](https://discord.com/oauth2/authorize?client_id=583807014896140293)
+    4. Make sure your Discord is up-to-date.
+    If you have tried all of these and are still having issues, reach out to us in our [Support Server](https://discord.gg/x48WXcTFVD).
+  </Accordion>
+  <Accordion id='deauthorize-app' title='TopStats slash commands are still showing after I removed the bot from my server.'>
+    If you are still seeing TopStats commands while typing `/`, most likely you have added TopStats into your profile. Go to your **Discord settings** > **Authorized Apps** and **deauthorize** TopStats from there.
+    ![deauthorize-app-image](/faq/app/deauthorize-app.png)
+  </Accordion>
+</Accordions>

content/app/index.mdx

@@ -0,0 +1,24 @@
+---
+title: Introduction
+description: Getting Started with the TopStats Discord App
+icon: House
+---
+
+import { Card, Cards } from 'fumadocs-ui/components/card'
+import { Star, SquarePlus } from 'lucide-react'
+
+<h4 className="text-fd-muted-foreground scroll-m-20">
+  <a className="not-prose group text-sm uppercase">Get Started</a>
+</h4>
+  <Cards>
+  <Card icon={<SquarePlus className="text-red-300" />} href="https://discord.com/oauth2/authorize?client_id=583807014896140293" title="Add TopStats to your Server">
+    Add the TopStats bot to your Discord server in just a few clicks!
+  </Card>
+  <Card icon={<Star className="text-yellow-500" />} href="https://top.gg/bot/583807014896140293#reviews" title="Leave us a Review">
+    Enjoying TopStats? Leave us a review on Top.gg to help us grow!
+  </Card>
+</Cards>
+
+<Callout type={'info'}>
+  Please note: You may be asked to log in to your Discord account to add the bot, and you must have the `Manage Server` permission in the server you want to add Topstats to.
+</Callout>

content/app/invite/app.mdx

@@ -0,0 +1,25 @@
+---
+title: Add to My Apps
+description: Add TopStats to your account and use it everywhere!
+icon: User
+---
+
+import { Step, Steps } from 'fumadocs-ui/components/steps'
+
+<Steps>
+  <Step>
+    ## Step 1 
+    Visit https://discord.com/oauth2/authorize?client_id=583807014896140293
+  </Step>
+  <Step>
+    ## Step 2 
+    Click **Add to My Apps**.
+    ![invite-app](/content/app/invite-app.png)
+  </Step>
+  <Step>
+    ## Step 3
+    Confirm by clicking on **Authorize**.
+    ![invite-app-authorize](/content/app/invite-app-authorize.png)
+  </Step>
+    You've successfully added the app to your account.
+</Steps>