{"id":15638902,"url":"https://github.com/fuma-nama/discord-bot-dashboard","last_synced_at":"2025-10-15T09:44:46.445Z","repository":{"id":128139454,"uuid":"522593979","full_name":"fuma-nama/discord-bot-dashboard","owner":"fuma-nama","description":"A Full-Featured Modern Dashboard Template for Discord Bots","archived":false,"fork":false,"pushed_at":"2023-07-26T12:19:20.000Z","size":22729,"stargazers_count":104,"open_issues_count":0,"forks_count":53,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-04-15T03:53:18.168Z","etag":null,"topics":["dashboard","dashboard-templates","discord","discord-bot","discord-bot-dashboard","discord-bot-website","javascript","web"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/fuma-nama.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2022-08-08T14:57:57.000Z","updated_at":"2025-03-27T09:20:05.000Z","dependencies_parsed_at":"2023-09-16T23:09:02.844Z","dependency_job_id":null,"html_url":"https://github.com/fuma-nama/discord-bot-dashboard","commit_stats":null,"previous_names":["fuma-nama/discord-bot-dashboard"],"tags_count":0,"template":true,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fuma-nama%2Fdiscord-bot-dashboard","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fuma-nama%2Fdiscord-bot-dashboard/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fuma-nama%2Fdiscord-bot-dashboard/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fuma-nama%2Fdiscord-bot-dashboard/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/fuma-nama","download_url":"https://codeload.github.com/fuma-nama/discord-bot-dashboard/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":249003955,"owners_count":21196794,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["dashboard","dashboard-templates","discord","discord-bot","discord-bot-dashboard","discord-bot-website","javascript","web"],"created_at":"2024-10-03T11:23:49.448Z","updated_at":"2025-10-15T09:44:41.392Z","avatar_url":"https://github.com/fuma-nama.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"\u003e Next generation of the Dashboard is out! \u003cbr\u003e\n\u003e https://github.com/SonMooSans/discord-bot-dashboard-2\n\n![Demo](document/img.png)\n\n# D-Dash: Discord Bot Dashboard\n\nA Full-Featured Dashboard Template for Discord Bots\n\u003cbr\u003e\nYou can modify `config/config.js` to edit configuration without touching the codes\n\u003cbr\u003e\nFeel free to contribute this project\n\n**Watch the Demo on [YouTube](https://youtu.be/Z90Ax-v4uH4)**\n\n## Features\n* Modern Design with Chakra UI\n* Localization Support (English and Chinese)\n* Customizable UI (`config.js`)\n* Built-in **Features** and **Actions** System\n* Existing Backend Implementation\n\n## Getting Started\n**First, clone this Template**\n```\ngit clone https://github.com/SonMooSans/discord-bot-dashboard.git\n```\n\nD-Dash is not just a Template, it supports to add **Feature** and **Action** in configuration\n\u003cbr\u003e\nTherefore, it requires a full Backend Implementation.\n\u003cbr\u003e\nFor the implementation in Kotlin, See the [Example](https://github.com/SonMooSans/discord-bot-dashboard-backend)\n\nYou may implement your own Backend APi in another languages by implementing routes mentioned in its README\n\n## Configuration\nGo to the [config.js](src/config/config.js)\n\u003cbr\u003e\nThis configuration allows you to customize the UI, there is a `config.d.ts` for type annotations\n\n### Normal Settings\nYou need to specify the API Url and invite url of your bot\n\u003cbr\u003e\nYou might also add footer items in configuration\n```javascript\nconst config = {\n    name: \"Bot Name\",\n    footer: [\n        {\n            name: \"Hello World\",\n            url: \"https://github.com\"\n        }\n    ],\n    //API url\n    serverUrl: \"http://localhost:8080\",\n    //Invite url of your bot\n    inviteUrl: \"https://discord.com/api/oauth2/authorize?client_id=1004280473956139038\u0026permissions=8\u0026scope=bot\",\n}\n```\n\n### Display Data or Statistics\nYou can customize data to display in your dashboard.\n\u003cbr\u003e\n#### Items function\nit reads `detail` and `state`, then returns `DataItem` array which determines what to display\n\n#### Dashboard Data\nIt is an Array of Dashboard Data Row, you can customize options of each row to get additional data from `state`\n\nEach Data Row contains a items function\n\u003cbr\u003e\nYou can set `advanced` to true, so the dashboard will fetch `/guild/:guild/detail/advanced` and pass the result to the function by `state.advanced`\nIt will be displayed in **Statistics** Tab\n\n#### Actions and Features Data\nThey are both **Items function**\n\nIt will be displayed in **Actions** and **Features** Tab\n\u003cbr\u003e\nyou can display the statistics of things like **Ranks**, **Reaction Role** \n\n```javascript\nconst config = {\n    data: {\n        dashboard: [\n            {\n                advanced: true,\n                count: 3, //count of placeholders\n                //advanced will be null if row.advanced is false\n                items: (detail, {advanced}) =\u003e [\n                    DataItem\n                ]\n            }\n        ],\n        actions: detail =\u003e [\n            DataItem\n        ],\n        features: detail =\u003e [\n            DataItem\n        ]\n    }\n}\n```\n\n### Features and Actions\nYou must define bot features and actions in configuration\n\u003cbr\u003e\nAlso, the Features and Actions System must be implemented at your API\n\n#### Feature\n**Feature** is something that can be enabled or disabled, after enabling a feature.\n\u003cbr\u003e\nUser can edit its options and customize the behavior of bot\n\n#### Action\n**Action** contains multi **Tasks**, User can publish or delete Tasks\n\u003cbr\u003e\nUser must define some options before publishing a task\n\nAction can be used for `Reaction Role` since you might want the Reaction Role can be enabled for multi messages\n\n#### Options\nEach Feature and Action requires an options array used to customize settings\n\u003cbr\u003e\nWhen user updates options, server will receive a map of ids and its value\n\nThe **Options Function** will receive the `values` of feature/action fetched from server\n\u003cbr\u003e\nFor **Action**, values will be null before user publish the Task\n\n```javascript\nconst config = {\n    features: {\n        \"id_of_feature\": {\n            name: \"Welcome Message\",\n            description: \"Send a Mesage to welcome a member when they just joined the Server\",\n            options: (values) =\u003e [\n                //Example option\n                {\n                    id: \"message\",\n                    name: \"Message\",\n                    description: \"The message to be sent\",\n                    type: OptionTypes.Message_Create, //A Message/Embed Creator \n                    value: values? values.message : \"\",\n                }\n            ]\n        }\n    },\n    actions: {\n        \"id_of_action\": {\n            name: \"Reaction Role\",\n            description: \"Give user a role when reacts to a Message\",\n            //values will be null before user publish the Task\n            options: (values) =\u003e [\n                //Example option\n                {\n                    id: \"message\",\n                    name: \"Message\",\n                    description: \"The message to be sent\",\n                    type: OptionTypes.Message_Create, //A Message/Embed Creator \n                    value: values? values.message : \"\",\n                },\n            ]\n        }\n    }\n}\n```\n\n### Multi Languages\nSome fields support Multi Languages\n\u003cbr\u003e\nYou can see their type annotations to check about it\n\nFor those fields, you can use: \n```javascript\ntext = {\n    zh: \"Chinese\",\n    en: \"English\"\n}\n```\n\nFor now, we only supports **English (en)** or **Chinese (zh)**.\n\u003cbr\u003e\nYou can use `\u003cLocale zh=\"Chinese\" en=\"English\" /\u003e` on some fields since they may supports `JSXElement`\n\n## the Template of Template\nThis Dashboard is Based on [Horizon UI ⚡️](https://horizon-ui.com/horizon-ui-chakra)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffuma-nama%2Fdiscord-bot-dashboard","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffuma-nama%2Fdiscord-bot-dashboard","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffuma-nama%2Fdiscord-bot-dashboard/lists"}