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

Code before:
            let groupName = "Untitled Group";

            if (this.$root.publicGroupList.length === 0) {
                groupName = "Services";
            }

            this.$root.publicGroupList.push({
                name: groupName,
                monitorList: [],
            });
        },

        discard() {
            location.reload();
        },

        changeTheme(name) {
            this.config.statusPageTheme = name;
        },
        changeTagsVisibilty(newState) {
            this.config.statusPageTags = newState;

            // On load, the status page will not include tags if it's not enabled for security reasons
            // Which means if we enable tags, it won't show in the UI until saved
            // So we have this to enhance UX and load in the tags from the authenticated source instantly
            this.$root.publicGroupList = this.$root.publicGroupList.map((group)=>{
                return {
                    ...group,
                    monitorList: group.monitorList.map((monitor)=> {
                        // We only include the tags if visible so we can reuse the logic to hide the tags on disable
                        return {
                            ...monitor,
                            tags: newState ? this.$root.monitorList[monitor.id].tags : []
                        }
                    })
                }
            });
        },

        /**
         * Crop Success
         */
        cropSuccess(imgDataUrl) {
            this.imgDataUrl = imgDataUrl;
        },

        showImageCropUploadMethod() {
            if (this.editMode) {
                this.showImageCropUpload = true;
            }
        },

Review comment (suggestion):
```suggestion
            this.$root.publicGroupList = this.$root.publicGroupList.map((group) => {
```

Code after:
            let groupName = "Untitled Group";

            if (this.$root.publicGroupList.length === 0) {
                groupName = "Services";
            }

            this.$root.publicGroupList.push({
                name: groupName,
                monitorList: [],
            });
        },

        discard() {
            location.reload();
        },

        changeTheme(name) {
            this.config.statusPageTheme = name;
        },
        changeTagsVisibilty(newState) {
            this.config.statusPageTags = newState;

            // On load, the status page will not include tags if it's not enabled for security reasons
            // Which means if we enable tags, it won't show in the UI until saved
            // So we have this to enhance UX and load in the tags from the authenticated source instantly
            this.$root.publicGroupList = this.$root.publicGroupList.map((group) => {
                return {
                    ...group,
                    monitorList: group.monitorList.map((monitor) => {
                        // We only include the tags if visible so we can reuse the logic to hide the tags on disable
                        return {
                            ...monitor,
                            tags: newState ? this.$root.monitorList[monitor.id].tags : []
                        }
                    })
                }
            });
        },

        /**
         * Crop Success
         */
        cropSuccess(imgDataUrl) {
            this.imgDataUrl = imgDataUrl;
        },

        showImageCropUploadMethod() {
            if (this.editMode) {
                this.showImageCropUpload = true;
            }
        },