Feedback

app/Policies/EventPolicy.php

@@ -42,7 +42,7 @@ public function report(User $user, Event $event)
             return false;
         }
 
-        if ($user->email === $event->owner->email) {
+        if ($event->owner && $user->email === $event->owner->email) {
             return true;
         }
 
@@ -84,7 +84,7 @@ public function edit(User $user, Event $event)
             return false;
         }
 
-        if ($user->email === $event->owner->email) {
+        if ($event->owner && $user->email === $event->owner->email) {
             return true;
         }
 
@@ -105,7 +105,7 @@ public function delete(User $user, Event $event): bool
             }
         }
 
-        if ($user->email === $event->owner->email) {
+        if ($event->owner && $user->email === $event->owner->email) {
             return true;
         }
 

public/build/manifest.json

@@ -1,16 +1,16 @@
 {
   "resources/assets/sass/app.scss": {
-    "file": "assets/app-B8QIQfc7.css",
+    "file": "assets/app-B44hSfhu.css",
     "src": "resources/assets/sass/app.scss",
     "isEntry": true
   },
   "resources/css/app.css": {
-    "file": "assets/app-rguKvbSB.css",
+    "file": "assets/app-DPSMvogr.css",
     "src": "resources/css/app.css",
     "isEntry": true
   },
   "resources/js/app.js": {
-    "file": "assets/app-B8BfzfKB.js",
+    "file": "assets/app-BhhS6zLa.js",
     "name": "app",
     "src": "resources/js/app.js",
     "isEntry": true,

resources/js/components/EventCard.vue

@@ -5,6 +5,10 @@
     </div>
 
     <div class="flex-grow flex flex-col gap-2 px-6 py-4">
+      <div class="text-default text-slate-500 mb-2 flex items-center font-semibold">
+        Organizer: <span class="text-sm font-semibold ml-1 w-fit px-4 py-1.5 bg-[#CCF0F9] rounded-full flex items-center">{{ event.organizer || 'Unknown' }}</span>
+      </div>
+
       <div v-if="eventTags.length" class="flex gap-2 flex-wrap mb-2">
         <template v-for="{ title, highlight } in eventTags">
           <span

resources/js/components/EventDetail.vue

@@ -13,6 +13,15 @@
           {{ fromText }} - {{ toText }}
         </p>
 
+        <div class="mb-6">
+          <p class="text-slate-500 font-semibold p-0 mb-2">
+            Organizer:
+          </p>
+          <p class="text-[#20262C] font-normal p-0 mb-6">
+            {{ event.organizer || 'Unknown' }}
+          </p>
+        </div>
+
         <div v-if="event.activity_format" class="mb-6">
           <p class="p-0 mb-2 font-semibold text-slate-500">
             Format of the activity:

resources/js/components/SearchPageComponent.vue

@@ -91,6 +91,7 @@
           <FieldWrapper horizontal label="Language">
             <SelectField
               multiple
+              searchable
               return-object
               placeholder="Select language"
               v-model="filters.languages"
@@ -101,6 +102,7 @@
           <FieldWrapper horizontal label="Country">
             <SelectField
               multiple
+              searchable
               return-object
               id-name="iso"
               placeholder="Select country"
@@ -188,6 +190,7 @@
               <FieldWrapper horizontal label="Format">
                 <SelectField
                   multiple
+                  searchable
                   return-object
                   placeholder="Select format"
                   v-model="filters.formats"
@@ -199,6 +202,7 @@
               <FieldWrapper horizontal label="Activity type">
                 <SelectField
                   multiple
+                  searchable
                   return-object
                   placeholder="Select type"
                   v-model="filters.types"
@@ -210,6 +214,7 @@
               <FieldWrapper horizontal label="Audience">
                 <SelectField
                   multiple
+                  searchable
                   return-object
                   placeholder="Select audience"
                   v-model="filters.audiences"
@@ -221,6 +226,7 @@
               <FieldWrapper horizontal label="Age range">
                 <SelectField
                   multiple
+                  searchable
                   return-object
                   placeholder="Select range"
                   v-model="filters.ages"
@@ -232,6 +238,7 @@
               <FieldWrapper horizontal label="Themes">
                 <SelectField
                   multiple
+                  searchable
                   return-object
                   placeholder="Select themes"
                   v-model="filters.themes"
@@ -281,6 +288,7 @@ import SelectField from './form-fields/SelectField.vue';
 import InputField from './form-fields/InputField.vue';
 
 import { useDataOptions } from './activity-form/mixins.js';
+import { useQueryParams } from '../composables/useQueryParams.js';
 
 export default {
   name: 'SearchPageComponent',
@@ -312,6 +320,8 @@ export default {
     const { activityFormatOptions, activityTypeOptions, ageOptions } =
       useDataOptions();
 
+    const { queryParams, onChangeQueryParams } = useQueryParams();
+
     const isLoading = ref(true);
     const mapContainerRef = ref(null);
     const mapInstance = ref(null);
@@ -321,7 +331,7 @@ export default {
     const errors = ref(null);
 
     const emptyFilters = {
-      query: '',
+      query: props.prpQuery || '',
       languages: [],
       countries: [],
       start_date: '',
@@ -330,13 +340,12 @@ export default {
       audiences: [],
       ages: [],
       themes: [],
+      year: { id: new Date().getFullYear(), name: new Date().getFullYear() },
+      countries: props.prpSelectedCountry || [],
     };
 
     const filters = ref({
       ...emptyFilters,
-      query: props.prpQuery || '',
-      year: { id: new Date().getFullYear(), name: new Date().getFullYear() },
-      countries: props.prpSelectedCountry || [],
     });
 
     const pagination = ref({
@@ -363,6 +372,55 @@ export default {
       }))
     );
 
+    const handleUpdateParams = () => {
+      const updatedParams = {
+        page: pagination.value.current_page,
+        query: filters.value.query,
+        year: filters.value.year?.id,
+        start_date: filters.value.start_date,
+        languages: filters.value.languages?.map((i) => i.id).join(','),
+        countries: filters.value.countries?.map((i) => i.iso).join(','),
+        formats: filters.value.formats?.map((i) => i.id).join(','),
+        types: filters.value.types?.map((i) => i.id).join(','),
+        audiences: filters.value.audiences?.map((i) => i.id).join(','),
+        ages: filters.value.ages?.map((i) => i.id).join(','),
+        themes: filters.value.themes?.map((i) => i.id).join(','),
+      };
+      console.log('updatedParams', updatedParams);
+      onChangeQueryParams(updatedParams);
+    };
+
+    const onInitFilters = () => {
+      const params = queryParams.value;
+      console.log('init params', params);
+
+      const mapList = (listVal, options, key = 'id') => {
+        return (listVal || '')
+          .split(',')
+          .map((val) => options.find((op) => String(op[key]) === String(val)))
+          .filter((i) => !!i);
+      };
+      if (params.page) {
+        pagination.value.current_page = params.page;
+      }
+
+      filters.value = {
+        ...emptyFilters,
+        query: params.query || '',
+        start_date: params.start_date || '',
+        year: params.year
+          ? { id: params.year, name: params.year }
+          : emptyFilters.year,
+        languages: mapList(params.languages, languageOptions.value),
+        countries: mapList(params.countries, props.countrieslist, 'iso'),
+        formats: mapList(params.formats, activityFormatOptions.value),
+        types: mapList(params.types, activityTypeOptions.value),
+        audiences: mapList(params.audiences, props.audienceslist),
+        ages: mapList(params.ages, ageOptions.value),
+        themes: mapList(params.themes, props.themeslist),
+      };
+    };
+
     const tags = computed(() => {
       const result = [
         ...filters.value.languages,
@@ -424,6 +482,8 @@ export default {
         url = `/search?page=${pagination.value.current_page}`;
       }
 
+      handleUpdateParams();
+
       const requestData = {
         ...filters.value,
         year: filters.value.year?.id,
@@ -623,7 +683,7 @@ export default {
     const handleInitMap = () => {
       mapInstance.value = L.map('mapid');
       mapInstance.value.setView([51, 10], 5);
-      
+
       L.tileLayer(props.mapTileUrl, {
         maxZoom: 18,
         attribution: '© <a href="https://www.mapbox.com/">Mapbox</a>',
@@ -648,7 +708,10 @@ export default {
     };
 
     onMounted(() => {
-      onSubmit();
+      setTimeout(() => {
+        onInitFilters();
+        onSubmit();
+      }, 100);
 
       // document.addEventListener('leaflet-ready', () => {
       setTimeout(() => {

resources/js/components/form-fields/SelectField.vue

@@ -160,6 +160,7 @@ export default {
 
     const isSelectedOption = (option) => {
       if (props.multiple) {
+        if (!selectedValues.value) return false;
         return selectedValues.value?.some(
           (item) => String(item[props.idName]) === String(option[props.idName])
         );

resources/js/composables/useQueryParams.js

@@ -0,0 +1,39 @@
+import { ref } from 'vue';
+import _ from 'lodash';
+
+export const useQueryParams = () => {
+  const urlParams = new URLSearchParams(window.location.search);
+  console.log('urlParams', urlParams);
+  const queryParams = ref({});
+  for (const [key, value] of urlParams) {
+    queryParams.value[key] = value;
+  }
+
+  const onChangeQueryParams = (paramsArg) => {
+    const params = _.cloneDeep(paramsArg);
+    console.log('>>> params', params);
+    const searchParams = new URLSearchParams(window.location.search);
+    for (const key in params) {
+      const val = params[key];
+      if (typeof val === 'number') {
+        if (_.isNil(val)) searchParams.delete(key);
+        else searchParams.set(key, val);
+      } else {
+        if (_.isEmpty(val)) searchParams.delete(key);
+        else searchParams.set(key, val);
+      }
+    }
+
+    queryParams.value = params;
+
+    const newUrl = searchParams.toString()
+      ? `${window.location.pathname}?${searchParams.toString()}`
+      : window.location.pathname;
+    window.history.replaceState({}, '', newUrl);
+  };
+
+  return {
+    queryParams,
+    onChangeQueryParams,
+  };
+};

resources/lang/en/event.php

@@ -373,4 +373,7 @@
     'confirmation_step.activity_overview' => 'Activity overview',
     'confirmation_step.who_is_the_activity_for' => 'Who is the activity for',
     'confirmation_step.organiser' => 'Organiser',
+    'your-changes-have-been-saved' => 'Your CHnages have been saved',
+    'view-activity' => 'View activity',
+    'add-another-activity' => 'Add another activity',
 ];

resources/views/event/event_tile_approval.blade.php

@@ -6,9 +6,9 @@
         @can('approve', $event)
             @isset($moderation)
                 @if($event->owner)
-                    <div class="text-default text-slate-500 mb-2 flex items-center font-semibold">Organizer: <span class="font-normal ml-3 w-fit px-4 py-1.5 bg-[#CCF0F9] rounded-full flex items-center">{{$event->owner->email ?? $event->owner->email_display }}</span></div>
+                    <div class="text-default text-slate-500 mb-2 flex items-center font-semibold">Organizer: <span class="text-sm font-semibold ml-1 w-fit px-4 py-1.5 bg-[#CCF0F9] rounded-full flex items-center">{{$event->owner->email ?? $event->owner->email_display }}</span></div>
                 @else
-                    <div class="text-default text-slate-500 mb-2 flex items-center font-semibold">Organizer: <span class="font-normal ml-3 w-fit px-4 py-1.5 bg-[#CCF0F9] rounded-full flex items-center">Unknown</span></div>
+                    <div class="text-default text-slate-500 mb-2 flex items-center font-semibold">Organizer: <span class="text-sm font-semibold ml-1 w-fit px-4 py-1.5 bg-[#CCF0F9] rounded-full flex items-center">Unknown</span></div>
                 @endif
             @endisset
         @endcan