Edit Challenge page + other user/mod linked pages

[koreangeekman]

Describe the bug

• Clicking on 'Moderators' breaks the page and cannot navigate out of it without refreshing ChallengeModeratorCard.vue:9 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'name') at Proxy._sfc_render (ChallengeModeratorCard.vue:9:116)

Permissions based issues:

• Able to get to the overview and other options as an anonymous user when not yet published
• • Disable the 'Join Challenge' button when not published
• • Auth-required on 'Grade Users' & 'Moderators' but not on 'Edit Challenge' or 'Submissions' (attempting to submit does get rejected though)
• Hide the moderator links for non-owners/-moderators

Visual change suggestions:

• Grading and Submission pages: Add 'none yet' or something similar if displaying the field
• Have something indicate which user/mod-link is active
• Add more spacing on the left? or remove some of the gap between and on the right to balance
• Add a placeholder in the WYSIWYG editor stating its purpose or title the box with the purpose (ie. Challenge Description)
• Don't display the image that overlays the badge until one is provided (showing a broken alt image tag that also says 'undefined')
• 'Save Challenge' instead of Update Challenge? - doesn't make sense to update what is supposed to be new
• Some of the buttons are rounded on their joined sides and others are squared
• Add some separations around the requirements section
• Separate the badge section more visibly
• Separate the Update/Save Challenge button at the bottom from the badge section
• Toggling between Upload Image URL vs File and the placeholder is misleading

[koreangeekman]

Many visual aspects applied. Primary bug issue resolved.

Secondary follow-up functionality pending

[koreangeekman]

Secondary follow-up functionality resolved - preventing page load on unauthorized, redirect to error page. Added to Profile moderations page as well.

Task: create new issue regarding Milestones functionality