From 4d27064db3e0ea7d7c26be1bb951f3b8f04e5455 Mon Sep 17 00:00:00 2001 From: floatingghost Date: Tue, 9 Aug 2022 02:16:23 +0000 Subject: [PATCH] Show bubble instances in about panel (#123) Reviewed-on: https://akkoma.dev/AkkomaGang/pleroma-fe/pulls/123 --- src/boot/after_store.js | 1 + src/components/about/about.js | 4 ++- src/components/about/about.vue | 1 + .../local_bubble_panel/local_bubble_panel.js | 12 +++++++ .../local_bubble_panel.scss | 21 +++++++++++++ .../local_bubble_panel/local_bubble_panel.vue | 31 +++++++++++++++++++ src/i18n/en.json | 2 ++ 7 files changed, 71 insertions(+), 1 deletion(-) create mode 100644 src/components/local_bubble_panel/local_bubble_panel.js create mode 100644 src/components/local_bubble_panel/local_bubble_panel.scss create mode 100644 src/components/local_bubble_panel/local_bubble_panel.vue diff --git a/src/boot/after_store.js b/src/boot/after_store.js index b2c8d59d..c4cddd5a 100644 --- a/src/boot/after_store.js +++ b/src/boot/after_store.js @@ -285,6 +285,7 @@ const getNodeInfo = async ({ store }) => { }) store.dispatch('setInstanceOption', { name: 'federationPolicy', value: federation }) + store.dispatch('setInstanceOption', { name: 'localBubbleInstances', value: metadata.localBubbleInstances }) store.dispatch('setInstanceOption', { name: 'federating', value: typeof federation.enabled === 'undefined' diff --git a/src/components/about/about.js b/src/components/about/about.js index 1df25845..e69bf8f9 100644 --- a/src/components/about/about.js +++ b/src/components/about/about.js @@ -3,6 +3,7 @@ import FeaturesPanel from '../features_panel/features_panel.vue' import TermsOfServicePanel from '../terms_of_service_panel/terms_of_service_panel.vue' import StaffPanel from '../staff_panel/staff_panel.vue' import MRFTransparencyPanel from '../mrf_transparency_panel/mrf_transparency_panel.vue' +import LocalBubblePanel from '../local_bubble_panel/local_bubble_panel.vue' const About = { components: { @@ -10,7 +11,8 @@ const About = { FeaturesPanel, TermsOfServicePanel, StaffPanel, - MRFTransparencyPanel + MRFTransparencyPanel, + LocalBubblePanel }, computed: { showFeaturesPanel () { return this.$store.state.instance.showFeaturesPanel }, diff --git a/src/components/about/about.vue b/src/components/about/about.vue index 5d5d6479..221fc381 100644 --- a/src/components/about/about.vue +++ b/src/components/about/about.vue @@ -3,6 +3,7 @@ + diff --git a/src/components/local_bubble_panel/local_bubble_panel.js b/src/components/local_bubble_panel/local_bubble_panel.js new file mode 100644 index 00000000..7fb5ada2 --- /dev/null +++ b/src/components/local_bubble_panel/local_bubble_panel.js @@ -0,0 +1,12 @@ +import { mapState } from 'vuex' +import { get } from 'lodash' + +const LocalBubblePanel = { + computed: { + ...mapState({ + bubbleInstances: state => get(state, 'instance.localBubbleInstances') + }) + } +} + +export default LocalBubblePanel diff --git a/src/components/local_bubble_panel/local_bubble_panel.scss b/src/components/local_bubble_panel/local_bubble_panel.scss new file mode 100644 index 00000000..80ea01d4 --- /dev/null +++ b/src/components/local_bubble_panel/local_bubble_panel.scss @@ -0,0 +1,21 @@ +.mrf-section { + margin: 1em; + + table { + width:100%; + text-align: left; + padding-left:10px; + padding-bottom:20px; + + th, td { + width: 180px; + max-width: 360px; + overflow: hidden; + vertical-align: text-top; + } + + th+th, td+td { + width: auto; + } + } +} diff --git a/src/components/local_bubble_panel/local_bubble_panel.vue b/src/components/local_bubble_panel/local_bubble_panel.vue new file mode 100644 index 00000000..4b9eaf51 --- /dev/null +++ b/src/components/local_bubble_panel/local_bubble_panel.vue @@ -0,0 +1,31 @@ + + + + + diff --git a/src/i18n/en.json b/src/i18n/en.json index eb0bf4aa..26774ef8 100644 --- a/src/i18n/en.json +++ b/src/i18n/en.json @@ -1,5 +1,7 @@ { "about": { + "bubble_instances": "Local Bubble Instances", + "bubble_instances_description": "Instances chosen by the admins to represent the local area of this instance", "mrf": { "federation": "Federation", "keyword": {