diff --git a/changes/changelog.d/872.feature b/changes/changelog.d/872.feature new file mode 100644 index 000000000..083601ecf --- /dev/null +++ b/changes/changelog.d/872.feature @@ -0,0 +1 @@ +Redesign of the landing and about pages (#872) diff --git a/changes/notes.rst b/changes/notes.rst index 442fc0528..51c53e857 100644 --- a/changes/notes.rst +++ b/changes/notes.rst @@ -62,6 +62,39 @@ For more information about this feature, please check out our documentation: - `User documentation `_ +Landing and about page redesign [Manual action suggested] +^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + +In this release, we've completely redesigned the landing and about page, by making it more useful and adapted to your pod +configuration. Among other things, the landing page will now include: + +- your pod and an excerpt from your pod's description +- your pod banner image, if any +- your contact email, if any +- the login form +- the signup form (if registrations are open on your pod) +- some basic statistics about your pod +- a widget including recently uploaded albums, if anonymous access is enabled + +The landing page will still include some information about Funkwhale, but in a less intrusive and proeminent way than before. + +Additionally, the about page now includes: + +- your pod name, description, rules and terms +- your pod banner image, if any +- your contact email, if any +- comprehensive statistics about your pod +- some info about your pod configuration, such as registration and federation status or the default upload quota for new users + +With this redesign, we've added a handful of additional pod settings: + +- Pod banner image +- Contact email +- Rules +- Terms of service + +We recommend taking a few moments to fill these accordingly to your needs, by visiting ``/manage/settings``. + Allow-list to restrict federation to trusted domains ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/front/src/App.vue b/front/src/App.vue index 9881554f9..5be97dfb5 100644 --- a/front/src/App.vue +++ b/front/src/App.vue @@ -62,13 +62,12 @@ export default { data () { return { bridge: null, - nodeinfo: null, instanceUrl: null, showShortcutsModal: false, showSetInstanceModal: false, } }, - created () { + async created () { this.openWebsocket() let self = this if (!this.$store.state.ui.selectedLanguage) { @@ -78,7 +77,12 @@ export default { // used to redraw ago dates every minute self.$store.commit('ui/computeLastDate') }, 1000 * 60) - if (!this.$store.state.instance.instanceUrl) { + const urlParams = new URLSearchParams(window.location.search); + const serverUrl = urlParams.get('_server') + if (serverUrl) { + this.$store.commit('instance/instanceUrl', serverUrl) + } + else if (!this.$store.state.instance.instanceUrl) { // we have several way to guess the API server url. By order of precedence: // 1. use the url provided in settings.json, if any // 2. use the url specified when building via VUE_APP_INSTANCE_URL @@ -89,9 +93,9 @@ export default { // needed to trigger initialization of axios this.$store.commit('instance/instanceUrl', this.$store.state.instance.instanceUrl) } + await this.fetchNodeInfo() this.$store.dispatch('auth/check') this.$store.dispatch('instance/fetchSettings') - this.fetchNodeInfo() this.$store.commit('ui/addWebsocketEventHandler', { eventName: 'inbox.item_added', id: 'sidebarCount', @@ -152,14 +156,11 @@ export default { this.$store.commit('ui/incrementNotifications', {type: 'pendingReviewEdits', value: event.pending_review_count}) }, incrementPendingReviewReportsCountInSidebar (event) { - console.log('HELLO', event) this.$store.commit('ui/incrementNotifications', {type: 'pendingReviewReports', value: event.unresolved_count}) }, - fetchNodeInfo () { - let self = this - axios.get('instance/nodeinfo/2.0/').then(response => { - self.nodeinfo = response.data - }) + async fetchNodeInfo () { + let response = await axios.get('instance/nodeinfo/2.0/') + this.$store.commit('instance/nodeinfo', response.data) }, autodetectLanguage () { let userLanguage = navigator.language || navigator.userLanguage @@ -235,7 +236,8 @@ export default { }, computed: { ...mapState({ - messages: state => state.ui.messages + messages: state => state.ui.messages, + nodeinfo: state => state.instance.nodeinfo, }), ...mapGetters({ currentTrack: 'queue/currentTrack' diff --git a/front/src/assets/network.png b/front/src/assets/network.png new file mode 100644 index 000000000..e9d5f4ddd Binary files /dev/null and b/front/src/assets/network.png differ diff --git a/front/src/components/About.vue b/front/src/components/About.vue index 87f741aa8..3c84b48f9 100644 --- a/front/src/components/About.vue +++ b/front/src/components/About.vue @@ -1,38 +1,197 @@