Repository: louislam/uptime-kuma
File: src/components/PublicGroupList.vue (Vue)

Code before:
         * Attempts to guess if a link should be shown based upon if
         * sendUrl is set and if the URL is default or not.
         * @param {Object} monitor Monitor to check
         * @param {boolean} [ignoreSendUrl=false] Should the presence of the sendUrl
         * property be ignored. This will only work in edit mode.
         * @returns {boolean}
         */
        showLink(monitor, ignoreSendUrl = false) {
            // We must check if there are any elements in monitorList to
            // prevent undefined errors if it hasn't been loaded yet
            if (this.$parent.editMode && ignoreSendUrl && Object.keys(this.$root.monitorList).length) {
                return this.$root.monitorList[monitor.element.id].type === "http" || this.$root.monitorList[monitor.element.id].type === "keyword";
            }
            return monitor.element.sendUrl && monitor.element.url && monitor.element.url !== "https://" && !this.editMode;
        },

        /**
         * Returns formatted certificate expiry or Bad cert message
         * @param {Object} monitor Monitor to show expiry for
         * @returns {string}
         */
        formatExpiry(monitor) {
            if (monitor?.element?.validCert) {
                return monitor.element.certExpiryDaysRemaining + " days";
            } else {
                return monitor.element.certExpiryDaysRemaining;
            }
        },
    }
};
</script>

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

.no-monitor-msg {
    position: absolute;
    width: 100%;
    top: 20px;
    left: 0;
}

.monitor-list {
    min-height: 46px;
}

.item-name {
    padding-left: 5px;
    padding-right: 5px;
    margin: 0;
    display: inline-block;

Review comment (refactor):
If you rely on the server-generated message like this, `No/Bad Cert` will not be able to be translated. Is this an intentional decision?
(Could this be refactored to the frontend?)

Code after:
        },

        /**
         * Should a link to the monitor be shown?
         * Attempts to guess if a link should be shown based upon if
         * sendUrl is set and if the URL is default or not.
         * @param {Object} monitor Monitor to check
         * @param {boolean} [ignoreSendUrl=false] Should the presence of the sendUrl
         * property be ignored. This will only work in edit mode.
         * @returns {boolean}
         */
        showLink(monitor, ignoreSendUrl = false) {
            // We must check if there are any elements in monitorList to
            // prevent undefined errors if it hasn't been loaded yet
            if (this.$parent.editMode && ignoreSendUrl && Object.keys(this.$root.monitorList).length) {
                return this.$root.monitorList[monitor.element.id].type === "http" || this.$root.monitorList[monitor.element.id].type === "keyword" || this.$root.monitorList[monitor.element.id].type === "json-query";
            }
            return monitor.element.sendUrl && monitor.element.url && monitor.element.url !== "https://" && !this.editMode;
        },

        /**
         * Returns formatted certificate expiry or Bad cert message
         * @param {Object} monitor Monitor to show expiry for
         * @returns {string}
         */
        formattedCertExpiryMessage(monitor) {
            if (monitor?.element?.validCert && monitor?.element?.certExpiryDaysRemaining) {
                return monitor.element.certExpiryDaysRemaining + " " + this.$tc("day", monitor.element.certExpiryDaysRemaining);
            } else if (monitor?.element?.validCert === false) {
                return this.$t("noOrBadCertificate");
            } else {
                return this.$t("Unknown") + " " + this.$tc("day", 2);
            }
        },

        /**
         * Returns certificate expiry based on days remaining
         * @param {Object} monitor Monitor to show expiry for
         * @returns {string}
         */
        certExpiryColor(monitor) {
            if (monitor?.element?.validCert && monitor.element.certExpiryDaysRemaining > 7) {
                return "#059669";
            }
            return "#DC2626";
        },
    }
};
</script>

<style lang="scss" scoped>