Repository: louislam/uptime-kuma
File: src/pages/DashboardHome.vue (Vue)

Code before:
            }

        },

        clearAllEventsDialog() {
            this.$refs.confirmClearEvents.show();
        },
        clearAllEvents() {
            this.clearingAllEvents = true;
            // Call for each monitor
            const monitorIDs = Object.keys(this.$root.monitorList);
            let done = 0;
            let failed = 0;

            if (monitorIDs.length === 0) {
                this.clearingAllEvents = false;
                this.$root.notyf.error(this.$t("No monitors found"));
                return;
            }

            monitorIDs.forEach((monitorID) => {
                this.$root.getSocket().emit("clearEvents", monitorID, (res) => {
                    if (res && res.ok) {
                        done++;
                    } else {
                        failed++;
                    }
                    if (done + failed === monitorIDs.length) {
                        this.clearingAllEvents = false;
                        this.page = 1;
                        this.getImportantHeartbeatListLength();
                        if (failed === 0) {
                            this.$root.notyf.success(this.$t("Events cleared successfully"));
                        } else {
                            this.$root.notyf.error(this.$t("Some events could not be cleared"));
                        }
                    }
                });
            });
        },
    },
};
</script>

<style lang="scss" scoped>
@import "../assets/vars";

.num {
    font-size: 30px;
    color: $primary;
    font-weight: bold;

Review comment (bug):
lets use this in the error notification when not all events could be cleared like this
Could not be clear failed/done+failed events

or lets just track it as a boolean `someEvents`

Code after:
            }

        },

        clearAllEventsDialog() {
            this.$refs.confirmClearEvents.show();
        },
        clearAllEvents() {
            this.clearingAllEvents = true;
            const monitorIDs = Object.keys(this.$root.monitorList);
            let failed = 0;
            const total = monitorIDs.length;

            if (total === 0) {
                this.clearingAllEvents = false;
                this.$root.toastError(this.$t("No monitors found"));
                return;
            }

            monitorIDs.forEach((monitorID) => {
                this.$root.getSocket().emit("clearEvents", monitorID, (res) => {
                    if (!res || !res.ok) {
                        failed++;
                    }
                });
            });
            this.clearingAllEvents = false;
            this.page = 1;
            this.getImportantHeartbeatListLength();
            if (failed === 0) {
                this.$root.toastSuccess(this.$t("Events cleared successfully"));
            } else {
                this.$root.toastError(
                    this.$t("Could not clear events", {
                        failed,
                        total,
                    })
                );
            }
        },
    },
};
</script>

<style lang="scss" scoped>
@import "../assets/vars";

.num {
    font-size: 30px;
    color: $primary;
    font-weight: bold;