Merge remote-tracking branch 'origin/main'

src/components/Local/CloseContent.vue

@@ -19,34 +19,16 @@
       </div>
       <slot name="subtitle" />
     </div>
-    <!-- <div class="hidden sm:block" v-show="showScrollLeftButton">
-      <button
-        @click="scrollLeft"
-        class="absolute inset-y-0 my-auto z-10 rounded-full bg-white dark:bg-transparent w-10 h-10 border border-shadowColor -left-5 ml-2"
-      >
-        <span class="">&lt;</span>
-      </button>
-    </div> -->
-    <div class="overflow-hidden">
-      <div
-        class="multi-card-event"
-      >
-        <slot name="content" />
-      </div>
+
+    <div
+      class="grid auto-rows-[1fr] gap-x-2 gap-y-2 grid-cols-[repeat(auto-fill,_minmax(250px,_1fr))] justify-items-center"
+    >
+      <slot name="content" />
     </div>
-    <!-- <div class="hidden sm:block" v-show="showScrollRightButton">
-      <button
-        @click="scrollRight"
-        class="absolute inset-y-0 my-auto z-10 rounded-full bg-white dark:bg-transparent w-10 h-10 border border-shadowColor -right-5 mr-2"
-      >
-        <span class="">&gt;</span>
-      </button>
-    </div> -->
   </div>
 </template>
 
 <script lang="ts" setup>
-import { onMounted, onUnmounted, ref } from "vue";
 import { useI18n } from "vue-i18n";
 
 withDefaults(
@@ -60,55 +42,6 @@ withDefaults(
 const emit = defineEmits(["doGeoLoc"]);
 
 const { t } = useI18n({ useScope: "global" });
-
-// const showScrollRightButton = ref(true);
-// const showScrollLeftButton = ref(false);
-
-// const scrollContainer = ref<any>();
-
-// const scrollHandler = () => {
-//   if (scrollContainer.value) {
-//     showScrollRightButton.value =
-//       scrollContainer.value.scrollLeft <
-//       scrollContainer.value.scrollWidth - scrollContainer.value.clientWidth;
-//     showScrollLeftButton.value = scrollContainer.value.scrollLeft > 0;
-//   }
-// };
-
-// const doScroll = (e: Event, left: number) => {
-//   e.preventDefault();
-//   if (scrollContainer.value) {
-//     scrollContainer.value.scrollBy({
-//       left,
-//       behavior: "smooth",
-//     });
-//   }
-// };
-
-// const scrollLeft = (e: Event) => {
-//   doScroll(e, -300);
-// };
-
-// const scrollRight = (e: Event) => {
-//   doScroll(e, 300);
-// };
-
-// const scrollHorizontalToVertical = (evt: WheelEvent) => {
-//   evt.deltaY > 0 ? doScroll(evt, 300) : doScroll(evt, -300);
-// };
-
-// onMounted(async () => {
-//   scrollContainer.value.addEventListener("wheel", scrollHorizontalToVertical);
-// });
-
-// onUnmounted(() => {
-//   if (scrollContainer.value) {
-//     scrollContainer.value.removeEventListener(
-//       "wheel",
-//       scrollHorizontalToVertical
-//     );
-//   }
-// });
 </script>
 
 <style lang="scss" scoped>

src/components/Local/CloseEvents.vue

@@ -7,13 +7,13 @@
     <template #title>
       <template v-if="userLocation?.name">
         {{
-          t("Incoming events and activities nearby {position}", {
+          t("Incoming events nearby {position}", {
             position: userLocation?.name,
           })
         }}
       </template>
       <template v-else>
-        {{ t("Incoming events and activities") }}
+        {{ t("Incoming events") }}
       </template>
     </template>
     <template #subtitle>
@@ -124,6 +124,7 @@ const eventsQuery = useQuery<{
   longevents: false,
   location: geoHash.value,
   radius: distance.value,
+  limit: 93,
 }));
 
 const events = computed(

src/views/HomeView.vue

@@ -122,8 +122,6 @@
     :userLocation="userLocation"
     :doingGeoloc="doingGeoloc"
   />
-  <CloseGroups :userLocation="userLocation" @doGeoLoc="performGeoLocation()" />
-  <OnlineEvents />
 </template>
 
 <script lang="ts" setup>
@@ -139,10 +137,6 @@ import RouteName from "../router/name";
 import { IEvent } from "../types/event.model";
 // import { IFollowedGroupEvent } from "../types/followedGroupEvent.model";
 import CloseEvents from "@/components/Local/CloseEvents.vue";
-import CloseGroups from "@/components/Local/CloseGroups.vue";
-// import LastEvents from "@/components/Local/LastEvents.vue";
-import UpcomingEvents from "@/components/Local/UpcomingEvents.vue";
-import OnlineEvents from "@/components/Local/OnlineEvents.vue";
 import {
   computed,
   onMounted,
@@ -316,7 +310,7 @@ const filteredFollowedGroupsEvents = computed<IEvent[]>(() => {
           .map(({ event: { id: event_id } }) => event_id)
           .includes(id)
     )
-    .slice(0, 4);
+    .slice(0, 93);
 });
 
 const welcomeBack = ref(false);