From a4fafc180ee243e82c1a26a51090f812443b9531 Mon Sep 17 00:00:00 2001
From: lesion <lesion@autistici.org>
Date: Sun, 8 Sep 2024 23:05:29 +0200
Subject: [PATCH] WIP: keep going rewriting gancio in nuxt3

---
 components/Admin/Settings.vue        |  18 ++
 components/Admin/SetupAlert.vue      |  18 ++
 components/Core/AppBar.vue           |  58 +++++
 components/Core/Footer.vue           |  42 ++++
 components/Core/Img.vue              |  97 ++++++++
 components/Event.vue                 |  16 +-
 components/Event/Detail.vue          |  70 ++++++
 components/NavBar.vue                |  16 ++
 components/NavHeader.vue             |  87 +++++++
 components/NavSearch.vue             |  68 ++++++
 composables/useAuth.ts               |  90 +++++++
 composables/useSettings.ts           |  19 ++
 layouts/default.vue                  |  10 +-
 pages/Login.vue                      |   4 +-
 pages/about.vue                      |   8 +
 pages/admin/index.vue                |  26 ++
 pages/collection/[name].vue          |  22 ++
 pages/event/[slug].vue               | 350 ++++++++++++++++++++++++++-
 pages/index.vue                      |  10 +-
 pages/place/[place].vue              |  92 +++++++
 plugins/formatter.ts                 |  14 ++
 plugins/validators.ts                |   2 -
 server/api/ap_users/trusted.get.ts   |   5 +
 server/api/collections/[name].get.ts |   5 +
 server/api/collections/home.get.ts   |   3 +
 server/api/events/[slug].get.ts      |   4 +-
 server/api/events/index.get.ts       |   4 +-
 server/api/place/[place].ts          |   8 +
 server/api/settings/[key].get.ts     |   3 +
 server/api/settings/index.put.ts     |   3 +
 server/api/settings/index.ts         |   3 +
 server/api/tag/[tag].ts              |   6 +
 server/api/utils/ping.ts             |   1 +
 server/api/utils/reachable.ts        |  13 +
 server/models/ap_user.js             |  15 --
 server/models/collection.js          |  20 --
 server/models/event.js               | 102 --------
 server/models/eventnotification.js   |  18 --
 server/models/filter.js              |  26 --
 server/models/index.js               | 180 --------------
 server/models/instance.js            |  12 -
 server/models/message.js             |  27 ---
 server/models/models.js              |  21 --
 server/models/notification.js        |  22 --
 server/models/oauth_client.js        |  13 -
 server/models/oauth_code.js          |  10 -
 server/models/oauth_token.js         |  22 --
 server/models/place.js               |  12 -
 server/models/resource.js            |  10 -
 server/models/setting.js             |  11 -
 server/models/tag.js                 |   9 -
 server/models/user.js                |  65 -----
 server/routes/headerimage.png.ts     |   1 +
 server/utils/collections.ts          |  25 ++
 server/utils/events.ts               |  24 ++
 server/utils/place.ts                |  14 ++
 server/utils/sequelize.ts            | 138 ++++++++++-
 server/utils/tag.ts                  |  11 +
 58 files changed, 1376 insertions(+), 627 deletions(-)
 create mode 100644 components/Admin/Settings.vue
 create mode 100644 components/Admin/SetupAlert.vue
 create mode 100644 components/Core/AppBar.vue
 create mode 100644 components/Core/Footer.vue
 create mode 100644 components/Core/Img.vue
 create mode 100644 components/Event/Detail.vue
 create mode 100644 components/NavBar.vue
 create mode 100644 components/NavHeader.vue
 create mode 100644 components/NavSearch.vue
 create mode 100644 composables/useAuth.ts
 create mode 100644 composables/useSettings.ts
 create mode 100644 pages/about.vue
 create mode 100644 pages/admin/index.vue
 create mode 100644 pages/collection/[name].vue
 create mode 100644 pages/place/[place].vue
 create mode 100644 plugins/formatter.ts
 create mode 100644 server/api/ap_users/trusted.get.ts
 create mode 100644 server/api/collections/[name].get.ts
 create mode 100644 server/api/collections/home.get.ts
 create mode 100644 server/api/place/[place].ts
 create mode 100644 server/api/settings/[key].get.ts
 create mode 100644 server/api/settings/index.put.ts
 create mode 100644 server/api/settings/index.ts
 create mode 100644 server/api/tag/[tag].ts
 create mode 100644 server/api/utils/ping.ts
 create mode 100644 server/api/utils/reachable.ts
 delete mode 100644 server/models/ap_user.js
 delete mode 100644 server/models/collection.js
 delete mode 100644 server/models/event.js
 delete mode 100644 server/models/eventnotification.js
 delete mode 100644 server/models/filter.js
 delete mode 100644 server/models/index.js
 delete mode 100644 server/models/instance.js
 delete mode 100644 server/models/message.js
 delete mode 100644 server/models/models.js
 delete mode 100644 server/models/notification.js
 delete mode 100644 server/models/oauth_client.js
 delete mode 100644 server/models/oauth_code.js
 delete mode 100644 server/models/oauth_token.js
 delete mode 100644 server/models/place.js
 delete mode 100644 server/models/resource.js
 delete mode 100644 server/models/setting.js
 delete mode 100644 server/models/tag.js
 delete mode 100644 server/models/user.js
 create mode 100644 server/routes/headerimage.png.ts
 create mode 100644 server/utils/collections.ts
 create mode 100644 server/utils/events.ts
 create mode 100644 server/utils/place.ts
 create mode 100644 server/utils/tag.ts

diff --git a/components/Admin/Settings.vue b/components/Admin/Settings.vue
new file mode 100644
index 00000000..1cb9cbcc
--- /dev/null
+++ b/components/Admin/Settings.vue
@@ -0,0 +1,18 @@
+<script setup lang="ts">
+const { Settings } = useSettings()
+function getSetting(key: string) {
+    return Setting[key]
+}
+
+
+</script>
+<template>
+    <v-container>
+        <v-card-title>{{ $t('common.settings') }}</v-card-title>
+        <v-card-text>
+            <v-text-field :modelValue="getSetting('title')"
+                @update:model-value="v => setSetting('title')"
+                :hint="$t('admin.title_description')" persistent-hint />
+        </v-card-text>
+    </v-container>
+</template>
\ No newline at end of file
diff --git a/components/Admin/SetupAlert.vue b/components/Admin/SetupAlert.vue
new file mode 100644
index 00000000..81370083
--- /dev/null
+++ b/components/Admin/SetupAlert.vue
@@ -0,0 +1,18 @@
+<script setup lang="ts">
+const { Settings } = useSettings()
+const route = useRoute()
+
+const url = useRequestURL()
+const URL = `${url.protocol}://${url.host}`
+
+const selfReachable = await useFetch('/api/reachable')
+
+</script>
+<template>
+    <v-alert v-if='URL!==Settings.baseurl' rounded="0" flat type='warning' show-icon icon='mdi-alert'>
+        <span v-html="$t('admin.wrong_domain_warning', { URL, baseurl: Settings.baseurl })" />
+    </v-alert>
+    <v-alert v-if='!selfReachable' rounded="0" flat type='warning' show-icon icon='mdi-alert'>
+        <span v-html="$t('admin.not_reachable_warning', { baseurl: Settings.baseurl })" />
+    </v-alert>
+</template>
\ No newline at end of file
diff --git a/components/Core/AppBar.vue b/components/Core/AppBar.vue
new file mode 100644
index 00000000..48e7481c
--- /dev/null
+++ b/components/Core/AppBar.vue
@@ -0,0 +1,58 @@
+<script setup lang="ts">
+const { Settings } = useSettings()
+const route = useRoute()
+</script>
+<template>
+    <nav>
+      <NavHeader />
+  
+      <!-- title -->
+      <div class="text-center">
+        <nuxt-link id="title" v-text="Settings.title" to="/" />
+        <div
+          class="text-body-1 font-weight-light pb-3"
+          v-text="Settings?.description" />
+      </div>
+  
+      <NavSearch />
+      <NavBar /> 
+      <!-- v-if="!['event-slug','e-slug'].includes(route?.name ?? '')"/> -->
+    </nav>
+  </template>
+  <!-- <script>
+  import { mapState } from 'vuex'
+  import NavHeader from './NavHeader.vue'
+  import NavBar from './NavBar.vue'
+  import NavSearch from './NavSearch.vue'
+  
+  export default {
+    name: 'Appbar',
+    components: { NavHeader, NavBar, NavSearch },
+    computed: mapState(['settings']),
+  }
+  </script> -->
+  <style>
+  nav {
+    background-image: linear-gradient(rgba(0, 0, 0, 0.8), rgba(20, 20, 20, 0.7)),
+      url(/headerimage.png);
+    background-position: center center;
+    background-size: cover;
+  }
+  
+  .theme--light nav {
+    background-image: linear-gradient(
+        to bottom,
+        rgba(230, 230, 230, 0.95),
+        rgba(250, 250, 250, 0.95)
+      ),
+      url(/headerimage.png);
+  }
+  
+  #title {
+    word-break: break-all;
+    font-size: 2rem;
+    font-weight: 600;
+    text-decoration: none;
+  }
+  </style>
+  
\ No newline at end of file
diff --git a/components/Core/Footer.vue b/components/Core/Footer.vue
new file mode 100644
index 00000000..b19b0c33
--- /dev/null
+++ b/components/Core/Footer.vue
@@ -0,0 +1,42 @@
+<script setup lang="ts">
+import type { APUser } from '~/server/utils/sequelize'
+
+const { Settings } = useSettings()
+
+const showFollowMe = ref(false)
+
+const { data: trusted_instances } = await useFetch<APUser[]>('/api/ap_users/trusted')
+const { data: footerLinks } = await useFetch('/api/settings/footerLinks')
+
+</script>
+<template>
+    <v-footer id='footer' aria-label='Footer'>
+        <v-dialog >v-model='showFollowMe' destroy-on-close max-width='700px' :fullscreen='$vuetify.breakpoint.xsOnly'>
+            <!-- <FollowMe @close='showFollowMe=false' is-dialog /> -->
+        </v-dialog>
+       
+        <v-btn v-for="link in footerLinks" :key="link?.label" color="primary" flat class="ml1"
+            :href="link?.href" :to="link?.to" :target="link?.href && '_blank'">{{ link?.label }}</v-btn>
+
+
+        <v-menu v-if="Settings.enable_trusted_instances && trusted_instances?.length"
+            offset="left bottom" open-on-hover transition="slide-y-transition">
+            <template v-slot:activator="{ props }">
+                <v-btn class="ml-1" v-bind="props" color="primary" flat>{{ Settings.trusted_instances_label || $t('admin.trusted_instances_label_default') }}</v-btn>
+            </template>
+            <v-list lines="two" max-width="550">
+                <v-list-item lines="two" v-for='instance in trusted_instances' :key="instance.ap_id" target="_blank" :href="instance?.object.url ?? instance?.ap_id">
+                    <v-avatar>
+                        <v-img :src="instance.object?.icon.url" />
+                    </v-avatar>
+                    <v-list-item-title>{{ instance?.object?.name ?? instance?.object?.preferredUsername }}</v-list-item-title>
+                    <v-list-item-subtitle>{{ instance?.object?.summary }}</v-list-item-subtitle>
+                </v-list-item>
+            </v-list>
+        </v-menu>
+
+        <v-btn class="ml-1" v-if="Settings.enable_federation" color="primary" flat rel="me" @click.prevent="showFollowMe=true">{{ $t('event.interact_with_me') }}</v-btn>
+        <v-spacer />
+        <v-btn color="primary" flat href="https://gancio.org" target="_blank" rel="noopener"> Gancio <small>{{ Settings.version }}</small></v-btn>
+    </v-footer>
+</template>
\ No newline at end of file
diff --git a/components/Core/Img.vue b/components/Core/Img.vue
new file mode 100644
index 00000000..14d6be29
--- /dev/null
+++ b/components/Core/Img.vue
@@ -0,0 +1,97 @@
+<template>
+    <div :class='{ img: true, thumb }'>
+      <img 
+        v-if='media' 
+        :class='{ "u-featured": true }'
+        :alt='media.name' :loading='lazy?"lazy":"eager"'
+        :src="src"
+        :srcset="srcset"
+        itemprop="image"
+        :height="height" :width="width"
+        :style="{ 'object-position': thumbnailPosition }">
+  
+      <!-- <img v-else-if='!media && thumb' class='thumb' src="/fallbackimage.png" alt=''> -->
+    </div>
+  </template>
+  <script>
+  
+  export default {
+    props: {
+      event:  { type: Object, default: () => ({}) },
+      thumb: { type: Boolean, default: false },
+      lazy: { type: Boolean, default: false },
+      showPreview: { type: Boolean, default: true }
+    },
+    computed: {
+      backgroundPreview () {
+        if (this.media && this.media.preview) {
+          return {
+            backgroundPosition: this.thumbnailPosition,
+            backgroundImage: "url('data:image/png;base64," + this.media.preview + "')" }
+        }
+      },
+      srcset () {
+        if (this.thumb) return ''
+        return `/media/thumb/${this.media.url} 500w, /media/${this.media.url} 1200w`
+      },
+      media () {
+        return this.event.media && this.event.media[0]
+      },
+      height () {
+        return this.media ? this.media.height : 'auto'
+      },
+      width () {
+        return this.media ? this.media.width : 'auto'
+      },
+      src () {
+        if (this.media) {
+          return '/media/thumb/' + this.media.url
+        }
+        if (this.thumb) {
+          return '/noimg.svg'
+        }
+      },
+      thumbnailPosition () {
+        if (this.media.focalpoint) {
+          const focalpoint = this.media.focalpoint
+          return `${(focalpoint[0] + 1) * 50}% ${(focalpoint[1] + 1) * 50}%`
+        }
+        return 'center center'
+      },
+    }
+  }
+  </script>
+  <style>
+  
+  .img {
+    width: 100%;
+    height: auto;
+    position: relative;
+    overflow: hidden;
+    display: flex;
+    background-size: contain;
+  }
+  
+  .img img {
+    object-fit: contain;
+    max-height: 125vh;
+    display: flex;
+    width: 100%;
+    max-width: 100%;
+    height: auto;
+    overflow: hidden;
+    transition: opacity .5s;
+    opacity: 1;
+    background-size: 100%;
+  }
+  
+  .img.thumb img {
+    display: flex;
+    max-height: 250px;
+    min-height: 160px;
+    object-fit: cover;
+    object-position: top;
+    aspect-ratio: 1.7778;
+  }
+  
+  </style>
\ No newline at end of file
diff --git a/components/Event.vue b/components/Event.vue
index a72019a0..529c274b 100644
--- a/components/Event.vue
+++ b/components/Event.vue
@@ -1,15 +1,17 @@
 <template>
     <article class='h-event' itemscope itemtype="https://schema.org/Event">
         <nuxt-link :to='`/event/${event.slug || event.id}`' itemprop="url">
-            <!-- <MyPicture v-if='!hide_thumbs' :event='event' thumb :lazy='lazy' /> -->
-            <v-icon class='float-right mr-1' v-if='event.parentId' color='success' icon='mdi-repeat' />
+            <!-- <nuxt-picture/> -->
+             
+            <CoreImg v-if='!hide_thumbs' :event='event' thumb :lazy='lazy' />
+            <!-- <v-icon class='float-right mr-1' v-if='event.parentId' color='success' icon='mdi-repeat' /> -->
             <h1 class='title p-name' itemprop="name">{{ event.title }}</h1>
         </nuxt-link>
         
-        <v-img contain v-if='event?.ap_user?.image' :src='event?.ap_user?.image' max-height=30  max-width=30 style="position: absolute; top: 5px; right: 5px;" />
+        <!-- <v-img contain v-if='event?.ap_user?.image' :src='event?.ap_user?.image' max-height=30  max-width=30 style="position: absolute; top: 5px; right: 5px;" /> -->
         
         <v-card-text class='body pt-0 pb-0'>
-            
+            <time class="dt-start subtitle-1" :datetime="$formatter.time(event)" itemprop="startDate" :content="$formatter.timeToISO(event.start_datetime)">{{$formatter.time(event.start_datetime)}}</time>
             <!-- <time class='dt-start subtitle-1' :datetime='$time.unixFormat(event.start_datetime, "yyyy-MM-dd HH:mm")'
                 itemprop="startDate" :content="$time.unixFormat(event.start_datetime, 'yyyy-MM-dd\'T\'HH:mm')"> <v-icon v-text='mdiCalendar' /> {{ $time.when(event) }}
             </time>
@@ -20,7 +22,7 @@
                 :to='`/place/${encodeURIComponent(event.place.name)}`'
                 itemprop="location" itemscope itemtype="https://schema.org/Place">
                 <v-icon icon="mdi-map-marker"/>
-                <span itemprop='name'>{{ event.place.name }}</span>
+                <span itemprop='name'>ciao {{ event.place.name }}</span>
             </nuxt-link>
             <div class='d-none' itemprop='address'>{{ event.place.address }}</div>
     
@@ -35,10 +37,10 @@
 </template>
 <script setup lang="ts">
 
-// TODO: hide thumbs
 defineProps({
     event: { type: Object, default: () => ({})},
-    lazy: { type: Boolean, default: false }
+    lazy: { type: Boolean, default: false },
+    hide_thumbs: { type: Boolean, default: false }
 })
 
 </script>
diff --git a/components/Event/Detail.vue b/components/Event/Detail.vue
new file mode 100644
index 00000000..a0b36873
--- /dev/null
+++ b/components/Event/Detail.vue
@@ -0,0 +1,70 @@
+<script setup lang="ts">
+defineProps({ event: { type: Object, default: () => ({})} })
+</script>
+<template>
+    <v-card outlined>
+        <v-container class="eventDetails">
+            <!-- v-icon.float-right(v-if='event.parentId' color='success' v-text='mdiRepeat') -->
+            <!-- <time datetime="" class="dt-start"></time> (:datetime='$time.unixFormat(event.start_datetime, "yyyy-MM-dd HH:mm")' itemprop="startDate" :content='$time.unixFormat(event.start_datetime, "yyyy-MM-dd\'T\'HH:mm")') -->
+            <span class="ml-2 text-uppercase">{{ $formatter.time(event.start_datetime) }}</span>
+
+            <div class="p-location h-adr" itemprop="location" itemscope itemtype="https://schema.org/Place">
+                <v-icon icon="mdi-calendar"/>
+                <nuxt-link class="vcard ml-2 p-name text-decoration-none text-uppercase" :to='`/place/${encodeURIComponent(event?.place?.name)}`'>
+                    <span itemprop='name'>{{event?.place?.name}}</span>
+                    <div class="font-weight-light p-street-address" v-if='event?.place?.name !=="online"' itemprop='address'>{{event?.place?.address}}</div>
+                    </nuxt-link>
+            </div>
+
+            <!-- //- tags, hashtags -->
+            <v-container class="pt-0" v-if='event?.tags?.length'>
+                <v-chip class="p-category ml-1 mt-1" v-for='tag in event.tags' small label color='primary' outlined :key='tag' :to='`/tag/${encodeURIComponent(tag)}`'>{{tag}}</v-chip>
+            </v-container>
+
+
+            <!-- online -->
+            <v-list nav density="compact">
+                <v-list-item v-for="(item, index) in event.online_locations" target="_blank" :href="item" :key="index">
+                    <v-list-item-icon><v-icon icon='mdi-monitor-account'/></v-list-item-icon>
+                    <!-- <v-list-item-content class="py-0"> -->
+                    <v-list-item-title class="text-caption" v-text="item" />
+                    <!-- </v-list-item-content> -->
+                </v-list-item>
+            </v-list>
+            <!-- v-list(nav dense v-if='hasOnlineLocations')
+v-list-item(v-for='(item, index) in event.online_locations' target='_blank' :href="`${item}`" :key="index")
+v-list-item-icon
+v-icon(v-text='mdiMonitorAccount')
+v-list-item-content.py-0
+v-list-item-title.text-caption(v-text='item') -->
+
+        </v-container>
+    </v-card>
+</template>
+    <!-- v-card(outlined)
+    v-icon(v-text='mdiCalendar' small)
+    .d-none.dt-end(v-if='event.end_datetime' itemprop="endDate" :content='$time.unixFormat(event.end_datetime,"yyyy-MM-dd\'T\'HH:mm")') {{$time.unixFormat(event.end_datetime,"yyyy-MM-dd'T'HH:mm")}}
+  div.font-weight-light.mb-3 {{$time.from(event.start_datetime)}}
+    small(v-if='event.parentId')  ({{$time.recurrentDetail(event)}})
+
+  .p-location.h-adr(itemprop="location" itemscope itemtype="https://schema.org/Place")
+    v-icon(v-text='mdiMapMarker' small)
+    nuxt-link.vcard.ml-2.p-name.text-decoration-none.text-uppercase(:to='`/place/${encodeURIComponent(event?.place?.name)}`') 
+      span(itemprop='name') {{event?.place?.name}}
+      .font-weight-light.p-street-address(v-if='event?.place?.name !=="online"' itemprop='address') {{event?.place?.address}}
+      
+      //- a.d-block(v-if='event.ap_object?.url' :href="event.ap_object?.url") {{ event.ap_object?.url }}
+      a(v-if='event?.original_url'  :href="event?.original_url") {{event.original_url}}
+
+//- tags, hashtags
+v-container.pt-0(v-if='event?.tags?.length')
+v-chip.p-category.ml-1.mt-1(v-for='tag in event.tags' small label color='primary'
+outlined :key='tag' :to='`/tag/${encodeURIComponent(tag)}`') {{tag}}
+
+//- online events
+v-list(nav dense v-if='hasOnlineLocations')
+v-list-item(v-for='(item, index) in event.online_locations' target='_blank' :href="`${item}`" :key="index")
+v-list-item-icon
+v-icon(v-text='mdiMonitorAccount')
+v-list-item-content.py-0
+v-list-item-title.text-caption(v-text='item') -->
diff --git a/components/NavBar.vue b/components/NavBar.vue
new file mode 100644
index 00000000..e69a883f
--- /dev/null
+++ b/components/NavBar.vue
@@ -0,0 +1,16 @@
+<script setup lang="ts">
+const { Settings } = useSettings()
+const { isLogged } = useAuth()
+</script>
+<template>
+    <v-tabs id='navbar' centered background-color='transparent' optional dense icons-and-text class='mt-4'>
+        <v-tab v-if='isLogged || Settings.allow_anon_event' to='/add' :ripple="false">
+            <span class='d-none d-sm-flex'>{{$t('common.add_event')}}</span>
+            <v-icon color='primary' icon='mdi-plus' />
+        </v-tab>
+        <v-tab to='/export' :ripple="false">
+            <span class='d-none d-sm-flex'>{{$t('common.share')}}</span>
+            <v-icon icon='mdi-share-variant' />
+        </v-tab>
+    </v-tabs>    
+</template>
diff --git a/components/NavHeader.vue b/components/NavHeader.vue
new file mode 100644
index 00000000..769d52a9
--- /dev/null
+++ b/components/NavHeader.vue
@@ -0,0 +1,87 @@
+<template>
+    <div class='d-flex pa-4'>
+        <v-btn icon large nuxt to='/'>
+            <!-- <img src='/logo.png' height='40' /> -->
+        </v-btn>
+        
+        <v-spacer/>
+        
+        <div class='d-flex'>
+            <v-btn icon large href='/about' :title='$t("common.about")' :aria-label='$t("common.about")'>
+                <v-icon icon='mdi-information' />
+            </v-btn>
+            <v-btn icon large @click='toggleDark'>
+                <v-icon icon='mdi-contrast-circle' />
+            </v-btn>
+            <client-only>
+                <v-menu offset-y transition="slide-y-transition">
+                    <template v-slot:activator="{ props }">
+                        <v-btn icon large v-bind='props' aria-label='Language' v-text="$i18n.locale" />
+                    </template>
+                    <v-list dense>
+                        <v-list-item v-for='locale in $i18n.locales' @click.prevent.stop="$i18n.setLocale(locale.code)" :key='locale.code'>
+                            <v-list-item-title v-text='locale.name' />
+                        </v-list-item>
+                        <v-list-item nuxt target='_blank' href='https://hosted.weblate.org/engage/gancio/'>
+                            <v-list-item-subtitle v-text='$t("common.help_translate")' />
+                        </v-list-item>
+                    </v-list>
+                </v-menu>
+                <v-btn slot='placeholder' large  icon arial-label='Language'>{{$i18n.locale}}</v-btn>
+            </client-only> 
+            
+            <client-only>
+                <v-menu v-if='$auth.loggedIn' offset-y transition="slide-y-transition">
+                    <template v-slot:activator="{ props }">
+                        <v-btn class='mr-0' large icon v-bind='props' title='Menu' aria-label='Menu'>
+                            <v-icon icon='mdi-dots-vertical' />
+                        </v-btn>
+                    </template>
+                    <v-list>
+                        <v-list-item nuxt to='/settings'>
+                            <template v-slot:prepend><v-icon icon='mdi-cog'></v-icon></template>
+                            <v-list-item-title v-text="$t('common.settings')"/>
+                        </v-list-item>
+                        
+                        <v-list-item nuxt to='/my_events'>
+                            <template v-slot:prepend><v-icon icon='mdi-calendar-account'></v-icon></template>
+                            <v-list-item-title v-text="$t('common.my_events')"/>
+                        </v-list-item>
+                        
+                        <v-list-item v-if='$auth.user.is_admin || $auth.user.is_editor' nuxt to='/admin'>
+                            <template v-slot:prepend><v-icon icon='mdi-account' /></template>
+                            <v-list-item-title v-text="$t(`common.${$auth.user.role}`)" />
+                        </v-list-item>
+                        
+                        <v-list-item @click='logout'>
+                            <template v-slot:prepend><v-icon icon='mdi-logout' /></template>
+                            <v-list-item-title v-text="$t('common.logout')" />
+                        </v-list-item>
+                    </v-list>
+                </v-menu>
+                <template #placeholder>
+                    <v-btn v-if='$auth.loggedIn' large icon aria-label='Menu' title='Menu'>
+                        <v-icon icon='mdi-dots-vertical' />
+                    </v-btn>
+                </template>
+            </client-only>
+            
+            <!-- login button -->
+            <v-btn class='mr-0' v-if='!$auth.loggedIn' large icon nuxt  to='/login' :title='$t("common.login")' :aria-label='$t("common.login")'>
+                <v-icon icon='mdi-login' />
+            </v-btn>
+        </div>
+    </div>
+</template>
+<script setup lang="ts">
+const $i18n = { locale: 'it', locales: ['it'] }
+const $auth = { loggedIn: true, user: { is_admin: true, role: 'admin', is_editor: true } }
+
+function logout () {
+    
+}
+
+function toggleDark () {
+    
+}
+</script>
\ No newline at end of file
diff --git a/components/NavSearch.vue b/components/NavSearch.vue
new file mode 100644
index 00000000..1e28ea9f
--- /dev/null
+++ b/components/NavSearch.vue
@@ -0,0 +1,68 @@
+<script setup lang="ts">
+import type { Collection } from '#build/types/nitro-imports';
+
+const { Settings } = useSettings()
+
+const route = useRoute()
+
+const show_recurrent = ref()
+const query = ref()
+
+const show_calendar = computed(() => !Settings.value.show_calendar && ['index'].includes(route.name))
+const show_search_bar = computed(() => ['index'].includes(route.name))
+
+const { data: collections } = await useFetch<Collection[]>('/api/collections/home')
+
+const show_collections_bar = true  // TODO
+
+function setFilter (query: string) { 
+    console.error('set filter', query)
+}
+</script>
+
+<template>
+    <div id="navsearch" class="mt-2 mt-sm-4" v-if='show_collections_bar || show_search_bar || show_calendar'>
+        <div class="mx-2">
+            <v-menu v-if='show_search_bar' offset="y" :close-on-content-click="false" tile>
+                <template v-slot:activator="{ props }">
+                    <v-text-field hide-details variant="outlined" v-model="query" :placeholder="$t('common.search')" @click:clear="setFilter(['query', null])"
+                        @keypress:enter="setFilter(['query', query])" clearable>
+                        <template v-slot:append>
+                            <v-icon class="mr-2" v-if="query" icon="mdi-magnify" @click="setFilter(['query', query])"/>
+                            <v-icon v-if='Settings.allow_recurrent_event || Settings.allow_multidate_event' icon='mdi-cog' v-bind='props' />
+                        </template>
+                    </v-text-field>
+                </template>
+                <v-card>
+                <v-card-text>
+                    <v-row dense>
+                        <v-col v-if="Settings.allow_recurrent_event">
+                            <v-switch class="mt-0" v-model="show_recurrent" @change="v => setFilter(['show_recurrent', v])"
+                                hide-details :label="$t('event.show_recurrent')" inset />
+                            </v-col>
+                        </v-row>
+                        <v-row v-if="show_calendar">
+                            <v-col>
+                                <!-- Calendar -->
+                            </v-col>
+                        </v-row>
+                    </v-card-text>
+                </v-card>
+            </v-menu>
+            <span v-if="show_collections_bar">
+                <v-btn class="mr-2 mt-2" small variant="outlined" v-for="collection in collections" color="primary" :key="collection.id"
+                :to="`/collection/${encodeURIComponent(collection.name)}`">{{ collection.name }}</v-btn>
+            </span>
+            
+            <!-- Calendar -->
+            
+        </div>
+    </div> 
+</template>
+
+<style>
+#navsearch {
+margin: 0 auto;
+max-width: 700px;
+}
+</style>
\ No newline at end of file
diff --git a/composables/useAuth.ts b/composables/useAuth.ts
new file mode 100644
index 00000000..e1ab132a
--- /dev/null
+++ b/composables/useAuth.ts
@@ -0,0 +1,90 @@
+import type { User } from "#build/types/nitro-imports"
+
+export default () => {
+    const authUser = useState<User | null>('auth_user', () => null)
+    const authLoading = useState('auth_loading', () => true)
+    
+    const isLogged = computed(() => !!authUser.value?.id )
+  
+    const isAdmin = computed(() => !!(authUser.value?.role === 'admin'))
+  
+    async function login (username: string, password: string) {
+      authLoading.value = true
+  
+      try {
+  
+        const data = await $fetch<User>('/api/auth/login', {
+          method: 'POST',
+          body: {
+            username,
+            password
+          }
+        })
+        
+        authUser.value = data
+  
+      } finally {
+        authLoading.value = false
+      }
+    }
+    
+  
+    async function refreshToken () {
+      try {
+        await $fetch('/api/auth/refresh')
+      } catch (e) {
+        console.error('Error', e)
+        authUser.value = null
+      }
+    }
+  
+    async function getUser (token: string) {
+      const data = await $fetch<User>('/api/auth/user', { headers: {
+        cookie: `access_token=${token};`
+      } }).catch()
+      authUser.value = data
+    }
+  
+    // const reRefreshAccessToken = () => {
+    //   const authToken = useAuthToken()
+      
+    //   if (!authToken.value) {
+    //     return
+    //   }
+      
+    //   const jwt = jwt_decode(authToken.value)
+      
+    //   const newRefreshTime = jwt.exp - 60000
+      
+    //   setTimeout(async () => {
+    //     await refreshToken()
+    //     reRefreshAccessToken()
+    //   }, newRefreshTime);
+    // }
+    
+    async function initAuth () {
+      authLoading.value = true
+      try {
+        await refreshToken()
+        // await getUser()
+      } finally {
+        authLoading.value = false
+      }
+    }
+    
+    async function logout () {
+      await $fetch('/api/auth/logout', { method: 'POST' })
+      authUser.value = null
+    }
+  
+    return {
+      login,
+      logout,
+      authUser,
+      getUser,
+      authLoading,
+      isLogged,
+      isAdmin,
+      initAuth
+    }
+  }
\ No newline at end of file
diff --git a/composables/useSettings.ts b/composables/useSettings.ts
new file mode 100644
index 00000000..95ce870c
--- /dev/null
+++ b/composables/useSettings.ts
@@ -0,0 +1,19 @@
+export default () => {
+    type SettingsType =
+    | { [key: string]: string }
+
+    // const { data: Settings } = await useFetch('/api/setting')
+    const Settings = useState<SettingsType>('settings', () => reactive({ }))
+  
+    const loadSettings = async () => {
+      Settings.value = await $fetch('/api/settings')
+    }
+  
+    const saveSetting = async (key: string, value: string) => {
+      Settings.value[key] = value
+      await $fetch(`/api/setting`, { method: 'POST', body: { key, value } })
+    }
+  
+    return { Settings, saveSetting, loadSettings }
+  }
+  
\ No newline at end of file
diff --git a/layouts/default.vue b/layouts/default.vue
index c22799bb..e6e6c170 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -8,16 +8,16 @@ const config = useRuntimeConfig()
 </script>
 <template>
     <v-app>
+        <CoreAppBar />
         <!-- <CoreSideBar v-model="openSidebar" /> -->
         <!-- <CoreNavBar @toggleSidebar="openSidebar = !openSidebar" /> -->
-        <v-main class="bg-blue-grey-lighten-5" style="height:100vh;overflow:auto">
-            <v-container fluid class="pa-3" style="height:100%">
-                <slot />
-            </v-container>
+        <v-main>
+            <slot />
         </v-main>
         <!-- <CoreDialog /> -->
         <!-- <CoreNotification /> -->
-        <v-footer app height="40"><v-spacer />v.{{config.public.version}}</v-footer>
+         <CoreFooter />
+        <!-- <v-footer app height="40"><v-spacer />v.{{config.public.version}}</v-footer> -->
     </v-app>
 </template>
 
diff --git a/pages/Login.vue b/pages/Login.vue
index 6b2b85c7..9ede2ae6 100644
--- a/pages/Login.vue
+++ b/pages/Login.vue
@@ -41,8 +41,8 @@
     </v-container>
 </template>
     
-<script setup>
-const valid = ref('')
+<script setup lang="ts">
+const valid = ref(false)
 const email = ref('')
 const password = ref('')
 
diff --git a/pages/about.vue b/pages/about.vue
new file mode 100644
index 00000000..8e154921
--- /dev/null
+++ b/pages/about.vue
@@ -0,0 +1,8 @@
+<script setup lang="ts">
+const about = await useFetch('/api/settings/about')
+</script>
+<template>
+    <v-container>
+        <v-card-text v-html="about" />
+    </v-container>
+</template>
\ No newline at end of file
diff --git a/pages/admin/index.vue b/pages/admin/index.vue
new file mode 100644
index 00000000..d3bb9263
--- /dev/null
+++ b/pages/admin/index.vue
@@ -0,0 +1,26 @@
+<script setup lang="ts">
+const { isAdmin } = useAuth()
+const selectedTab = ref()
+</script>
+<template>
+    <v-container>
+        <v-card>
+
+            <!-- admin alert -->
+             <AdminSetupAlert v-if="isAdmin" />
+
+             <v-tabs v-model="selectedTab" show-arrows bg-color="primary">
+                <v-tab href="#settings" v-if="isAdmin" value="settings"> {{ $t('common.settings') }}</v-tab>
+             </v-tabs>
+
+
+             <v-card-text>
+                <v-tabs-window v-model="selectedTab">
+                    <v-tabs-window-item value="settings">
+                        <AdminSettings />
+                    </v-tabs-window-item>
+                </v-tabs-window>
+             </v-card-text>
+        </v-card>
+    </v-container>
+</template>
\ No newline at end of file
diff --git a/pages/collection/[name].vue b/pages/collection/[name].vue
new file mode 100644
index 00000000..66a317f0
--- /dev/null
+++ b/pages/collection/[name].vue
@@ -0,0 +1,22 @@
+<script setup lang="ts">
+import type { Event } from '#build/types/nitro-imports'
+
+const hide_thumbs = false
+
+const route = useRoute()
+const { data: events } = await useFetch<Event[]>(`/api/collections/${route.params.name}`) 
+
+</script>
+<template>
+  <v-container id='home' class='px-2 px-sm-6 pt-0' fluid>
+
+    <h1 class='d-block text-h3 font-weight-black text-center text-uppercase mt-10 mb-16 mx-auto w-100 text-underline'><u>{{route.params.name}}</u></h1>
+
+    <!-- Events -->
+    <div class="mb-2 mt-1 pl-1 pl-sm-2" id="events">
+      <v-lazy class='event v-card' :value='idx<9' v-for='(event, idx) in events' :key='event.id' :min-height='hide_thumbs ? 105 : undefined' :options="{ threshold: .5, rootMargin: '500px' }">
+        <Event :event='event' :lazy='idx>9' />
+      </v-lazy>
+    </div>
+  </v-container>
+</template>
\ No newline at end of file
diff --git a/pages/event/[slug].vue b/pages/event/[slug].vue
index 4b2c20a3..69b93555 100644
--- a/pages/event/[slug].vue
+++ b/pages/event/[slug].vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import type { Event } from '#build/types/nitro-imports'
+import type { Event } from '#build/types/nitro-imports';
 
 const route = useRoute()
 const { data: event } = await useFetch<Event>(`/api/events/${route.params.slug}`)
@@ -8,13 +8,355 @@ if (!event) {
     throw createError({ status: 404, statusMessage: 'Event not found'})
 }
 
+const hasMedia = computed(() => event?.media?.length )
+
 </script>
 <template>
-<v-container>
+<v-container id="event" class="h-event pa-2 pa-sm-2 pt-0 pt-sm-0 container" itemscope itemtype="https://schema.org/Event">
     <v-card>
-        <v-card-title>
+        <v-card-title class="strong p-name text--primary" itemprop="name">
             {{ event?.title }}
         </v-card-title>
+        <v-row>
+            <v-col class="col-12 col-md-8 pr-sm-2 pr-md-0">
+                <CoreImg v-if="hasMedia" :event="event" />
+                <div class="p-description text-body-1 pa-3 rounded" v-if="event?.description" itemprop="description" v-html="event.description"></div>
+            </v-col>
+            <v-col class="col-12 col-md-4">
+                <EventDetail :event="event" />
+            </v-col>
+        </v-row>
     </v-card>
 </v-container>
-</template>
\ No newline at end of file
+</template>
+
+
+<!-- <template lang="pug">
+    #event.h-event.pa-2.pa-sm-2.pt-0.pt-sm-0.container(v-touch="{ left: goNext, right: goPrev }" itemscope itemtype="https://schema.org/Event")
+        //- EVENT PAGE
+        //- gancio supports microformats (http://microformats.org/wiki/h-event)
+        //- and microdata https://schema.org/Event
+        .title.text-center.text-md-h4.text-h5.pa-6
+          strong.p-name.text--primary(itemprop="name") {{event.title}}
+        v-row
+          v-col.col-12.col-md-8.pr-sm-2.pr-md-0
+            MyPicture(v-if='hasMedia' :event='event')
+            .p-description.text-body-1.pa-3.rounded(v-if='event.description' itemprop='description' v-html='event.description')
+    
+          v-col.col-12.col-md-4
+            v-card(outlined)
+              v-container.eventDetails
+                v-icon.float-right(v-if='event.parentId' color='success' v-text='mdiRepeat')
+                time.dt-start(:datetime='$time.unixFormat(event.start_datetime, "yyyy-MM-dd HH:mm")' itemprop="startDate" :content='$time.unixFormat(event.start_datetime, "yyyy-MM-dd\'T\'HH:mm")')
+                  v-icon(v-text='mdiCalendar' small)
+                  span.ml-2.text-uppercase {{$time.when(event)}}
+                  .d-none.dt-end(v-if='event.end_datetime' itemprop="endDate" :content='$time.unixFormat(event.end_datetime,"yyyy-MM-dd\'T\'HH:mm")') {{$time.unixFormat(event.end_datetime,"yyyy-MM-dd'T'HH:mm")}}
+                div.font-weight-light.mb-3 {{$time.from(event.start_datetime)}}
+                  small(v-if='event.parentId')  ({{$time.recurrentDetail(event)}})
+    
+                .p-location.h-adr(itemprop="location" itemscope itemtype="https://schema.org/Place")
+                  v-icon(v-text='mdiMapMarker' small)
+                  nuxt-link.vcard.ml-2.p-name.text-decoration-none.text-uppercase(:to='`/place/${encodeURIComponent(event?.place?.name)}`') 
+                    span(itemprop='name') {{event?.place?.name}}
+                  .font-weight-light.p-street-address(v-if='event?.place?.name !=="online"' itemprop='address') {{event?.place?.address}}
+    
+                //- a.d-block(v-if='event.ap_object?.url' :href="event.ap_object?.url") {{ event.ap_object?.url }}
+                a(v-if='event?.original_url'  :href="event?.original_url") {{event.original_url}}
+    
+              //- tags, hashtags
+              v-container.pt-0(v-if='event?.tags?.length')
+                v-chip.p-category.ml-1.mt-1(v-for='tag in event.tags' small label color='primary'
+                  outlined :key='tag' :to='`/tag/${encodeURIComponent(tag)}`') {{tag}}
+    
+              //- online events
+              v-list(nav dense v-if='hasOnlineLocations')
+                v-list-item(v-for='(item, index) in event.online_locations' target='_blank' :href="`${item}`" :key="index")
+                  v-list-item-icon
+                    v-icon(v-text='mdiMonitorAccount')
+                  v-list-item-content.py-0
+                    v-list-item-title.text-caption(v-text='item')
+    
+              v-divider
+              //- info & actions
+              v-list(dense nav color='transparent')
+    
+                  //- copy link
+                  v-list-item(@click='clipboard(`${settings.baseurl}/event/${event.slug || event.id}`)')
+                    v-list-item-icon
+                      v-icon(v-text='mdiContentCopy')
+                    v-list-item-content
+                      v-list-item-title(v-text="$t('common.copy_link')")
+    
+                  //- map
+                  v-list-item(v-if='settings.allow_geolocation && event.place?.latitude && event.place?.longitude' @click="mapModal = true")
+                    v-list-item-icon
+                      v-icon(v-text='mdiMap')
+                    v-list-item-content
+                      v-list-item-title(v-text="$t('common.show_map')")
+    
+                  //- calendar
+                  v-list-item(:href='`/api/event/detail/${event.slug || event.id}.ics`')
+                    v-list-item-icon
+                      v-icon(v-text='mdiCalendarExport')
+                    v-list-item-content
+                      v-list-item-title(v-text="$t('common.add_to_calendar')")
+    
+                  //- Report
+                  v-list-item(v-if='settings.enable_moderation && settings.enable_report && !showModeration' @click='report')
+                    v-list-item-icon
+                      v-icon(v-text='mdiMessageTextOutline')
+                    v-list-item-content
+                      v-list-item-title(v-text="$t('common.report')")
+    
+                  //- download flyer
+                  v-list-item(v-if='hasMedia && settings.show_download_media' :href='$helper.mediaURL(event, "download")')
+                    v-list-item-icon
+                      v-icon(v-text='mdiFileDownloadOutline')
+                    v-list-item-content
+                      v-list-item-title(v-text="$t('event.download_flyer')")
+    
+                  //- embed
+                  v-list-item(@click='showEmbed=true')
+                    v-list-item-icon
+                      v-icon(v-text='mdiCodeTags')
+                    v-list-item-content
+                      v-list-item-title(v-text="$t('common.embed')")
+    
+    
+    
+              //- admin actions
+              template(v-if='can_edit')
+                EventAdmin(:event='event' @openModeration='openModeration=true' @openAssignAuthor='openAssignAuthor=true')
+    
+        //- resources from fediverse
+        EventResource#resources.mt-3(:event='event' v-if='showResources')
+    
+        //- Next/prev arrow
+        .text-center.mt-5.mb-5
+          v-btn.mr-2(nuxt icon outlined color='primary'
+            :to='`/event/${event.prev}`' :disabled='!event.prev')
+            v-icon(v-text='mdiArrowLeft')
+          v-btn(nuxt bottom right outlined icon color='primary'
+            :to='`/event/${event.next}`' :disabled='!event.next')
+            v-icon(v-text='mdiArrowRight')
+    
+        v-dialog(v-model='showEmbed' width='700px' :fullscreen='$vuetify.breakpoint.xsOnly')
+          EmbedEvent(:event='event' @close='showEmbed=false')
+    
+        v-dialog(v-show='settings.allow_geolocation && event.place?.latitude && event.place?.longitude' v-model='mapModal' :fullscreen='$vuetify.breakpoint.xsOnly' destroy-on-close)
+          EventMapDialog(:place='event.place' @close='mapModal=false')
+    
+        v-dialog(v-if='$auth?.user?.is_admin' v-model='openAssignAuthor' :fullscreen='$vuetify.breakpoint.xsOnly' destroy-on-close width=400)
+          EventAssignAuthor(:event='event' @close='openAssignAuthor=false')
+    
+        v-navigation-drawer(v-model='openModeration' :fullscreen='$vuetify.breakpoint.xsOnly' fixed top right width=400 temporary)
+          EventModeration(:event='event' v-if='openModeration' @close='openModeration=false')
+    
+    </template>
+    <script>
+    import { mapState } from 'vuex'
+    import { DateTime } from 'luxon'
+    import clipboard from '../../assets/clipboard'
+    import MyPicture from '~/components/MyPicture'
+    import EventAdmin from '@/components/EventAdmin'
+    import EventResource from '@/components/EventResource'
+    import EmbedEvent from '@/components/embedEvent'
+    import EventMapDialog from '@/components/EventMapDialog'
+    import EventModeration from '@/components/EventModeration'
+    
+    import { mdiArrowLeft, mdiArrowRight, mdiDotsVertical, mdiCodeTags, mdiClose, mdiMap, mdiMessageTextOutline,
+      mdiEye, mdiEyeOff, mdiDelete, mdiRepeat, mdiLock, mdiFileDownloadOutline, mdiShareAll,
+      mdiCalendarExport, mdiCalendar, mdiContentCopy, mdiMapMarker, mdiChevronUp, mdiMonitorAccount, mdiBookmark, mdiStar } from '@mdi/js'
+    
+    export default {
+      name: 'Event',
+      mixins: [clipboard],
+      components: {
+        EventAdmin,
+        EventResource,
+        EventModeration,
+        EventAssignAuthor: () => import(/* webpackChunkName: "admin" */ '@/components/EventAssignAuthor'),
+        EmbedEvent,
+        MyPicture,
+        EventMapDialog
+      },
+      async asyncData ({ $axios, params, error }) {
+        try {
+          const event = await $axios.$get(`/event/detail/${params.slug}`)
+          return { event }
+        } catch (e) {
+          error({ statusCode: 404, message: 'Event not found' })
+        }
+      },
+      data ({$route}) {
+        return {
+          mdiArrowLeft, mdiArrowRight, mdiDotsVertical, mdiCodeTags, mdiCalendarExport, mdiCalendar, mdiFileDownloadOutline, mdiMessageTextOutline,
+          mdiMapMarker, mdiContentCopy, mdiClose, mdiDelete, mdiEye, mdiEyeOff, mdiRepeat, mdiMap, mdiChevronUp, mdiMonitorAccount, mdiBookmark, mdiStar, mdiShareAll,
+          currentAttachment: 0,
+          event: {},
+          showEmbed: false,
+          mapModal: false,
+          openModeration: $route?.query?.moderation ? true : false,
+          openAssignAuthor: false,
+          reporting: false
+        }
+      },
+      head () {
+        if (!this.event) {
+          return {}
+        }
+        const tags_feed = this.event.tags && this.event.tags.map(tag => ({
+          rel: 'alternate',
+          type: 'application/rss+xml',
+          title: `${this.settings.title} events tagged ${tag}`,
+          href: this.settings.baseurl + `/feed/rss?tags=${tag}`
+        }))
+        const place_feed = {
+          rel: 'alternate',
+          type: 'application/rss+xml',
+          title: `${this.settings.title} events  @${this.event?.place?.name}`,
+          href: this.settings.baseurl + `/feed/rss?places=${this.event?.place?.id}`
+        }
+    
+        return {
+          title: `${this.settings.title} - ${this.event.title}`,
+          meta: [
+            // hid is used as unique identifier. Do not use `vmid` for it as it will not work
+            {
+              hid: 'description',
+              name: 'description',
+              content: this.plainDescription
+            },
+            {
+              hid: 'og-description',
+              name: 'og:description',
+              content: this.plainDescription
+            },
+            { hid: 'og-title', property: 'og:title', content: this.event.title },
+            {
+              hid: 'og-url',
+              property: 'og:url',
+              content: `${this.settings.baseurl}/event/${this.event.slug || this.event.id}`
+            },
+            { property: 'og:type', content: 'event' },
+            {
+              property: 'og:image',
+              content: this.$helper.mediaURL(this.event)
+            },
+            { property: 'og:site_name', content: this.settings.title },
+            {
+              property: 'og:updated_time',
+              content: DateTime.fromSeconds(this.event.start_datetime, { zone: this.settings.instance_timezone }).toISO()
+            },
+            {
+              property: 'article:published_time',
+              content: DateTime.fromSeconds(this.event.start_datetime, { zone: this.settings.instance_timezone }).toISO()
+            },
+            { property: 'article:section', content: 'event' },
+            { property: 'twitter:card', content: 'summary' },
+            { property: 'twitter:title', content: this.event.title },
+            {
+              property: 'twitter:image',
+              content: this.$helper.mediaURL(this.event)
+            },
+            {
+              property: 'twitter:description',
+              content: this.plainDescription
+            }
+          ],
+          link: [
+            { rel: 'image_src', href: this.$helper.mediaURL(this.event) },
+            {
+              rel: 'alternate',
+              type: 'application/rss+xml',
+              title: this.settings.title,
+              href: this.settings.baseurl + '/feed/rss'
+            },
+            ...tags_feed,
+            place_feed
+          ]
+        }
+      },
+      computed: {
+        ...mapState(['settings']),
+        hasOnlineLocations () {
+          return this.event.online_locations && this.event.online_locations.length
+        },
+        showModeration () {
+          return this.settings.enable_moderation && this.$auth?.user && (this.event.isMine || this.$auth?.user?.is_admin || this.$auth?.user?.is_editor)
+        },
+        showMap () {
+          return this.settings.allow_geolocation && this.event.place?.latitude && this.event.place?.longitude
+        },
+        hasMedia () {
+          return this.event.media && this.event.media.length
+        },
+        plainDescription () {
+          return this.event.plain_description || ''
+        },
+        can_edit () {
+          if (!this.$auth.user) {
+            return false
+          }
+          return (
+            this.event.isMine || this.$auth.user.is_admin || this.$auth.user.is_editor
+          )
+        },
+        showResources () {
+          return this.settings.enable_federation &&
+          ( (!this.settings.hide_boosts && (this.event.boost?.length || this.event?.likes?.length)) ||
+          ( this.settings.enable_resources && this.event?.resources?.length))      
+        }
+      },
+      mounted () {
+        window.addEventListener('keydown', this.keyDown)
+      },
+      beforeDestroy () {
+        window.removeEventListener('keydown', this.keyDown)
+      },
+      methods: {
+        async report () {
+          this.reporting = true
+          const message = await this.$root.$prompt(this.$t('event.report_message_confirmation'), { title: this.$t('common.report') })
+          if (!message) {
+            return
+          }
+          this.reporting = false
+          try {
+            await this.$axios.$post(`/event/messages/${this.event.id}`, { message })
+            this.$root.$message('common.sent', { color: 'success' })
+          } catch (e) {
+            this.$root.$message(e, { color: 'warning' })
+          }
+        },
+        keyDown (ev) {
+          if (this.openModeration || this.reporting) {
+            return
+          }
+          if (ev.altKey || ev.ctrlKey || ev.metaKey || ev.shiftKey) { return }
+          if (ev.key === 'ArrowRight' && this.event.next) {
+            this.goNext()
+          }
+          if (ev.key === 'ArrowLeft' && this.event.prev) {
+            this.goPrev()
+          }
+        },
+        goPrev () {
+          if (this.event.prev) {
+            this.$router.replace(`/event/${this.event.prev}`)
+          }
+        },
+        goNext () {
+          if (this.event.next) {
+            this.$router.replace(`/event/${this.event.next}`)
+          }
+        },
+        copyLink () {
+          this.$root.$message('common.copied', { color: 'success' })
+        },
+      }
+    }
+    </script>
+    
+     -->
+    
\ No newline at end of file
diff --git a/pages/index.vue b/pages/index.vue
index cc868342..def822d8 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -4,8 +4,8 @@
 <script setup lang="ts">
 import type { Announcement, Event } from '#build/types/nitro-imports'
 
-  const { data: announcements } = await useFetch<Announcement[]>('/api/announcements')
-  const { data: events } = await useFetch<Event[]>('/api/events')
+const { data: announcements } = await useFetch<Announcement[]>('/api/announcements')
+const { data: events } = await useFetch<Event[]>('/api/events')
 </script>
 <template>
   <v-container class='px-2 px-sm-6 pt-0' id='home'>
@@ -17,9 +17,9 @@ import type { Announcement, Event } from '#build/types/nitro-imports'
     <!-- Events -->
     <section id='events' class='mt-sm-4 mt-2'>
       <v-lazy class='event v-card' 
-      v-for='(event, idx) in events' :key='event.id'
-      :options="{ threshold: .5, rootMargin: '500px' }">
-      <Event :event='event' :lazy='idx>9' />
+        v-for='(event, idx) in events' :key='event.id'
+        :options="{ threshold: .5, rootMargin: '500px' }">
+        <Event :event='event' :lazy='idx>9' />
       </v-lazy>
     </section>
     <!-- <section class='text-center' v-else> -->
diff --git a/pages/place/[place].vue b/pages/place/[place].vue
new file mode 100644
index 00000000..7df211bd
--- /dev/null
+++ b/pages/place/[place].vue
@@ -0,0 +1,92 @@
+s<script setup lang="ts">
+import type { Place } from '#build/types/nitro-imports';
+import useSettings from '~/composables/useSettings';
+
+const { Settings } = useSettings()
+
+
+const route = useRoute()
+const { data: place } = await useFetch<Place>(`/api/place/${route.params.place}`)
+  if (!place) {
+    throw createError({ status: 404, statusMessage: 'Place not found'})
+}
+
+useHead( () => {
+      const title = `${Settings.title} - ${place?.name}`
+      return {
+        title,
+        link: [
+          // { rel: 'alternate', type: 'application/rss+xml', title, href: this.settings.baseurl + `/feed/rss/place/${this.place.name}` },
+          // { rel: 'alternate', type: 'text/calendar', title, href: this.settings.baseurl + `/feed/ics/place/${this.place.name}` }
+        ],
+      }
+    })
+
+</script>
+<template>
+    <v-container id='home' class='px-2 px-sm-6 pt-0'>
+      <h1 class='d-block text-h4 font-weight-black text-center text-uppercase mt-10 mx-auto w-100 text-underline'>
+        <u>{{ place?.name }}</u>
+      </h1>
+      <span v-if='place?.name!=="online"' class="d-block text-subtitle text-center w-100">{{ place?.address }}</span>
+  
+      <!-- Map -->
+      <div v-if='Settings?.allow_geolocation && place?.latitude && place?.longitude' >
+        <div class="mt-4 mx-auto px-4" >
+          <!-- <Map :place='place' :height='mapHeight' /> -->
+        </div>
+        <div class="mt-4">
+          <HowToArriveNav :place='place' class="justify-center" />
+        </div>
+      </div>
+  
+      <!-- Events -->
+      <div id="events" class='mt-14'>
+        <v-lazy class='event v-card' :value='idx<9' v-for='(event, idx) in events' :key='event.id' :min-height='hide_thumbs ? 105 : undefined' :options="{ threshold: .5, rootMargin: '500px' }" :class="{ 'theme--dark': is_dark }">
+          <Event :event='event' :lazy='idx > 9' />
+        </v-lazy>
+      </div>
+    </v-container>
+  </template>
+  <!-- <script>
+  
+  import { mapState, mapGetters } from 'vuex'
+  import Event from '@/components/Event'
+  import HowToArriveNav from '@/components/HowToArriveNav.vue'
+  
+  export default {
+    name: 'Place',
+    components: { 
+      Event, 
+      HowToArriveNav,
+      [process.client && 'Map']: () => import('@/components/Map.vue')
+     },
+    data() {
+      return { mapHeight: "14rem" }
+    },
+    head() {
+      const title = `${this.settings.title} - ${this.place.name}`
+      return {
+        title,
+        link: [
+          { rel: 'alternate', type: 'application/rss+xml', title, href: this.settings.baseurl + `/feed/rss/place/${this.place.name}` },
+          { rel: 'alternate', type: 'text/calendar', title, href: this.settings.baseurl + `/feed/ics/place/${this.place.name}` }
+        ],
+      }
+    },
+    computed: {
+      ...mapState(['settings']),
+      ...mapGetters(['hide_thumbs', 'is_dark']),
+    },
+    async asyncData({ $axios, params, error }) {
+      try {
+        const events = await $axios.$get(`/place/${encodeURIComponent(params.place)}`)
+        return events
+      } catch (e) {
+        error({ statusCode: 404, message: 'Place not found!' })
+      }
+    }
+  
+  }
+  </script>
+   -->
\ No newline at end of file
diff --git a/plugins/formatter.ts b/plugins/formatter.ts
new file mode 100644
index 00000000..3786a0f9
--- /dev/null
+++ b/plugins/formatter.ts
@@ -0,0 +1,14 @@
+export default defineNuxtPlugin((nuxtApp) => {
+    const formatter = {
+        time (unixTimestamp: number) {
+            console.error(unixTimestamp)
+            if (!unixTimestamp) return 'no'
+            return new Date(unixTimestamp*1000).toLocaleString()
+        },
+        timeToISO (unixTimestamp: number) {
+            if (!unixTimestamp) return 'no'
+            return new Date(unixTimestamp*1000).toISOString()
+        }
+    }
+    nuxtApp.provide('formatter', formatter)
+})
\ No newline at end of file
diff --git a/plugins/validators.ts b/plugins/validators.ts
index c19625ff..9313e582 100644
--- a/plugins/validators.ts
+++ b/plugins/validators.ts
@@ -1,5 +1,3 @@
-
-
 import { test }from "linkifyjs"
 export default defineNuxtPlugin((nuxtApp) => {
 
diff --git a/server/api/ap_users/trusted.get.ts b/server/api/ap_users/trusted.get.ts
new file mode 100644
index 00000000..4f45358f
--- /dev/null
+++ b/server/api/ap_users/trusted.get.ts
@@ -0,0 +1,5 @@
+import { APUser } from "~/server/utils/sequelize"
+
+export default defineEventHandler(async event => {
+    return APUser.findAll({where: { trusted: true }})
+})
diff --git a/server/api/collections/[name].get.ts b/server/api/collections/[name].get.ts
new file mode 100644
index 00000000..e2b4e557
--- /dev/null
+++ b/server/api/collections/[name].get.ts
@@ -0,0 +1,5 @@
+import { getCollectionEvents } from "~/server/utils/collections"
+
+export default defineEventHandler(event => {
+    return getCollectionEvents()
+})
\ No newline at end of file
diff --git a/server/api/collections/home.get.ts b/server/api/collections/home.get.ts
new file mode 100644
index 00000000..c520a83f
--- /dev/null
+++ b/server/api/collections/home.get.ts
@@ -0,0 +1,3 @@
+export default defineEventHandler(event => {
+    return Collection.findAll({ where: { isTop: true }})
+})
\ No newline at end of file
diff --git a/server/api/events/[slug].get.ts b/server/api/events/[slug].get.ts
index a2ecef1a..e3f67ce0 100644
--- a/server/api/events/[slug].get.ts
+++ b/server/api/events/[slug].get.ts
@@ -1,7 +1,7 @@
-import { Event } from "#imports"
+import { Event, Place, Tag } from "~/server/utils/sequelize"
 
 export default defineEventHandler(async event => {
-    const element = await Event.findOne({ where: { slug: event.context.params?.slug } })
+    const element = await Event.findOne({ where: { slug: event.context.params?.slug }, include: [Tag, Place] })
     if (element) {
         return element
     } else {
diff --git a/server/api/events/index.get.ts b/server/api/events/index.get.ts
index 071f2a16..433181fc 100644
--- a/server/api/events/index.get.ts
+++ b/server/api/events/index.get.ts
@@ -1,6 +1,6 @@
 import { Event, Place, Tag } from "~/server/utils/sequelize"
 
 export default defineEventHandler((event) => {
-    return Event.findAll({ include: [Place, Tag] })
-  })
+    return Event.findAll({ include: [Place, { model: Tag, attributes: ['tag'], through: { attributes: [] } }] })
+})
   
\ No newline at end of file
diff --git a/server/api/place/[place].ts b/server/api/place/[place].ts
new file mode 100644
index 00000000..53466c1a
--- /dev/null
+++ b/server/api/place/[place].ts
@@ -0,0 +1,8 @@
+import { getPlaceEvents } from "~/server/utils/place"
+
+export default defineEventHandler(async event => {
+    const place = event.context.params?.place
+    if (place) {
+        getPlaceEvents(place)
+    }
+})
diff --git a/server/api/settings/[key].get.ts b/server/api/settings/[key].get.ts
new file mode 100644
index 00000000..aceaff54
--- /dev/null
+++ b/server/api/settings/[key].get.ts
@@ -0,0 +1,3 @@
+export default defineEventHandler (async event => {
+    return Setting.findOne({ where: { key: event?.context?.params?.key, is_secret: false } }).then(r => r?.value)
+})
\ No newline at end of file
diff --git a/server/api/settings/index.put.ts b/server/api/settings/index.put.ts
new file mode 100644
index 00000000..4f699252
--- /dev/null
+++ b/server/api/settings/index.put.ts
@@ -0,0 +1,3 @@
+export default defineEventHandler(event => {
+      
+})
\ No newline at end of file
diff --git a/server/api/settings/index.ts b/server/api/settings/index.ts
new file mode 100644
index 00000000..ac435eb5
--- /dev/null
+++ b/server/api/settings/index.ts
@@ -0,0 +1,3 @@
+export default defineEventHandler( event => {
+    return Setting.findAll({ where: { is_secret: false }})
+})
\ No newline at end of file
diff --git a/server/api/tag/[tag].ts b/server/api/tag/[tag].ts
new file mode 100644
index 00000000..6b44fbfe
--- /dev/null
+++ b/server/api/tag/[tag].ts
@@ -0,0 +1,6 @@
+import { getTagEvents } from "~/server/utils/tag"
+
+export default defineEventHandler(async event => {
+    const tag = event.context.params?.tag
+    getTagEvents(tag)
+})
diff --git a/server/api/utils/ping.ts b/server/api/utils/ping.ts
new file mode 100644
index 00000000..338e5560
--- /dev/null
+++ b/server/api/utils/ping.ts
@@ -0,0 +1 @@
+export default defineEventHandler(event => 'OK')
\ No newline at end of file
diff --git a/server/api/utils/reachable.ts b/server/api/utils/reachable.ts
new file mode 100644
index 00000000..5fc38fd5
--- /dev/null
+++ b/server/api/utils/reachable.ts
@@ -0,0 +1,13 @@
+export default defineEventHandler(event => {
+    return fetch('http://localhost:3000/api/utils/ping')
+    // TODO
+    //     try {
+    //       await axios(config.baseurl + '/api/ping')
+    //       return res.sendStatus(200)
+    //     } catch(e) {
+    //       log.debug(e)
+    //       return res.sendStatus(400)
+    //     }
+    //   },
+    
+})
\ No newline at end of file
diff --git a/server/models/ap_user.js b/server/models/ap_user.js
deleted file mode 100644
index f7edf99e..00000000
--- a/server/models/ap_user.js
+++ /dev/null
@@ -1,15 +0,0 @@
-
-module.exports = (sequelize, DataTypes) =>
-  sequelize.define('ap_user', {
-  ap_id: {
-    type: DataTypes.STRING,
-    primaryKey: true
-  },
-  follower: DataTypes.BOOLEAN,
-  following: DataTypes.BOOLEAN,
-  trusted: DataTypes.BOOLEAN,
-  blocked: DataTypes.BOOLEAN,
-  object: {
-    type: DataTypes.JSON,
-  }
-})
diff --git a/server/models/collection.js b/server/models/collection.js
deleted file mode 100644
index 91724592..00000000
--- a/server/models/collection.js
+++ /dev/null
@@ -1,20 +0,0 @@
-module.exports = (sequelize, DataTypes) => 
-  sequelize.define('collection', {
-    id: {
-      type: DataTypes.INTEGER,
-      autoIncrement: true,
-      primaryKey: true,
-    },
-    name: {
-      type: DataTypes.STRING,
-      unique: true,
-      index: true,
-      allowNull: false
-    },
-    isActor: { // not used yet
-      type: DataTypes.BOOLEAN
-    },
-    isTop: { // is this collection shown in top navbar in home page?
-      type: DataTypes.BOOLEAN
-    }
-  }, { timestamps: false })
diff --git a/server/models/event.js b/server/models/event.js
deleted file mode 100644
index d4af7fca..00000000
--- a/server/models/event.js
+++ /dev/null
@@ -1,102 +0,0 @@
-// const config = require('../../config')
-// const { DateTime } = require('luxon')
-
-export default (sequelize, DataTypes) => {
-  const Event = sequelize.define('event', {
-    id: {
-      allowNull: false,
-      type: DataTypes.INTEGER,
-      primaryKey: true,
-      autoIncrement: true
-    },
-    title: DataTypes.STRING,
-    slug: {
-      type: DataTypes.STRING,
-      index: true,
-      unique: true
-    },
-    description: DataTypes.TEXT,
-    multidate: DataTypes.BOOLEAN,
-    start_datetime: {
-      type: DataTypes.INTEGER,
-      index: true
-    },
-    end_datetime: {
-      type: DataTypes.INTEGER,
-      index: true
-    },
-    image_path: DataTypes.STRING,
-    media: DataTypes.JSON,
-    is_visible: DataTypes.BOOLEAN,
-    recurrent: DataTypes.JSON,
-    likes: { type: DataTypes.JSON, defaultValue: [] },
-    boost: { type: DataTypes.JSON, defaultValue: [] },
-    online_locations: { type: DataTypes.JSON, defaultValue: [] },
-    ap_object: DataTypes.JSON,
-    ap_id: {
-      type: DataTypes.STRING,
-      index: true
-    }
-  })
-  
-  // Event.prototype.toAP = function (settings, to = ['https://www.w3.org/ns/activitystreams#Public'], type = 'Create') {
-
-  //   const username = settings.instance_name
-  //   const opt = {
-  //     zone: settings.instance_timezone,
-  //     locale: settings.instance_locale
-  //   }
-  //   const summary = `${this.place && this.place.name}, ${DateTime.fromSeconds(this.start_datetime, opt).toFormat('EEEE, d MMMM (HH:mm)')}`
-    
-  //   let attachment = []
-
-  //   if (this?.online_locations?.length) {
-  //     attachment = this.online_locations.map( href => ({
-  //       type: 'Link',
-  //       mediaType: 'text/html',
-  //       name: href,
-  //       href
-  //     }))
-  //   }
-        
-  //   if (this?.media?.length) {
-  //     attachment.push({
-  //       type: 'Document',
-  //       mediaType: 'image/jpeg',
-  //       url: `${config.baseurl}/media/${this.media[0].url}`,
-  //       name: this.media[0].name || this.title || '',
-  //       focalPoint: this.media[0].focalPoint || [0, 0]
-  //     })
-  //   }
-
-  //   return {
-  //     id: `${config.baseurl}/federation/m/${this.id}`,
-  //     name: this.title,
-  //     url: `${config.baseurl}/event/${this.slug || this.id}`,
-  //     type: 'Event',
-  //     startTime: DateTime.fromSeconds(this.start_datetime, opt).toISO(),
-  //     ...( this.end_datetime ? { endTime : DateTime.fromSeconds(this.end_datetime, opt).toISO() } : {} ),
-  //     location: {
-  //       type: 'Place',
-  //       name: this.place.name,
-  //       address: this.place.address,
-  //       latitude: this.place.latitude,
-  //       longitude: this.place.longitude
-  //     },
-  //     attachment,
-  //     tag: this.tags && this.tags.map(tag => ({
-  //       type: 'Hashtag',
-  //       name: '#' + tag.tag,
-  //       href: `${config.baseurl}/tag/${tag.tag}`
-  //     })),
-  //     published: this.createdAt,
-  //     ...( type != 'Create' ? { updated: this.updatedAt } : {} ),
-  //     attributedTo: `${config.baseurl}/federation/u/${username}`,
-  //     to: ['https://www.w3.org/ns/activitystreams#Public'],
-  //     cc: [`${config.baseurl}/federation/u/${username}/followers`],
-  //     content: this.description || '',
-  //     summary
-  //   }
-  // }
-  return Event
-}
\ No newline at end of file
diff --git a/server/models/eventnotification.js b/server/models/eventnotification.js
deleted file mode 100644
index fbd1429e..00000000
--- a/server/models/eventnotification.js
+++ /dev/null
@@ -1,18 +0,0 @@
-module.exports = (sequelize, DataTypes) => 
-  sequelize.define('task', {
-    id: {
-      type: DataTypes.INTEGER,
-      primaryKey: true,
-      autoIncrement: true,
-      allowNull: false,
-    },
-    status: {
-      type: DataTypes.ENUM,
-      values: ['new', 'sent', 'error', 'sending'],
-      defaultValue: 'new',
-      index: true
-    },
-    error: {
-      type: DataTypes.TEXT
-    }
-})
\ No newline at end of file
diff --git a/server/models/filter.js b/server/models/filter.js
deleted file mode 100644
index 5a4a0a2c..00000000
--- a/server/models/filter.js
+++ /dev/null
@@ -1,26 +0,0 @@
-module.exports = (sequelize, DataTypes) => 
-  sequelize.define('filter', 
-  {
-    id: {
-      type: DataTypes.INTEGER,
-      primaryKey: true,
-      autoIncrement: true,
-    },
-    negate: {
-      type: DataTypes.BOOLEAN
-    },
-    tags: {
-      type: DataTypes.JSON,
-    },
-    places: {
-      type: DataTypes.JSON,
-    },
-    actors: {
-      type: DataTypes.JSON
-    }
-  }, {
-    indexes: [
-      { fields: ['collectionId', 'tags', 'places', 'actors'], unique: true }
-    ],
-    timestamps: false
-  })
\ No newline at end of file
diff --git a/server/models/index.js b/server/models/index.js
deleted file mode 100644
index ce748ff7..00000000
--- a/server/models/index.js
+++ /dev/null
@@ -1,180 +0,0 @@
-const Sequelize = require('sequelize')
-
-const Umzug = require('umzug')
-const path = require('path')
-const config = require('../../config')
-const log = require('../../log')
-const SequelizeSlugify = require('sequelize-slugify')
-const DB = require('./models')
-const semver = require('semver')
-const models = {
-  Announcement: require('./announcement'),
-  APUser: require('./ap_user'),
-  Collection: require('./collection'),
-  Event: require('./event'),
-  EventNotification: require('./eventnotification'),
-  Filter: require('./filter'),
-  Instance: require('./instance'),
-  Notification: require('./notification'),
-  OAuthClient: require('./oauth_client'),
-  OAuthCode: require('./oauth_code'),
-  OAuthToken: require('./oauth_token'),
-  Place: require('./place'),
-  Resource: require('./resource'),
-  Setting: require('./setting'),
-  Tag: require('./tag'),
-  User: require('./user'),
-  Message: require('./message')
-}
-
-const db = {
-  sequelize: null,
-  loadModels () {
-    for (const modelName in models) {
-      const m = models[modelName](db.sequelize, Sequelize.DataTypes)
-      DB[modelName] = m
-    }
-
-  },
-  associates () {
-    const { Filter, Collection, APUser, Instance, User, Event, EventNotification, Tag,
-      OAuthCode, OAuthClient, OAuthToken, Resource, Place, Notification, Message } = DB
-
-    Filter.belongsTo(Collection)
-    Collection.hasMany(Filter)
-
-    Instance.hasMany(APUser)
-    APUser.belongsTo(Instance)
-    
-    OAuthCode.belongsTo(User)
-    OAuthCode.belongsTo(OAuthClient, { as: 'client' })
-    
-    OAuthToken.belongsTo(User)
-    OAuthToken.belongsTo(OAuthClient, { as: 'client' })
-
-    APUser.hasMany(Resource)
-    Resource.belongsTo(APUser)
-
-    Event.belongsTo(Place)
-    Place.hasMany(Event)
-
-    Message.belongsTo(Event)
-    Event.hasMany(Message)
-    
-    Event.belongsTo(User)
-    User.hasMany(Event)
-    
-    Event.belongsToMany(Tag, { through: 'event_tags' })
-    Tag.belongsToMany(Event, { through: 'event_tags' })
-    
-    // Event.belongsToMany(Notification, { through: EventNotification })
-    // Notification.belongsToMany(Event, { through: EventNotification })
-    Event.hasMany(EventNotification)
-    Notification.hasMany(EventNotification)
-    
-    Event.hasMany(Resource)
-    Resource.belongsTo(Event)
-
-    APUser.hasMany(Event)
-    Event.belongsTo(APUser)
-
-    Event.hasMany(Event, { as: 'child', foreignKey: 'parentId' })
-    Event.belongsTo(Event, { as: 'parent' })
-    
-    SequelizeSlugify.slugifyModel(Event, { source: ['title'], overwrite: false })
-
-  },
-  close() {
-    if (db.sequelize) {
-      return db.sequelize.close()
-    }
-  },
-  connect(dbConf = config.db) {
-    dbConf.dialectOptions = { autoJsonMap: true }
-    log.debug(`Connecting to DB: ${JSON.stringify(dbConf)}`)
-    if (dbConf.dialect === 'sqlite') {
-      dbConf.retry = {
-        match: [
-          Sequelize.ConnectionError,
-          Sequelize.ConnectionTimedOutError,
-          Sequelize.TimeoutError,
-          /Deadlock/i,
-          /SQLITE_BUSY/],
-        max: 15
-      }
-    }
-    db.sequelize = new Sequelize(dbConf)
-  },
-  async isEmpty() {
-    try {
-      const users = await db.sequelize.query('SELECT * from users')
-      return !(users && users.length)
-    } catch (e) {
-      return true
-    }
-  },
-  async fixMariaDBJSON () {
-
-    // manually fix mariadb JSON wrong parse
-    if (db.sequelize.options.dialect === 'mariadb' && semver.lt('10.5.2', db.sequelize.options.databaseVersion)) {
-      try {
-        const ret = await db.sequelize.query('SHOW CREATE TABLE `settings`')
-        if (!ret[0][0]['Create Table'].toLowerCase().includes('json_valid')){
-          await db.sequelize.query('alter table settings modify `value` JSON')
-          await db.sequelize.query('alter table ap_users modify `object` JSON')
-          await db.sequelize.query('alter table events modify `recurrent` JSON')
-          await db.sequelize.query('alter table events modify `likes` JSON')
-          await db.sequelize.query('alter table events modify `boost` JSON')
-          await db.sequelize.query('alter table events modify `media` JSON')
-          await db.sequelize.query('alter table events modify `online_locations` JSON')
-          await db.sequelize.query('alter table filters modify `tags` JSON')
-          await db.sequelize.query('alter table filters modify `places` JSON')
-          await db.sequelize.query('alter table instances modify `data` JSON')
-          await db.sequelize.query('alter table notifications modify `filters` JSON')
-          await db.sequelize.query('alter table resources modify `data` JSON')
-          await db.sequelize.query('alter table users modify `settings` JSON')
-          await db.sequelize.query('alter table users modify `rsa` JSON')
-          log.info(`MariaDB JSON migrations done`)
-        } else {
-          log.debug('MariaDB JSON issue already fixed')
-        }
-      } catch (e) {
-        console.error(e)
-      }
-    }
-  },
-  async runMigrations() {
-    const logging = log.debug.bind(log) // config.status !== 'READY' ? false : log.debug.bind(log)
-
-    const umzug = new Umzug({
-      storage: 'sequelize',
-      storageOptions: { sequelize: db.sequelize },
-      logging,
-      migrations: {
-        wrap: fun => {
-          return () =>
-            fun(db.sequelize.queryInterface, Sequelize).catch(e => {
-              log.warn(e)
-              return false
-            })
-        },
-        path: path.resolve(__dirname, '..', '..', 'migrations')
-      }
-    })
-    return umzug.up()
-  },
-  initialize() {
-    if (config.status === 'CONFIGURED') {
-      try {
-        db.connect()
-        db.loadModels()
-        db.associates()
-      } catch (e) {
-        log.warn(` ⚠️ Cannot connect to db, check your configuration => ${e}`)
-        process.exit(1)
-      }
-    }
-  }
-}
-
-module.exports = db
diff --git a/server/models/instance.js b/server/models/instance.js
deleted file mode 100644
index b9baa299..00000000
--- a/server/models/instance.js
+++ /dev/null
@@ -1,12 +0,0 @@
-module.exports = (sequelize, DataTypes) => 
-  sequelize.define('instance', {
-  domain: {
-    primaryKey: true,
-    allowNull: false,
-    type: DataTypes.STRING
-  },
-  name: DataTypes.STRING,
-  blocked: DataTypes.BOOLEAN,
-  data: DataTypes.JSON,
-  applicationActor: DataTypes.STRING,
-})
\ No newline at end of file
diff --git a/server/models/message.js b/server/models/message.js
deleted file mode 100644
index 09a467bf..00000000
--- a/server/models/message.js
+++ /dev/null
@@ -1,27 +0,0 @@
-module.exports = (sequelize, DataTypes) => 
-sequelize.define('message', {
-    id: {
-        type: DataTypes.INTEGER,
-        autoIncrement: true,
-        primaryKey: true,
-    },
-    message: {
-        type: DataTypes.TEXT,
-        allowNull: false
-    },
-    author: {
-        type: DataTypes.ENUM,
-        values: ['AUTHOR', 'ADMIN', 'ANON', 'REGISTERED']
-    },
-    is_author_visible: DataTypes.BOOLEAN, // is this message visible to the author?
-})
-
-/** Moderation
- * 
- * - new global settings to enable/disable this feature (enabled by default)
- * - every user could report an event
- * - admins will receive an mail notification about the report 
- * - admin could reply to report (optional adding author as destination)
- * - admin could always interact with event moderation (hide, confirm, remove)
- * - admin could disable the author
-*/
\ No newline at end of file
diff --git a/server/models/models.js b/server/models/models.js
deleted file mode 100644
index d097ac76..00000000
--- a/server/models/models.js
+++ /dev/null
@@ -1,21 +0,0 @@
-// export default models
-
-// Announcement: require('./announcement'),
-// APUser: require('./ap_user'),
-// Collection: require('./collection'),
-// Event: require('./event'),
-// EventNotification: require('./eventnotification'),
-// Filter: require('./filter'),
-// Instance: require('./instance'),
-// Notification: require('./notification'),
-// Message: require('./message'),
-// OAuthClient: require('./oauth_client'),
-// OAuthCode: require('./oauth_code'),
-// OAuthToken: require('./oauth_token'),
-// Place: require('./place'),
-// Resource: require('./resource'),
-// Setting: require('./setting'),
-// Tag: require('./tag'),
-// User: require('./user'),
-
-module.exports = {}
\ No newline at end of file
diff --git a/server/models/notification.js b/server/models/notification.js
deleted file mode 100644
index 8d36e89e..00000000
--- a/server/models/notification.js
+++ /dev/null
@@ -1,22 +0,0 @@
-module.exports = (sequelize, DataTypes) => 
-  sequelize.define('notification', {
-  filters: DataTypes.JSON,
-  email: DataTypes.STRING,
-  remove_code: DataTypes.STRING,
-  action: {
-    type: DataTypes.ENUM,
-    values: ['Create', 'Update', 'Delete']
-  },
-  type: {
-    type: DataTypes.ENUM,
-    values: ['mail', 'admin_email', 'ap']
-  }
-},
-{
-  sequelize,
-  modelName: 'notification',
-  indexes: [{
-    unique: true,
-    fields: ['action', 'type']
-  }]
-})
\ No newline at end of file
diff --git a/server/models/oauth_client.js b/server/models/oauth_client.js
deleted file mode 100644
index e30e05ab..00000000
--- a/server/models/oauth_client.js
+++ /dev/null
@@ -1,13 +0,0 @@
-module.exports = (sequelize, DataTypes) => 
-sequelize.define('oauth_client', {
-  id: {
-    type: DataTypes.STRING,
-    primaryKey: true,
-    allowNull: false
-  },
-  name: DataTypes.STRING,
-  client_secret: DataTypes.STRING,
-  scopes: DataTypes.STRING,
-  redirectUris: DataTypes.STRING,
-  website: DataTypes.STRING
-})
\ No newline at end of file
diff --git a/server/models/oauth_code.js b/server/models/oauth_code.js
deleted file mode 100644
index ba82de74..00000000
--- a/server/models/oauth_code.js
+++ /dev/null
@@ -1,10 +0,0 @@
-module.exports = (sequelize, DataTypes) => 
-  sequelize.define('oauth_code', {
-  authorizationCode: {
-    type: DataTypes.STRING,
-    primaryKey: true
-  },
-  expiresAt: DataTypes.DATE,
-  scope: DataTypes.STRING,
-  redirect_uri: DataTypes.STRING
-})
\ No newline at end of file
diff --git a/server/models/oauth_token.js b/server/models/oauth_token.js
deleted file mode 100644
index 984ece06..00000000
--- a/server/models/oauth_token.js
+++ /dev/null
@@ -1,22 +0,0 @@
-module.exports = (sequelize, DataTypes) => 
-  sequelize.define('oauth_token', {
-  accessToken: {
-    type: DataTypes.STRING,
-    allowNull: false,
-    primaryKey: true
-  },
-  accessTokenExpiresAt: {
-    type: DataTypes.DATE,
-    get () {
-      return new Date(this.getDataValue('accesTokenExpiresAt'))
-    }
-  },
-  refreshToken: DataTypes.STRING,
-  refreshTokenExpiresAt: {
-    type: DataTypes.DATE,
-    get () {
-      return new Date(this.getDataValue('accesTokenExpiresAt'))
-    }
-  },
-  scope: DataTypes.STRING
-})
\ No newline at end of file
diff --git a/server/models/place.js b/server/models/place.js
deleted file mode 100644
index 734824d5..00000000
--- a/server/models/place.js
+++ /dev/null
@@ -1,12 +0,0 @@
-module.exports = (sequelize, DataTypes) => 
-  sequelize.define('place', {
-  name: {
-    type: DataTypes.STRING,
-    unique: true,
-    index: true,
-    allowNull: false
-  },
-  address: DataTypes.STRING,
-  latitude: DataTypes.FLOAT,
-  longitude: DataTypes.FLOAT,
-})
\ No newline at end of file
diff --git a/server/models/resource.js b/server/models/resource.js
deleted file mode 100644
index 1774287c..00000000
--- a/server/models/resource.js
+++ /dev/null
@@ -1,10 +0,0 @@
-module.exports = (sequelize, DataTypes) => 
-  sequelize.define('resource', {
-  activitypub_id: {
-    type: DataTypes.STRING,
-    index: true,
-    unique: true
-  },
-  hidden: DataTypes.BOOLEAN,
-  data: DataTypes.JSON
-})
\ No newline at end of file
diff --git a/server/models/setting.js b/server/models/setting.js
deleted file mode 100644
index cd73feba..00000000
--- a/server/models/setting.js
+++ /dev/null
@@ -1,11 +0,0 @@
-module.exports = (sequelize, DataTypes) => 
-  sequelize.define('setting', {
-  key: {
-    type: DataTypes.STRING,
-    primaryKey: true,
-    allowNull: false,
-    index: true
-  },
-  value: DataTypes.JSON,
-  is_secret: DataTypes.BOOLEAN
-})
diff --git a/server/models/tag.js b/server/models/tag.js
deleted file mode 100644
index dfab832b..00000000
--- a/server/models/tag.js
+++ /dev/null
@@ -1,9 +0,0 @@
-module.exports = (sequelize, DataTypes) => 
-  sequelize.define('tag', {
-  tag: {
-    type: DataTypes.STRING,
-    allowNull: false,
-    index: true,
-    primaryKey: true
-  }
-})
\ No newline at end of file
diff --git a/server/models/user.js b/server/models/user.js
deleted file mode 100644
index b775efc4..00000000
--- a/server/models/user.js
+++ /dev/null
@@ -1,65 +0,0 @@
-
-const bcrypt = require('bcryptjs')
-
-module.exports = (sequelize, DataTypes) => {
-  const User = sequelize.define('user', {
-    settings: {
-      type: DataTypes.JSON,
-      defaultValue: []
-    },
-    email: {
-      type: DataTypes.STRING,
-      unique: { msg: 'error.email_taken' },
-      validate: {
-        notEmpty: true
-      },
-      index: true,
-      allowNull: false
-    },
-    description: DataTypes.TEXT,
-    password: DataTypes.STRING,
-    recover_code: DataTypes.STRING,
-    role: {
-      type: DataTypes.ENUM,
-      values: ['admin', 'editor', 'user'],
-      defaultValue: 'user'
-    },
-    is_admin: {
-      type: DataTypes.VIRTUAL,
-      get () {
-        return this.role === 'admin'
-      }
-    },
-    is_editor: {
-      type: DataTypes.VIRTUAL,
-      get () {
-        return this.role === 'editor'
-      }      
-    },
-    is_active: DataTypes.BOOLEAN
-  }, {
-    scopes: {
-      withoutPassword: {
-        attributes: { exclude: ['password', 'recover_code'] }
-      },
-      withRecover: {
-        attributes: { exclude: ['password', 'insert_at', 'created_at'] }
-      }
-    }
-  })
-  
-  User.prototype.comparePassword = async function (pwd) {
-    if (!this.password) { return false }
-    return bcrypt.compare(pwd, this.password)
-  }
-  
-  User.beforeSave(async (user, _options) => {
-    if (user.changed('password')) {
-      const salt = await bcrypt.genSalt(10)
-      const hash = await bcrypt.hash(user.password, salt)
-      user.password = hash
-    }
-  })
-
-  return User
-}
diff --git a/server/routes/headerimage.png.ts b/server/routes/headerimage.png.ts
new file mode 100644
index 00000000..6fd489fe
--- /dev/null
+++ b/server/routes/headerimage.png.ts
@@ -0,0 +1 @@
+export default defineEventHandler(() => 'Hello World!')
\ No newline at end of file
diff --git a/server/utils/collections.ts b/server/utils/collections.ts
new file mode 100644
index 00000000..d5945eec
--- /dev/null
+++ b/server/utils/collections.ts
@@ -0,0 +1,25 @@
+import { Op } from "@sequelize/core"
+import { Event } from "./sequelize"
+
+export async function getCollectionEvents({
+        start,
+        // end: number,
+        // query = '',
+        // tags = null,
+        // places = null,
+        // show_recurrent = false,
+        // show_multidate = false,
+        // limit = 9,
+        // page = 1,
+        // older = false,
+        // reverse = false,
+        // user_id = null,
+        // ap_user_id = null,
+        // include_unconfirmed = false,
+        // include_parent = false,
+        // include_description=false,
+        // include_ap_events=false,
+    } : { start: number } = { start: new Date().valueOf() }) {
+
+        return Event.findAll({ where: { start_datetime: { [Op.gte]: start }}})
+}
\ No newline at end of file
diff --git a/server/utils/events.ts b/server/utils/events.ts
new file mode 100644
index 00000000..f95bfa9e
--- /dev/null
+++ b/server/utils/events.ts
@@ -0,0 +1,24 @@
+import { Event } from "./sequelize"
+
+export async function getEvents({
+        start = new Date(),
+        end,
+        query,
+        tags,
+        places,
+        show_recurrent,
+        show_multidate,
+        limit,
+        page,
+        older,
+        reverse,
+        user_id,
+        ap_user_id,
+        include_unconfirmed = false,
+        include_parent = false,
+        include_description=false,
+        include_ap_events=false,
+    }) {
+
+        return Event.findAll()
+}
\ No newline at end of file
diff --git a/server/utils/place.ts b/server/utils/place.ts
new file mode 100644
index 00000000..f17fdd2d
--- /dev/null
+++ b/server/utils/place.ts
@@ -0,0 +1,14 @@
+import { Place, Event } from './sequelize'
+
+export async function getPlaceEvents (name: string | undefined) {
+    if (!name) { 
+        throw new Error(`Place name not specified`)
+    }
+    const place = await Place.findOne({ where: { name }})
+    if (!place) {
+        throw new Error(`Place ${name} not found`)
+    }
+
+    return Event.findAll({ where: { placeId: place.id }})
+
+}
\ No newline at end of file
diff --git a/server/utils/sequelize.ts b/server/utils/sequelize.ts
index c36dd9c2..3990fbf5 100644
--- a/server/utils/sequelize.ts
+++ b/server/utils/sequelize.ts
@@ -94,9 +94,26 @@ InferCreationAttributes<Event>
     @Unique
     declare slug: string
 
+    @Attribute(DataTypes.INTEGER.UNSIGNED)
+    @Index
+    declare start_datetime: number
+
+    @Attribute(DataTypes.INTEGER.UNSIGNED)
+    @Index
+    declare end_datetime: number    
+
+    @Attribute(DataTypes.JSON)
+    declare media: string
+
     @Attribute(DataTypes.TEXT)
     declare description: string
 
+    @Attribute(DataTypes.BOOLEAN)
+    declare is_visible: boolean
+
+    @Attribute(DataTypes.JSON)
+    declare online_locations: string
+
     @Attribute({
       type: DataTypes.INTEGER.UNSIGNED,
       references: { table: "places", key: "id" },
@@ -131,8 +148,8 @@ InferCreationAttributes<User>
     tableName: 'places'
 })
 export class Place extends Model<
-    InferAttributes<User>,
-    InferCreationAttributes<User>
+    InferAttributes<Place>,
+    InferCreationAttributes<Place>
 > {
     @Attribute(DataTypes.INTEGER.UNSIGNED)
     @PrimaryKey
@@ -142,6 +159,7 @@ export class Place extends Model<
     @Attribute(DataTypes.STRING)
     @Index
     @Unique
+    @NotNull
     declare name: string;
 
     @Attribute(DataTypes.STRING)
@@ -276,4 +294,118 @@ type Role = "admin" | "editor" | "user"
 //     declare author?: NonAttribute<User>;
 //   }
 
-sequelize.addModels([Announcement, Place, Event, Tag]);
\ No newline at end of file
+
+@Table({
+    tableName: 'instances'
+})
+export class Instance extends Model<
+    InferAttributes<Instance>,
+    InferCreationAttributes<Instance>
+> {
+    @Attribute(DataTypes.STRING)
+    @PrimaryKey
+    declare domain: string
+
+    @Attribute(DataTypes.STRING)
+    declare name: string
+
+    @Attribute(DataTypes.BOOLEAN)
+    declare blocked: boolean
+
+    @Attribute(DataTypes.JSON)
+    declare data: string;
+
+    @Attribute(DataTypes.STRING)
+    declare applicationActor: string;
+
+    // @HasMany(() => Event, /* foreign key */ 'placeId')
+    // declare events?: NonAttribute<Event[]>;
+
+}
+
+
+type APUserObject = { 
+    name: string,
+    icon: { url: string },
+    summary?: string,
+    preferredUsername: string,
+
+}
+
+@Table({
+    tableName: 'ap_users'
+})
+export class APUser extends Model<
+    InferAttributes<APUser>,
+    InferCreationAttributes<APUser>
+> {
+    @Attribute(DataTypes.STRING)
+    @PrimaryKey
+    declare ap_id: string
+
+    @Attribute(DataTypes.BOOLEAN)
+    declare follower: boolean
+
+    @Attribute(DataTypes.BOOLEAN)
+    declare following: boolean
+
+    @Attribute(DataTypes.BOOLEAN)
+    declare trusted: boolean
+
+    @Attribute(DataTypes.BOOLEAN)
+    declare blocked: boolean
+
+    @Attribute(DataTypes.JSON)
+    declare object: APUserObject;
+
+    // @HasMany(() => Event, /* foreign key */ 'placeId')
+    // declare events?: NonAttribute<Event[]>;
+
+}
+
+@Table({
+    tableName: 'settings'
+})
+export class Setting extends Model<
+    InferAttributes<Setting>,
+    InferCreationAttributes<Setting>
+> {
+    @Attribute(DataTypes.STRING)
+    @PrimaryKey
+    declare key: string
+
+    @Attribute(DataTypes.JSON)
+    declare value: boolean
+
+    @Attribute(DataTypes.BOOLEAN)
+    declare is_secret: boolean
+}
+
+@Table({
+    tableName: 'collections',
+    timestamps: false
+})
+export class Collection extends Model<
+    InferAttributes<Collection>,
+    InferCreationAttributes<Collection>
+> {
+
+    @Attribute(DataTypes.INTEGER.UNSIGNED)
+    @PrimaryKey
+    @AutoIncrement
+    declare readonly id: CreationOptional<number>
+
+    @Attribute(DataTypes.STRING)
+    @Unique
+    @Index
+    @NotNull
+    declare name: string
+
+    @Attribute(DataTypes.BOOLEAN) // not used yet
+    declare isActor: boolean
+
+    @Attribute(DataTypes.BOOLEAN) // is this collection shown in top navbar in home page?
+    declare isTop: boolean
+}
+
+sequelize.addModels([Announcement, Place, Event, Tag, User, Instance, APUser, Setting, Collection]);
\ No newline at end of file
diff --git a/server/utils/tag.ts b/server/utils/tag.ts
new file mode 100644
index 00000000..ea2fb381
--- /dev/null
+++ b/server/utils/tag.ts
@@ -0,0 +1,11 @@
+import { Tag, Place, Event } from './sequelize'
+
+export async function getTagEvents (tag: string | undefined) {
+    if (!tag) { 
+        throw new Error(`Tag not specified`)
+    }
+
+    // TODO
+    return Event.findAll({ include: [ Tag ]})
+
+}
\ No newline at end of file