From 02687e68bb9b0c354548ab82cf41b3d12d52cabe Mon Sep 17 00:00:00 2001
From: Massedil <massedil-framagit.org@msd.im>
Date: Sat, 2 Nov 2024 16:06:17 +0100
Subject: [PATCH] Issue #1546 Change block order

---
 src/views/Group/GroupView.vue | 314 +++++++++++++++++-----------------
 1 file changed, 157 insertions(+), 157 deletions(-)

diff --git a/src/views/Group/GroupView.vue b/src/views/Group/GroupView.vue
index f32f8268c..6d4d718f6 100644
--- a/src/views/Group/GroupView.vue
+++ b/src/views/Group/GroupView.vue
@@ -373,18 +373,155 @@
         </div>
       </header>
     </div>
+    <div class="grid grid-cols-1 md:grid-cols-3 gap-2 mb-2">
+      <!-- Public thing: Members -->
+      <group-section :title="t('Members')" icon="account-group">
+        <template #default>
+          <div class="flex flex-col justify-center h-full">
+            <div
+              class="flex flex-col items-center"
+              v-if="isCurrentActorAGroupMember && !previewPublic && members"
+            >
+              <div class="flex">
+                <figure
+                  :title="
+                    t(`{'@'}{username} ({role})`, {
+                      username: usernameWithDomain(member.actor),
+                      role: member.role,
+                    })
+                  "
+                  v-for="member in members.elements"
+                  :key="member.actor.id"
+                  class="-mr-3"
+                >
+                  <img
+                    class="rounded-full h-8"
+                    :src="member.actor.avatar.url"
+                    v-if="member.actor.avatar"
+                    alt=""
+                    width="32"
+                    height="32"
+                  />
+                  <AccountCircle v-else :size="32" />
+                </figure>
+              </div>
+            </div>
+            <div class="">
+              <h2 class="text-center">
+                {{
+                  t(
+                    "{count} members",
+                    {
+                      count: group.members?.total,
+                    },
+                    group.members?.total
+                  )
+                }}
+              </h2>
+            </div>
+          </div></template
+        >
+        <template #create>
+          <o-button
+            v-if="isCurrentActorAGroupAdmin && !previewPublic"
+            tag="router-link"
+            :to="{
+              name: RouteName.GROUP_MEMBERS_SETTINGS,
+              params: { preferredUsername: usernameWithDomain(group) },
+            }"
+            class="button is-primary"
+            >{{ t("Add / Remove…") }}</o-button
+          >
+        </template>
+      </group-section>
+      <!-- Public thing: About -->
+      <group-section :title="t('About')" icon="information">
+        <template #default>
+          <div
+            v-if="group.summary"
+            dir="auto"
+            class="prose lg:prose-xl dark:prose-invert p-2"
+            v-html="group.summary"
+          ></div>
+          <empty-content v-else icon="information" :inline="true">
+            {{ t("No about content yet") }}
+          </empty-content>
+        </template>
+        <template #create>
+          <o-button
+            v-if="isCurrentActorAGroupAdmin && !previewPublic"
+            tag="router-link"
+            :to="{
+              name: RouteName.GROUP_PUBLIC_SETTINGS,
+              params: { preferredUsername: usernameWithDomain(group) },
+            }"
+            class="button is-primary"
+            >{{ t("Edit") }}</o-button
+          >
+        </template>
+      </group-section>
+      <!-- Public thing: Location -->
+      <group-section :title="t('Location')" icon="earth">
+        <template #default
+          ><div
+            class="flex flex-col justify-center h-full"
+            v-if="physicalAddress && physicalAddress.url"
+          >
+            <o-icon
+              v-if="physicalAddress.poiInfos.poiIcon.icon"
+              :icon="physicalAddress.poiInfos.poiIcon.icon"
+              customSize="48"
+            />
+            <Earth v-else :size="48" />
+            <div class="address-wrapper">
+              <div class="address">
+                <div class="text-center">
+                  <span v-if="!addressFullName(physicalAddress)">{{
+                    t("No address defined")
+                  }}</span>
+                  <address dir="auto">
+                    <p
+                      class="addressDescription"
+                      :title="physicalAddress.poiInfos.name"
+                    >
+                      {{ physicalAddress.poiInfos.name }}
+                    </p>
+                    <p class="has-text-grey-dark">
+                      {{ physicalAddress.poiInfos.alternativeName }}
+                    </p>
+                  </address>
+                </div>
+              </div>
+            </div>
+          </div>
+          <empty-content v-else icon="earth" :inline="true">
+            {{ t("No location yet") }}
+          </empty-content></template
+        >
+        <template #create>
+          <o-button
+            v-if="physicalAddress && physicalAddress.geom"
+            variant="text"
+            @click="showMap = !showMap"
+            @keyup.enter="showMap = !showMap"
+          >
+            {{ t("Show map") }}
+          </o-button>
+          <o-button
+            v-if="isCurrentActorAGroupAdmin && !previewPublic"
+            tag="router-link"
+            :to="{
+              name: RouteName.GROUP_PUBLIC_SETTINGS,
+              params: { preferredUsername: usernameWithDomain(group) },
+            }"
+            class="button is-primary"
+            >{{ t("Edit") }}</o-button
+          >
+        </template>
+      </group-section>
+    </div>
     <div v-if="group">
       <div class="grid grid-cols-1 md:grid-cols-2 gap-2 mb-2">
-        <!-- Private thing: Group discussions -->
-        <Discussions
-          v-if="isCurrentActorAGroupMember && !previewPublic"
-          :group="discussionGroup ?? group"
-        />
-        <!-- Private thing: Resources -->
-        <Resources
-          v-if="isCurrentActorAGroupMember && !previewPublic"
-          :group="resourcesGroup ?? group"
-        />
         <!-- Public thing: Events -->
         <Events
           :group="group"
@@ -396,153 +533,16 @@
           :isModerator="isCurrentActorAGroupModerator && !previewPublic"
           :isMember="isCurrentActorAGroupMember && !previewPublic"
         />
-      </div>
-      <div class="grid grid-cols-1 md:grid-cols-3 gap-2">
-        <!-- Public thing: Members -->
-        <group-section :title="t('Members')" icon="account-group">
-          <template #default>
-            <div class="flex flex-col justify-center h-full">
-              <div
-                class="flex flex-col items-center"
-                v-if="isCurrentActorAGroupMember && !previewPublic && members"
-              >
-                <div class="flex">
-                  <figure
-                    :title="
-                      t(`{'@'}{username} ({role})`, {
-                        username: usernameWithDomain(member.actor),
-                        role: member.role,
-                      })
-                    "
-                    v-for="member in members.elements"
-                    :key="member.actor.id"
-                    class="-mr-3"
-                  >
-                    <img
-                      class="rounded-full h-8"
-                      :src="member.actor.avatar.url"
-                      v-if="member.actor.avatar"
-                      alt=""
-                      width="32"
-                      height="32"
-                    />
-                    <AccountCircle v-else :size="32" />
-                  </figure>
-                </div>
-              </div>
-              <div class="">
-                <h2 class="text-center">
-                  {{
-                    t(
-                      "{count} members",
-                      {
-                        count: group.members?.total,
-                      },
-                      group.members?.total
-                    )
-                  }}
-                </h2>
-              </div>
-            </div></template
-          >
-          <template #create>
-            <o-button
-              v-if="isCurrentActorAGroupAdmin && !previewPublic"
-              tag="router-link"
-              :to="{
-                name: RouteName.GROUP_MEMBERS_SETTINGS,
-                params: { preferredUsername: usernameWithDomain(group) },
-              }"
-              class="button is-primary"
-              >{{ t("Add / Remove…") }}</o-button
-            >
-          </template>
-        </group-section>
-        <!-- Public thing: About -->
-        <group-section :title="t('About')" icon="information">
-          <template #default>
-            <div
-              v-if="group.summary"
-              dir="auto"
-              class="prose lg:prose-xl dark:prose-invert p-2"
-              v-html="group.summary"
-            ></div>
-            <empty-content v-else icon="information" :inline="true">
-              {{ t("No about content yet") }}
-            </empty-content>
-          </template>
-          <template #create>
-            <o-button
-              v-if="isCurrentActorAGroupAdmin && !previewPublic"
-              tag="router-link"
-              :to="{
-                name: RouteName.GROUP_PUBLIC_SETTINGS,
-                params: { preferredUsername: usernameWithDomain(group) },
-              }"
-              class="button is-primary"
-              >{{ t("Edit") }}</o-button
-            >
-          </template>
-        </group-section>
-        <!-- Public thing: Location -->
-        <group-section :title="t('Location')" icon="earth">
-          <template #default
-            ><div
-              class="flex flex-col justify-center h-full"
-              v-if="physicalAddress && physicalAddress.url"
-            >
-              <o-icon
-                v-if="physicalAddress.poiInfos.poiIcon.icon"
-                :icon="physicalAddress.poiInfos.poiIcon.icon"
-                customSize="48"
-              />
-              <Earth v-else :size="48" />
-              <div class="address-wrapper">
-                <div class="address">
-                  <div class="text-center">
-                    <span v-if="!addressFullName(physicalAddress)">{{
-                      t("No address defined")
-                    }}</span>
-                    <address dir="auto">
-                      <p
-                        class="addressDescription"
-                        :title="physicalAddress.poiInfos.name"
-                      >
-                        {{ physicalAddress.poiInfos.name }}
-                      </p>
-                      <p class="has-text-grey-dark">
-                        {{ physicalAddress.poiInfos.alternativeName }}
-                      </p>
-                    </address>
-                  </div>
-                </div>
-              </div>
-            </div>
-            <empty-content v-else icon="earth" :inline="true">
-              {{ t("No location yet") }}
-            </empty-content></template
-          >
-          <template #create>
-            <o-button
-              v-if="physicalAddress && physicalAddress.geom"
-              variant="text"
-              @click="showMap = !showMap"
-              @keyup.enter="showMap = !showMap"
-            >
-              {{ t("Show map") }}
-            </o-button>
-            <o-button
-              v-if="isCurrentActorAGroupAdmin && !previewPublic"
-              tag="router-link"
-              :to="{
-                name: RouteName.GROUP_PUBLIC_SETTINGS,
-                params: { preferredUsername: usernameWithDomain(group) },
-              }"
-              class="button is-primary"
-              >{{ t("Edit") }}</o-button
-            >
-          </template>
-        </group-section>
+        <!-- Private thing: Group discussions -->
+        <Discussions
+          v-if="isCurrentActorAGroupMember && !previewPublic"
+          :group="discussionGroup ?? group"
+        />
+        <!-- Private thing: Resources -->
+        <Resources
+          v-if="isCurrentActorAGroupMember && !previewPublic"
+          :group="resourcesGroup ?? group"
+        />
       </div>
     </div>
     <div class="my-2">