From 8642fd67b44218f18784a99ccf372c85254c66f0 Mon Sep 17 00:00:00 2001 From: Ryzyx Date: Wed, 11 Aug 2021 09:28:11 +0530 Subject: [PATCH 1/7] Update README.md --- README.md | 19 ++++++++++++++++--- 1 file changed, 16 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 7578b05..ef121f8 100644 --- a/README.md +++ b/README.md @@ -10,14 +10,27 @@ # discordjs-button-pagination A simple package to paginate discord embeds via discord buttons introduced in [discord.js v13](https://github.com/discordjs/discord.js/tree/master). +# Versions + +## `discordjs-button-pagination@interaction` [Default] +for slash command interaction. + +## `discordjs-button-pagination@msg` +for message command. # Installation -* `npm install discordjs-button-pagination` +For `message` event +* `npm install discordjs-button-pagination@msg` + +For `interaction` event +* `npm install discordjs-button-pagination@interaction` + +## Default command: `npm install discordjs-button-pagination` will install the **`interaction`** version # Requirements -Node.js 14.0.0 or newer is required along with Discord.js 13.0.0 +Node.js 16.6.1 or newer is required along with Discord.js 13.0.0 or newer. -# Usage +# Usage for Message Command __Basic Bot Example__ ```js // Import the discordjs-button-pagination package From 798d16dd470eb3af1ef56b288763778f28a0cd12 Mon Sep 17 00:00:00 2001 From: TesseractB <81273859+TesseractB@users.noreply.github.com> Date: Tue, 8 Feb 2022 17:18:59 -0500 Subject: [PATCH 2/7] Remove `Message.deleted` in favor of `Message.editable` `Message.deleted` will be removed in upcoming versions of Discord.JS, switched to `Message.editable` since all it does is edit the message --- index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.js b/index.js index c04146e..6cb77ac 100644 --- a/index.js +++ b/index.js @@ -60,7 +60,7 @@ const paginationEmbed = async (msg, pages, buttonList, timeout = 120000) => { }); collector.on("end", () => { - if (!curPage.deleted) { + if (curPage.editable) { const disabledRow = new MessageActionRow().addComponents( buttonList[0].setDisabled(true), buttonList[1].setDisabled(true) From 448bddd9e5b5a8cfddd3b26bde818248a647f824 Mon Sep 17 00:00:00 2001 From: TesseractB <81273859+TesseractB@users.noreply.github.com> Date: Tue, 8 Feb 2022 17:22:59 -0500 Subject: [PATCH 3/7] Passes Object instead of string for Embed Footer `MessageEmbed.setFooter` will no longer support strings passed to `.setFooter()` in upcoming versions. Switched to object instead. --- index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.js b/index.js index 6cb77ac..8feb1b3 100644 --- a/index.js +++ b/index.js @@ -66,7 +66,7 @@ const paginationEmbed = async (msg, pages, buttonList, timeout = 120000) => { buttonList[1].setDisabled(true) ); curPage.edit({ - embeds: [pages[page].setFooter(`Page ${page + 1} / ${pages.length}`)], + embeds: [pages[page].setFooter({text: `Page ${page + 1} / ${pages.length}`})], components: [disabledRow], }); } From 5ce3acb6fac57d0e3f639cc3a6f45d630fac822d Mon Sep 17 00:00:00 2001 From: TesseractB <81273859+TesseractB@users.noreply.github.com> Date: Tue, 8 Feb 2022 17:24:47 -0500 Subject: [PATCH 4/7] Get the ones I missed fix the embed footers that I missed in my previous commit. --- index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/index.js b/index.js index 8feb1b3..585a1ad 100644 --- a/index.js +++ b/index.js @@ -27,7 +27,7 @@ const paginationEmbed = async (msg, pages, buttonList, timeout = 120000) => { const row = new MessageActionRow().addComponents(buttonList); const curPage = await msg.channel.send({ - embeds: [pages[page].setFooter(`Page ${page + 1} / ${pages.length}`)], + embeds: [pages[page].setFooter({text: `Page ${page + 1} / ${pages.length}`})], components: [row], }); @@ -53,7 +53,7 @@ const paginationEmbed = async (msg, pages, buttonList, timeout = 120000) => { } await i.deferUpdate(); await i.editReply({ - embeds: [pages[page].setFooter(`Page ${page + 1} / ${pages.length}`)], + embeds: [pages[page].setFooter({text: `Page ${page + 1} / ${pages.length}`})], components: [row], }); collector.resetTimer(); From 9b4cfce980b496cdf7e249ae9386b9dd31abcf7b Mon Sep 17 00:00:00 2001 From: thevalleyy <74456686+thevalleyy@users.noreply.github.com> Date: Wed, 3 Aug 2022 22:00:33 +0200 Subject: [PATCH 5/7] add update to dcjs v14 --- LICENSE | 42 +++++----- README.md | 214 +++++++++++++++++++++++++-------------------------- index.js | 164 +++++++++++++++++++++------------------ package.json | 62 +++++++-------- 4 files changed, 246 insertions(+), 236 deletions(-) diff --git a/LICENSE b/LICENSE index 2353021..27f91f9 100644 --- a/LICENSE +++ b/LICENSE @@ -1,21 +1,21 @@ -MIT License - -Copyright (c) 2021 Ryzyx - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in all -copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE -SOFTWARE. +MIT License + +Copyright (c) 2022 Ryzyx and thevalleyy + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/README.md b/README.md index ef121f8..068a581 100644 --- a/README.md +++ b/README.md @@ -1,107 +1,107 @@ -[![discordjs-pagination](https://user-images.githubusercontent.com/57099786/126899921-eb1e0728-ab64-4d28-a59c-835662957a8a.png)](https://npmjs.com/package/discordjs-button-pagination) - -
-

- NPM info -

-
- -# discordjs-button-pagination -A simple package to paginate discord embeds via discord buttons introduced in [discord.js v13](https://github.com/discordjs/discord.js/tree/master). - -# Versions - -## `discordjs-button-pagination@interaction` [Default] -for slash command interaction. - -## `discordjs-button-pagination@msg` -for message command. -# Installation -For `message` event -* `npm install discordjs-button-pagination@msg` - -For `interaction` event -* `npm install discordjs-button-pagination@interaction` - -## Default command: `npm install discordjs-button-pagination` will install the **`interaction`** version - -# Requirements -Node.js 16.6.1 or newer is required along with Discord.js 13.0.0 or newer. - - -# Usage for Message Command -__Basic Bot Example__ -```js -// Import the discordjs-button-pagination package -const paginationEmbed = require('discordjs-button-pagination'); - -// Use MessageEmbed to make pages -// Keep in mind that Embeds should't have their footers set since the pagination method sets page info there -const { MessageEmbed , MessageButton} = require('discord.js'); -const embed1 = new MessageEmbed() - .setTitle('First Page') - .setDescription('This is the first page'); - -const embed2 = new MessageEmbed() - .setTitle('Second Page') - .setDescription('This is the second page'); - -const button1 = new MessageButton() - .setCustomId('previousbtn') - .setLabel('Previous') - .setStyle('DANGER'); - -const button2 = new MessageButton() - .setCustomId('nextbtn') - .setLabel('Next') - .setStyle('SUCCESS'); - -// Create an array of embeds -pages = [ - embed1, - embed2, - //.... - //embedN -]; - -//create an array of buttons - -buttonList = [ - button1, - button2 -] - - -// Call the paginationEmbed method, first three arguments are required -// timeout is the time till the reaction collectors are active, after this you can't change pages (in ms), defaults to 120000 -paginationEmbed(message, pages, buttonList, timeout); -// There you go, now you have paged embeds -``` - -# Note -This will not work with buttons whose style is set as 'LINK' as they do not trigger an interaction event. The buttons will auto disable once the the collector ends after the timeout. -## The collector timer resets after receiving a button interaction. - -# Preview - -First Page - -![pic1](https://user-images.githubusercontent.com/57099786/126900536-0daa030b-eaae-4a00-ad1c-912a2a5ca6af.PNG) - - - -Second Page - -![pic2](https://user-images.githubusercontent.com/57099786/126900544-96fd0163-26f8-44b4-b823-f84756ae0028.PNG) - - - -Disabled Buttons after collector end - -![pic3](https://user-images.githubusercontent.com/57099786/126900553-b9ab9cb7-1dfd-45ae-9e31-469b249f0c18.PNG) - - - -### For any issues or suggestions, kindly open an issue/pull request on the [**GitHub Repository**](https://github.com/ryzyx/discordjs-button-pagination) - +[![discordjs-pagination](https://user-images.githubusercontent.com/57099786/126899921-eb1e0728-ab64-4d28-a59c-835662957a8a.png)](https://npmjs.com/package/discordjs-button-pagination) + +
+

+ NPM info +

+
+ +# discordjs-button-pagination +A simple package to paginate discord embeds via discord buttons introduced in [discord.js v13](https://github.com/discordjs/discord.js/tree/master). + +# Versions + +## `discordjs-button-pagination@interaction` [Default] +for slash command interaction. + +## `discordjs-button-pagination@msg` +for message command. +# Installation +For `message` event +* `npm install discordjs-button-pagination@msg` + +For `interaction` event +* `npm install discordjs-button-pagination@interaction` + +## Default command: `npm install discordjs-button-pagination` will install the **`interaction`** version + +# Requirements +Node.js 18.0.0 or newer is required along with Discord.js 14.1.2 or newer. + + +# Usage for Interaction (Slash Command) +__Basic Bot Example__ +```js +// Import the discordjs-button-pagination package +const paginationEmbed = require('discordjs-button-pagination'); + +// Use EmbedBuilder to make pages +// Keep in mind that Embeds should't have their footers set since the pagination method sets page info there +const { EmbedBuilder , ButtonBuilder} = require('discord.js') +const embed1 = new EmbedBuilder() + .setTitle('First Page') + .setDescription('This is the first page'); + +const embed2 = new EmbedBuilder() + .setTitle('Second Page') + .setDescription('This is the second page'); + +const button1 = new ButtonBuilder() + .setCustomId('previousbtn') + .setLabel('Previous') + .setStyle('Danger'); + +const button2 = new ButtonBuilder() + .setCustomId('nextbtn') + .setLabel('Next') + .setStyle('Success'); + +// Create an array of embeds +pages = [ + embed1, + embed2, + //.... + //embedN +]; + +//create an array of buttons + +buttonList = [ + button1, + button2 +] + + +// Call the paginationEmbed method, first three arguments are required +// timeout is the time till the reaction collectors are active, after this you can't change pages (in ms), defaults to 120000 +paginationEmbed(interaction, pages, buttonList, timeout); +// There you go, now you have paged embeds +``` + +# Note +This will not work with buttons whose style is set as 'LINK' as they do not trigger an interaction event. The buttons will auto disable once the the collector ends after the timeout. +## The collector timer resets after receiving a button interaction. + +# Preview + +First Page + +![pic1](https://user-images.githubusercontent.com/57099786/126900536-0daa030b-eaae-4a00-ad1c-912a2a5ca6af.PNG) + + + +Second Page + +![pic2](https://user-images.githubusercontent.com/57099786/126900544-96fd0163-26f8-44b4-b823-f84756ae0028.PNG) + + + +Disabled Buttons after collector end + +![pic3](https://user-images.githubusercontent.com/57099786/126900553-b9ab9cb7-1dfd-45ae-9e31-469b249f0c18.PNG) + + + +### For any issues or suggestions, kindly open an issue/pull request on the [**GitHub Repository**](https://github.com/ryzyx/discordjs-button-pagination) + diff --git a/index.js b/index.js index 585a1ad..234997b 100644 --- a/index.js +++ b/index.js @@ -1,77 +1,87 @@ -const { - MessageActionRow, - Message, - MessageEmbed, - MessageButton, -} = require("discord.js"); - -/** - * Creates a pagination embed - * @param {Message} msg - * @param {MessageEmbed[]} pages - * @param {MessageButton[]} buttonList - * @param {number} timeout - * @returns - */ -const paginationEmbed = async (msg, pages, buttonList, timeout = 120000) => { - if (!msg && !msg.channel) throw new Error("Channel is inaccessible."); - if (!pages) throw new Error("Pages are not given."); - if (!buttonList) throw new Error("Buttons are not given."); - if (buttonList[0].style === "LINK" || buttonList[1].style === "LINK") - throw new Error( - "Link buttons are not supported with discordjs-button-pagination" - ); - if (buttonList.length !== 2) throw new Error("Need two buttons."); - - let page = 0; - - const row = new MessageActionRow().addComponents(buttonList); - const curPage = await msg.channel.send({ - embeds: [pages[page].setFooter({text: `Page ${page + 1} / ${pages.length}`})], - components: [row], - }); - - const filter = (i) => - i.customId === buttonList[0].customId || - i.customId === buttonList[1].customId; - - const collector = await curPage.createMessageComponentCollector({ - filter, - time: timeout, - }); - - collector.on("collect", async (i) => { - switch (i.customId) { - case buttonList[0].customId: - page = page > 0 ? --page : pages.length - 1; - break; - case buttonList[1].customId: - page = page + 1 < pages.length ? ++page : 0; - break; - default: - break; - } - await i.deferUpdate(); - await i.editReply({ - embeds: [pages[page].setFooter({text: `Page ${page + 1} / ${pages.length}`})], - components: [row], - }); - collector.resetTimer(); - }); - - collector.on("end", () => { - if (curPage.editable) { - const disabledRow = new MessageActionRow().addComponents( - buttonList[0].setDisabled(true), - buttonList[1].setDisabled(true) - ); - curPage.edit({ - embeds: [pages[page].setFooter({text: `Page ${page + 1} / ${pages.length}`})], - components: [disabledRow], - }); - } - }); - - return curPage; -}; -module.exports = paginationEmbed; +const { + ActionRowBuilder, + Message, + EmbedBuilder, + ButtonBuilder, +} = require("discord.js"); + +/** + * Creates a pagination embed + * @param {Message} msg + * @param {EmbedBuilder[]} pages + * @param {ButtonBuilder[]} buttonList + * @param {number} timeout + * @returns + */ +const paginationEmbed = async ( + msg, + pages, + buttonList, + timeout = 120000 +) => { + if (!msg && !msg.channel) throw new Error("Channel is inaccessible."); + if (!pages) throw new Error("Pages are not given."); + if (!buttonList) throw new Error("Buttons are not given."); + if (buttonList[0].style === "LINK" || buttonList[1].style === "LINK") + throw new Error( + "Link buttons are not supported with discordjs-button-pagination" + ); + if (buttonList.length !== 2) throw new Error("Need two buttons."); + + let page = 0; + + if (pages.length === 1) return await msg.channel.send({ + embeds: [pages[0].setFooter({ text: `Page ${page + 1} / ${pages.length}` })] + }); + + const row = new ActionRowBuilder().addComponents(buttonList); + + const curPage = await msg.channel.send({ + embeds: [pages[page].setFooter({ text: `Page ${page + 1} / ${pages.length}` })], + components: [row] + }); + + const filter = (i) => + i.custom_id === buttonList[0].custo_id || + i.custom_id === buttonList[1].custom_id; + + const collector = await curPage.createMessageComponentCollector({ + filter, + time: timeout, + }); + + collector.on("collect", async (i) => { + switch (i.customId) { + case buttonList[0].data.custom_id: + page = page > 0 ? --page : pages.length - 1; + break; + case buttonList[1].data.custom_id: + page = page + 1 < pages.length ? ++page : 0; + break; + default: + break; + } + await i.deferUpdate(); + await i.editReply({ + embeds: [pages[page].setFooter({ text: `Page ${page + 1} / ${pages.length}` })], + components: [row], + }); + collector.resetTimer(); + }); + + collector.on("end", () => { + if (curPage.editable) { + const disabledRow = new ActionRowBuilder().addComponents( + buttonList[0].setDisabled(true), + buttonList[1].setDisabled(true) + ); + curPage.edit({ + embeds: [pages[page].setFooter({ text: `Page ${page + 1} / ${pages.length}` })], + components: [disabledRow], + }); + } +}); + + return curPage; +}; +module.exports = paginationEmbed; diff --git a/package.json b/package.json index f3997d7..2575270 100644 --- a/package.json +++ b/package.json @@ -1,31 +1,31 @@ -{ - "name": "discordjs-button-pagination", - "version": "1.0.5", - "description": "A simple package for pagination using buttons introduced in discord.js v13.", - "main": "index.js", - "scripts": { - "test": "echo \"Error: no test specified\" && exit 1" - }, - "repository": { - "type": "git", - "url": "git+https://github.com/ryzyx/discordjs-button-pagination.git" - }, - "keywords": [ - "Discord", - "Buttons", - "Pagination", - "discord-buttons", - "paginator", - "discordjs", - "discord.js" - ], - "author": "Ryzyx", - "license": "MIT", - "bugs": { - "url": "https://github.com/ryzyx/discordjs-button-pagination/issues" - }, - "homepage": "https://github.com/ryzyx/discordjs-button-pagination#readme", - "dependencies": { - "discord.js": "^13.0.1" - } -} +{ + "name": "discordjs-button-pagination", + "version": "4.0.0", + "description": "A simple package for pagination using buttons introduced in discord.js v14.", + "main": "index.js", + "scripts": { + "test": "echo \"Error: no test specified\" && exit 1" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/ryzyx/discordjs-button-pagination.git" + }, + "keywords": [ + "Discord", + "Buttons", + "Pagination", + "discord-buttons", + "paginator", + "discordjs", + "discord.js" + ], + "author": "Ryzyx", + "license": "MIT", + "bugs": { + "url": "https://github.com/ryzyx/discordjs-button-pagination/issues" + }, + "homepage": "https://github.com/ryzyx/discordjs-button-pagination#readme", + "dependencies": { + "discord.js": "^14.1.2" + } +} From 4ac9a136d1b54674d93155b3cef756a65c62714e Mon Sep 17 00:00:00 2001 From: thevalleyy <74456686+thevalleyy@users.noreply.github.com> Date: Wed, 3 Aug 2022 22:01:45 +0200 Subject: [PATCH 6/7] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 068a581..736828c 100644 --- a/README.md +++ b/README.md @@ -27,7 +27,7 @@ For `interaction` event ## Default command: `npm install discordjs-button-pagination` will install the **`interaction`** version # Requirements -Node.js 18.0.0 or newer is required along with Discord.js 14.1.2 or newer. +Node.js 16.9.0 or newer is required along with Discord.js 14.1.2 or newer. # Usage for Interaction (Slash Command) From 45a288b073daef1f29089ec3fcabe4538d00bab1 Mon Sep 17 00:00:00 2001 From: Ryzyx <57099786+ryzyx@users.noreply.github.com> Date: Tue, 20 Sep 2022 20:09:13 +0530 Subject: [PATCH 7/7] Revert "update to v14" --- LICENSE | 42 +++++----- README.md | 214 +++++++++++++++++++++++++-------------------------- index.js | 164 ++++++++++++++++++--------------------- package.json | 62 +++++++-------- 4 files changed, 236 insertions(+), 246 deletions(-) diff --git a/LICENSE b/LICENSE index 27f91f9..2353021 100644 --- a/LICENSE +++ b/LICENSE @@ -1,21 +1,21 @@ -MIT License - -Copyright (c) 2022 Ryzyx and thevalleyy - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in all -copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE -SOFTWARE. +MIT License + +Copyright (c) 2021 Ryzyx + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/README.md b/README.md index 736828c..ef121f8 100644 --- a/README.md +++ b/README.md @@ -1,107 +1,107 @@ -[![discordjs-pagination](https://user-images.githubusercontent.com/57099786/126899921-eb1e0728-ab64-4d28-a59c-835662957a8a.png)](https://npmjs.com/package/discordjs-button-pagination) - -
-

- NPM info -

-
- -# discordjs-button-pagination -A simple package to paginate discord embeds via discord buttons introduced in [discord.js v13](https://github.com/discordjs/discord.js/tree/master). - -# Versions - -## `discordjs-button-pagination@interaction` [Default] -for slash command interaction. - -## `discordjs-button-pagination@msg` -for message command. -# Installation -For `message` event -* `npm install discordjs-button-pagination@msg` - -For `interaction` event -* `npm install discordjs-button-pagination@interaction` - -## Default command: `npm install discordjs-button-pagination` will install the **`interaction`** version - -# Requirements -Node.js 16.9.0 or newer is required along with Discord.js 14.1.2 or newer. - - -# Usage for Interaction (Slash Command) -__Basic Bot Example__ -```js -// Import the discordjs-button-pagination package -const paginationEmbed = require('discordjs-button-pagination'); - -// Use EmbedBuilder to make pages -// Keep in mind that Embeds should't have their footers set since the pagination method sets page info there -const { EmbedBuilder , ButtonBuilder} = require('discord.js') -const embed1 = new EmbedBuilder() - .setTitle('First Page') - .setDescription('This is the first page'); - -const embed2 = new EmbedBuilder() - .setTitle('Second Page') - .setDescription('This is the second page'); - -const button1 = new ButtonBuilder() - .setCustomId('previousbtn') - .setLabel('Previous') - .setStyle('Danger'); - -const button2 = new ButtonBuilder() - .setCustomId('nextbtn') - .setLabel('Next') - .setStyle('Success'); - -// Create an array of embeds -pages = [ - embed1, - embed2, - //.... - //embedN -]; - -//create an array of buttons - -buttonList = [ - button1, - button2 -] - - -// Call the paginationEmbed method, first three arguments are required -// timeout is the time till the reaction collectors are active, after this you can't change pages (in ms), defaults to 120000 -paginationEmbed(interaction, pages, buttonList, timeout); -// There you go, now you have paged embeds -``` - -# Note -This will not work with buttons whose style is set as 'LINK' as they do not trigger an interaction event. The buttons will auto disable once the the collector ends after the timeout. -## The collector timer resets after receiving a button interaction. - -# Preview - -First Page - -![pic1](https://user-images.githubusercontent.com/57099786/126900536-0daa030b-eaae-4a00-ad1c-912a2a5ca6af.PNG) - - - -Second Page - -![pic2](https://user-images.githubusercontent.com/57099786/126900544-96fd0163-26f8-44b4-b823-f84756ae0028.PNG) - - - -Disabled Buttons after collector end - -![pic3](https://user-images.githubusercontent.com/57099786/126900553-b9ab9cb7-1dfd-45ae-9e31-469b249f0c18.PNG) - - - -### For any issues or suggestions, kindly open an issue/pull request on the [**GitHub Repository**](https://github.com/ryzyx/discordjs-button-pagination) - +[![discordjs-pagination](https://user-images.githubusercontent.com/57099786/126899921-eb1e0728-ab64-4d28-a59c-835662957a8a.png)](https://npmjs.com/package/discordjs-button-pagination) + +
+

+ NPM info +

+
+ +# discordjs-button-pagination +A simple package to paginate discord embeds via discord buttons introduced in [discord.js v13](https://github.com/discordjs/discord.js/tree/master). + +# Versions + +## `discordjs-button-pagination@interaction` [Default] +for slash command interaction. + +## `discordjs-button-pagination@msg` +for message command. +# Installation +For `message` event +* `npm install discordjs-button-pagination@msg` + +For `interaction` event +* `npm install discordjs-button-pagination@interaction` + +## Default command: `npm install discordjs-button-pagination` will install the **`interaction`** version + +# Requirements +Node.js 16.6.1 or newer is required along with Discord.js 13.0.0 or newer. + + +# Usage for Message Command +__Basic Bot Example__ +```js +// Import the discordjs-button-pagination package +const paginationEmbed = require('discordjs-button-pagination'); + +// Use MessageEmbed to make pages +// Keep in mind that Embeds should't have their footers set since the pagination method sets page info there +const { MessageEmbed , MessageButton} = require('discord.js'); +const embed1 = new MessageEmbed() + .setTitle('First Page') + .setDescription('This is the first page'); + +const embed2 = new MessageEmbed() + .setTitle('Second Page') + .setDescription('This is the second page'); + +const button1 = new MessageButton() + .setCustomId('previousbtn') + .setLabel('Previous') + .setStyle('DANGER'); + +const button2 = new MessageButton() + .setCustomId('nextbtn') + .setLabel('Next') + .setStyle('SUCCESS'); + +// Create an array of embeds +pages = [ + embed1, + embed2, + //.... + //embedN +]; + +//create an array of buttons + +buttonList = [ + button1, + button2 +] + + +// Call the paginationEmbed method, first three arguments are required +// timeout is the time till the reaction collectors are active, after this you can't change pages (in ms), defaults to 120000 +paginationEmbed(message, pages, buttonList, timeout); +// There you go, now you have paged embeds +``` + +# Note +This will not work with buttons whose style is set as 'LINK' as they do not trigger an interaction event. The buttons will auto disable once the the collector ends after the timeout. +## The collector timer resets after receiving a button interaction. + +# Preview + +First Page + +![pic1](https://user-images.githubusercontent.com/57099786/126900536-0daa030b-eaae-4a00-ad1c-912a2a5ca6af.PNG) + + + +Second Page + +![pic2](https://user-images.githubusercontent.com/57099786/126900544-96fd0163-26f8-44b4-b823-f84756ae0028.PNG) + + + +Disabled Buttons after collector end + +![pic3](https://user-images.githubusercontent.com/57099786/126900553-b9ab9cb7-1dfd-45ae-9e31-469b249f0c18.PNG) + + + +### For any issues or suggestions, kindly open an issue/pull request on the [**GitHub Repository**](https://github.com/ryzyx/discordjs-button-pagination) + diff --git a/index.js b/index.js index 234997b..585a1ad 100644 --- a/index.js +++ b/index.js @@ -1,87 +1,77 @@ -const { - ActionRowBuilder, - Message, - EmbedBuilder, - ButtonBuilder, -} = require("discord.js"); - -/** - * Creates a pagination embed - * @param {Message} msg - * @param {EmbedBuilder[]} pages - * @param {ButtonBuilder[]} buttonList - * @param {number} timeout - * @returns - */ -const paginationEmbed = async ( - msg, - pages, - buttonList, - timeout = 120000 -) => { - if (!msg && !msg.channel) throw new Error("Channel is inaccessible."); - if (!pages) throw new Error("Pages are not given."); - if (!buttonList) throw new Error("Buttons are not given."); - if (buttonList[0].style === "LINK" || buttonList[1].style === "LINK") - throw new Error( - "Link buttons are not supported with discordjs-button-pagination" - ); - if (buttonList.length !== 2) throw new Error("Need two buttons."); - - let page = 0; - - if (pages.length === 1) return await msg.channel.send({ - embeds: [pages[0].setFooter({ text: `Page ${page + 1} / ${pages.length}` })] - }); - - const row = new ActionRowBuilder().addComponents(buttonList); - - const curPage = await msg.channel.send({ - embeds: [pages[page].setFooter({ text: `Page ${page + 1} / ${pages.length}` })], - components: [row] - }); - - const filter = (i) => - i.custom_id === buttonList[0].custo_id || - i.custom_id === buttonList[1].custom_id; - - const collector = await curPage.createMessageComponentCollector({ - filter, - time: timeout, - }); - - collector.on("collect", async (i) => { - switch (i.customId) { - case buttonList[0].data.custom_id: - page = page > 0 ? --page : pages.length - 1; - break; - case buttonList[1].data.custom_id: - page = page + 1 < pages.length ? ++page : 0; - break; - default: - break; - } - await i.deferUpdate(); - await i.editReply({ - embeds: [pages[page].setFooter({ text: `Page ${page + 1} / ${pages.length}` })], - components: [row], - }); - collector.resetTimer(); - }); - - collector.on("end", () => { - if (curPage.editable) { - const disabledRow = new ActionRowBuilder().addComponents( - buttonList[0].setDisabled(true), - buttonList[1].setDisabled(true) - ); - curPage.edit({ - embeds: [pages[page].setFooter({ text: `Page ${page + 1} / ${pages.length}` })], - components: [disabledRow], - }); - } -}); - - return curPage; -}; -module.exports = paginationEmbed; +const { + MessageActionRow, + Message, + MessageEmbed, + MessageButton, +} = require("discord.js"); + +/** + * Creates a pagination embed + * @param {Message} msg + * @param {MessageEmbed[]} pages + * @param {MessageButton[]} buttonList + * @param {number} timeout + * @returns + */ +const paginationEmbed = async (msg, pages, buttonList, timeout = 120000) => { + if (!msg && !msg.channel) throw new Error("Channel is inaccessible."); + if (!pages) throw new Error("Pages are not given."); + if (!buttonList) throw new Error("Buttons are not given."); + if (buttonList[0].style === "LINK" || buttonList[1].style === "LINK") + throw new Error( + "Link buttons are not supported with discordjs-button-pagination" + ); + if (buttonList.length !== 2) throw new Error("Need two buttons."); + + let page = 0; + + const row = new MessageActionRow().addComponents(buttonList); + const curPage = await msg.channel.send({ + embeds: [pages[page].setFooter({text: `Page ${page + 1} / ${pages.length}`})], + components: [row], + }); + + const filter = (i) => + i.customId === buttonList[0].customId || + i.customId === buttonList[1].customId; + + const collector = await curPage.createMessageComponentCollector({ + filter, + time: timeout, + }); + + collector.on("collect", async (i) => { + switch (i.customId) { + case buttonList[0].customId: + page = page > 0 ? --page : pages.length - 1; + break; + case buttonList[1].customId: + page = page + 1 < pages.length ? ++page : 0; + break; + default: + break; + } + await i.deferUpdate(); + await i.editReply({ + embeds: [pages[page].setFooter({text: `Page ${page + 1} / ${pages.length}`})], + components: [row], + }); + collector.resetTimer(); + }); + + collector.on("end", () => { + if (curPage.editable) { + const disabledRow = new MessageActionRow().addComponents( + buttonList[0].setDisabled(true), + buttonList[1].setDisabled(true) + ); + curPage.edit({ + embeds: [pages[page].setFooter({text: `Page ${page + 1} / ${pages.length}`})], + components: [disabledRow], + }); + } + }); + + return curPage; +}; +module.exports = paginationEmbed; diff --git a/package.json b/package.json index 2575270..f3997d7 100644 --- a/package.json +++ b/package.json @@ -1,31 +1,31 @@ -{ - "name": "discordjs-button-pagination", - "version": "4.0.0", - "description": "A simple package for pagination using buttons introduced in discord.js v14.", - "main": "index.js", - "scripts": { - "test": "echo \"Error: no test specified\" && exit 1" - }, - "repository": { - "type": "git", - "url": "git+https://github.com/ryzyx/discordjs-button-pagination.git" - }, - "keywords": [ - "Discord", - "Buttons", - "Pagination", - "discord-buttons", - "paginator", - "discordjs", - "discord.js" - ], - "author": "Ryzyx", - "license": "MIT", - "bugs": { - "url": "https://github.com/ryzyx/discordjs-button-pagination/issues" - }, - "homepage": "https://github.com/ryzyx/discordjs-button-pagination#readme", - "dependencies": { - "discord.js": "^14.1.2" - } -} +{ + "name": "discordjs-button-pagination", + "version": "1.0.5", + "description": "A simple package for pagination using buttons introduced in discord.js v13.", + "main": "index.js", + "scripts": { + "test": "echo \"Error: no test specified\" && exit 1" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/ryzyx/discordjs-button-pagination.git" + }, + "keywords": [ + "Discord", + "Buttons", + "Pagination", + "discord-buttons", + "paginator", + "discordjs", + "discord.js" + ], + "author": "Ryzyx", + "license": "MIT", + "bugs": { + "url": "https://github.com/ryzyx/discordjs-button-pagination/issues" + }, + "homepage": "https://github.com/ryzyx/discordjs-button-pagination#readme", + "dependencies": { + "discord.js": "^13.0.1" + } +}