Feat: Badge Generator #2915

kiznick · 2023-03-10T12:23:11Z

⚠️⚠️⚠️ Since we do not accept all types of pull requests and do not want to waste your time. Please be sure that you have read pull request rules:
https://github.com/louislam/uptime-kuma/blob/master/CONTRIBUTING.md#can-i-create-a-pull-request-for-uptime-kuma

Tick the checkbox if you understand [x]:

I have read and understand the pull request rules.

Description

In PR: #1119 Badges have been added but there's no telling if this feature exists and there's no way to use it other than reading the PR, I'd like to make a Badge Generator to make it easier to use.

Type of change

Please delete any options that are not relevant.

User interface (UI)
New feature (non-breaking change which adds functionality)

Checklist

My code follows the style guidelines of this project
I ran ESLint and other linters for modified files
I have performed a self-review of my own code and tested it
I have commented my code, particularly in hard-to-understand areas
(including JSDoc for methods)
My changes generate no new warnings
My code needed automated testing. I have added them (this is optional task)

Screenshots (if any)

Zaid-maker · 2023-03-13T10:47:16Z

That's pretty amazing that someone added that functionality ❤️

chakflying

Fix lint.

src/components/BadgeGeneratorDialog.vue

Co-authored-by: Nelson Chan <3271800+chakflying@users.noreply.github.com>

kiznick

Thanks for fix it!

chakflying

I'm not a fan of the original icon-only toggle for the public link, it's not easy to understand. But at least this is in line with the current UI.

Tokynet · 2023-04-26T21:11:48Z

What is holding up this PR?

src/components/BadgeGeneratorDialog.vue

CommanderStorm · 2023-05-14T22:02:59Z

src/components/BadgeGeneratorDialog.vue

+                        </select>
+                    </div>
+
+                    <div v-if=" (parameters[badge.type || 'null'] || [] ).includes('duration') " class="mb-3">


This v-if statement seems very ugly (and used more than once).
Have you considered a computed property for this usecase?

Co-authored-by: Frank Elsinga <frank@elsinga.de>

louislam · 2023-05-29T12:02:00Z

I'm not a fan of the original icon-only toggle for the public link, it's not easy to understand. But at least this is in line with the current UI.

Tested this pr, it is working. I agree with @chakflying. The icons in the list is a bit strange. I am thinking maybe we can make them into a 3dot button.

kiznick · 2023-05-29T12:43:24Z

I'm not a fan of the original icon-only toggle for the public link, it's not easy to understand. But at least this is in line with the current UI.

Tested this pr, it is working. I agree with @chakflying. The icons in the list is a bit strange. I am thinking maybe we can make them into a 3dot button.

What if we create another modal and merge 2 current buttons to this modal like this?
I think it will be useful if there will be more functions later.

louislam · 2023-05-29T12:54:50Z

Yes, it would be better.

louislam · 2023-05-30T12:50:42Z

The behaviour of the model is a little bit strange. When I incidentally drag it or try to highlight some text inside, it will disappear.

kiznick · 2023-05-30T13:07:07Z

The behaviour of the model is a little bit strange. When I incidentally drag it or try to highlight some text inside, it will disappear.

already fix

chakflying · 2023-05-31T08:39:57Z

I think we need to add the clickable link strings to en.json to be able to translate it.

kiznick · 2023-05-31T08:45:29Z

I think we need to add the clickable link strings to en.json to be able to translate it.

I can add in /src/lang/en.json right?

chakflying · 2023-05-31T09:06:27Z

Yes.

Add i18n variable for Badge Generator #2915

mbh-dev · 2023-06-12T22:36:24Z

Apologies if I'm being dumb, but how do you access this option within Uptime Kuma? I've successfully upgraded to Version: 1.22.0-beta.0 but cannot find this awesome feature anywhere.

Thanks

louislam · 2023-06-13T03:19:27Z

I'm not a fan of the original icon-only toggle for the public link, it's not easy to understand. But at least this is in line with the current UI.

Tested this pr, it is working. I agree with @chakflying. The icons in the list is a bit strange. I am thinking maybe we can make them into a 3dot button.

What if we create another modal and merge 2 current buttons to this modal like this? I think it will be useful if there will be more functions later.

@mbh-dev See these images.

RobertCSternberg · 2023-06-26T14:40:21Z

Edit:
Read here first if you recently updated and need more information on the badge feature #1119

A couple of questions that I believe would be helpful for many after the recent update. In the next release, some examples would be great or an instruction page on Github could be helpful also.

Have not figured out the answer to this yet. Edit: HEX code

I think this might be based on the interval of the monitor. Edit: After testing this looks like hours rather than based on the interval of the monitor.

joebailey26 · 2023-06-28T09:21:48Z

Apologies if I'm being dumb, but how do you access this option within Uptime Kuma? I've successfully upgraded to Version: 1.22.0-beta.0 but cannot find this awesome feature anywhere.

Thanks

I too can't see this feature on any page after upgrading to 1.22.0

CommanderStorm · 2023-06-28T12:14:25Z

I too can't see this feature on any page after upgrading to 1.22.0

The Badge generator can be found on the status page

joebailey26 · 2023-06-28T16:15:46Z

I too can't see this feature on any page after upgrading to 1.22.0

The Badge generator can be found on the status page

chakflying · 2023-06-28T16:38:22Z

Did you try clicking "Edit Status Page"?

joebailey26 · 2023-06-28T22:23:58Z

Did you try clicking "Edit Status Page"?

chakflying · 2023-06-28T22:47:26Z

The "Open Badge Generator" button can be seen by clicking the Gear icon to the right of your monitor "Galexia BOS".

joebailey26 · 2023-06-28T22:49:36Z

The "Open Badge Generator" button can be seen by clicking the Gear icon to the right of your monitor "Galexia BOS".

Brilliant thank you! I've got it now. That's very tucked away.

kiznick added 3 commits March 10, 2023 17:46

Create badge-list.md

56d716c

generator modal

3bbf269

idk how to fix camelcase lint 😢

16f2701

kiznick changed the title ~~Create badge-list.md~~ Feat: Badge Generator Mar 10, 2023

kiznick marked this pull request as ready for review March 10, 2023 14:01

Change Icon, Add missing var

29b2809

Merge branch 'louislam:master' into badge-generator

030fadd

chakflying requested changes Apr 12, 2023

View reviewed changes

Fix Eslint

3579520

Co-authored-by: Nelson Chan <3271800+chakflying@users.noreply.github.com>

kiznick commented Apr 12, 2023

View reviewed changes

chakflying approved these changes Apr 12, 2023

View reviewed changes

louislam added this to the 1.22.0 milestone May 13, 2023

CommanderStorm reviewed May 14, 2023

View reviewed changes

Update src/components/BadgeGeneratorDialog.vue

966066b

Co-authored-by: Frank Elsinga <frank@elsinga.de>

CommanderStorm mentioned this pull request May 20, 2023

Feat: Badges generator #1712

Closed

6 tasks

Setting Modal

85eb084

Fix Modal

3ff910a

louislam merged commit 039fdb0 into louislam:master May 31, 2023
16 checks passed

kiznick mentioned this pull request May 31, 2023

Add i18n variable for Badge Generator #2915 #3211

Merged

7 tasks

louislam added a commit that referenced this pull request May 31, 2023

Merge pull request #3211 from kiznick/badge-generator

4b3a2ee

Add i18n variable for Badge Generator #2915

chakflying mentioned this pull request Jun 28, 2023

Chore: Add value placeholders & preview for badge generator #3329

Merged

7 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Feat: Badge Generator #2915

Feat: Badge Generator #2915

kiznick commented Mar 10, 2023 •

edited

Zaid-maker commented Mar 13, 2023

chakflying left a comment

kiznick left a comment

chakflying left a comment

Tokynet commented Apr 26, 2023

CommanderStorm May 14, 2023

louislam commented May 29, 2023

kiznick commented May 29, 2023

louislam commented May 29, 2023

louislam commented May 30, 2023

kiznick commented May 30, 2023 •

edited

chakflying commented May 31, 2023

kiznick commented May 31, 2023

chakflying commented May 31, 2023

mbh-dev commented Jun 12, 2023

louislam commented Jun 13, 2023

RobertCSternberg commented Jun 26, 2023 •

edited

joebailey26 commented Jun 28, 2023

CommanderStorm commented Jun 28, 2023

joebailey26 commented Jun 28, 2023

chakflying commented Jun 28, 2023

joebailey26 commented Jun 28, 2023

chakflying commented Jun 28, 2023

joebailey26 commented Jun 28, 2023

Feat: Badge Generator #2915

Feat: Badge Generator #2915

Conversation

kiznick commented Mar 10, 2023 • edited

Description

Type of change

Checklist

Screenshots (if any)

Zaid-maker commented Mar 13, 2023

chakflying left a comment

Choose a reason for hiding this comment

kiznick left a comment

Choose a reason for hiding this comment

chakflying left a comment

Choose a reason for hiding this comment

Tokynet commented Apr 26, 2023

CommanderStorm May 14, 2023

Choose a reason for hiding this comment

louislam commented May 29, 2023

kiznick commented May 29, 2023

louislam commented May 29, 2023

louislam commented May 30, 2023

kiznick commented May 30, 2023 • edited

chakflying commented May 31, 2023

kiznick commented May 31, 2023

chakflying commented May 31, 2023

mbh-dev commented Jun 12, 2023

louislam commented Jun 13, 2023

RobertCSternberg commented Jun 26, 2023 • edited

joebailey26 commented Jun 28, 2023

CommanderStorm commented Jun 28, 2023

joebailey26 commented Jun 28, 2023

chakflying commented Jun 28, 2023

joebailey26 commented Jun 28, 2023

chakflying commented Jun 28, 2023

joebailey26 commented Jun 28, 2023

kiznick commented Mar 10, 2023 •

edited

kiznick commented May 30, 2023 •

edited

RobertCSternberg commented Jun 26, 2023 •

edited