From 615f144d1df21ca1040edc2b7e840952f103aa2c Mon Sep 17 00:00:00 2001
From: Ernest Walzel <ernest.walzel@sng.sk>
Date: Fri, 15 Mar 2024 12:08:24 +0100
Subject: [PATCH 1/9] Subscription API

---
 .../Api/NewsletterSubscriptionController.php  | 46 +++++++++++++++++++
 app/Providers/AppServiceProvider.php          | 18 +++++---
 routes/api.php                                |  7 ++-
 .../Api/NewsletterSubscriptionsTest.php       | 24 ++++++++++
 4 files changed, 88 insertions(+), 7 deletions(-)
 create mode 100644 app/Http/Controllers/Api/NewsletterSubscriptionController.php
 create mode 100644 tests/Feature/Api/NewsletterSubscriptionsTest.php

diff --git a/app/Http/Controllers/Api/NewsletterSubscriptionController.php b/app/Http/Controllers/Api/NewsletterSubscriptionController.php
new file mode 100644
index 000000000..7998ebcda
--- /dev/null
+++ b/app/Http/Controllers/Api/NewsletterSubscriptionController.php
@@ -0,0 +1,46 @@
+<?php
+
+namespace App\Http\Controllers\Api;
+
+use App\Http\Controllers\Controller;
+use DrewM\MailChimp\MailChimp;
+use Illuminate\Http\Request;
+use Illuminate\Support\Facades\Date;
+
+class NewsletterSubscriptionController extends Controller
+{
+    public function store(Request $request, MailChimp $mailChimp)
+    {
+        $request->validate([
+            'email' => 'required|email',
+        ]);
+
+        $listId = config('mailchimp.lists.webumenia-newsletter.id');
+
+        $mailChimp->post("lists/{$listId}/members", [
+            'email_address' => $request->email,
+            'status' => 'pending',
+            'email_type' => 'html',
+            'marketing_permissions' => [
+                [
+                    'marketing_permission_id' => config(
+                        'mailchimp.lists.webumenia-newsletter.marketing_permissions.default'
+                    ),
+                    'enabled' => true,
+                ],
+            ],
+        ]);
+
+        if (!$mailChimp->success()) {
+            abort(500, $mailChimp->getLastError());
+        }
+
+        return response('', 201)->cookie(
+            'newsletterSubscribedAt',
+            Date::now()->toIso8601String(),
+            Date::now()
+                ->addYears(10)
+                ->diffInMinutes()
+        );
+    }
+}
diff --git a/app/Providers/AppServiceProvider.php b/app/Providers/AppServiceProvider.php
index 6eaa56331..243d63348 100644
--- a/app/Providers/AppServiceProvider.php
+++ b/app/Providers/AppServiceProvider.php
@@ -8,6 +8,7 @@
 use App\Harvest\Importers\ItemImporter;
 use App\Harvest\Mappers\BaseAuthorityMapper;
 use App\Services\Frontend;
+use DrewM\MailChimp\MailChimp;
 use Illuminate\Filesystem\FilesystemAdapter;
 use Illuminate\Pagination\Paginator;
 use Illuminate\Support\Facades\Blade;
@@ -35,20 +36,24 @@ public function register()
         $this->app->bind(AuthoritySearchRequestType::class);
         $this->app->bind(ItemSearchRequestType::class);
 
-        $this->app->when(AuthorityRepository::class)
+        $this->app
+            ->when(AuthorityRepository::class)
             ->needs('$locales')
             ->give(config('translatable.locales'));
-        $this->app->when(ItemRepository::class)
+        $this->app
+            ->when(ItemRepository::class)
             ->needs('$locales')
             ->give(config('translatable.locales'));
 
-        $this->app->when(ItemImporter::class)
+        $this->app
+            ->when(ItemImporter::class)
             ->needs(BaseAuthorityMapper::class)
             ->give(function () {
                 return new BaseAuthorityMapper();
             });
 
-        $this->app->singleton(Frontend::class, fn () => new Frontend(FrontendEnum::WEBUMENIA));
+        $this->app->singleton(Frontend::class, fn() => new Frontend(FrontendEnum::WEBUMENIA));
+        $this->app->bind(MailChimp::class, fn() => new MailChimp(config('mailchimp.apiKey')));
     }
 
     public function boot()
@@ -77,9 +82,10 @@ public function boot()
         });
     }
 
-
     private function formatDate($expression, $format)
     {
-        return $expression? "<?php echo \Carbon\Carbon::parse($expression)->locale(App::getLocale())->isoFormat('$format'); ?>": "";
+        return $expression
+            ? "<?php echo \Carbon\Carbon::parse($expression)->locale(App::getLocale())->isoFormat('$format'); ?>"
+            : '';
     }
 }
diff --git a/routes/api.php b/routes/api.php
index ac102b56a..040386a83 100644
--- a/routes/api.php
+++ b/routes/api.php
@@ -1,11 +1,12 @@
 <?php
 
 use App\Http\Controllers\Api\ArticleController;
-use Illuminate\Support\Facades\Route;
+use App\Http\Controllers\Api\NewsletterSubscriptionController;
 use App\Http\Controllers\Api\SharedUserCollectionController;
 use App\Http\Controllers\Api\TrackFeaturedPieceClick;
 use App\Http\Controllers\Api\V1\ItemController as V1ItemController;
 use App\Http\Controllers\Api\V2\ItemController as V2ItemController;
+use Illuminate\Support\Facades\Route;
 
 /*
 |--------------------------------------------------------------------------
@@ -28,6 +29,10 @@
     ->names('api.articles')
     ->only(['show']);
 
+Route::resource('/newsletter-subscriptions', NewsletterSubscriptionController::class)->names(
+    'api.newsletter-subscriptions'
+);
+
 Route::prefix('v1')
     ->name('api.v1.')
     ->group(function () {
diff --git a/tests/Feature/Api/NewsletterSubscriptionsTest.php b/tests/Feature/Api/NewsletterSubscriptionsTest.php
new file mode 100644
index 000000000..5a68bfa53
--- /dev/null
+++ b/tests/Feature/Api/NewsletterSubscriptionsTest.php
@@ -0,0 +1,24 @@
+<?php
+
+namespace Tests\Feature\Api;
+
+use DrewM\MailChimp\MailChimp;
+use Mockery\MockInterface;
+use Tests\TestCase;
+
+class NewsletterSubscriptionsTest extends TestCase
+{
+    public function test_create()
+    {
+        $this->mock(MailChimp::class, function (MockInterface $mock) {
+            $mock->shouldReceive('post')->once();
+            $mock->shouldReceive('success')->andReturn(true);
+        });
+
+        $this->post(route('api.newsletter-subscriptions.store'), [
+            'email' => 'aa@bb.com',
+        ])
+            ->assertStatus(201)
+            ->assertCookie('newsletterSubscribedAt');
+    }
+}

From 53ed536a4a1e9f572c1e72c3e85db8b89a686831 Mon Sep 17 00:00:00 2001
From: Ernest Walzel <ernest.walzel@sng.sk>
Date: Fri, 15 Mar 2024 13:06:57 +0100
Subject: [PATCH 2/9] Livewire-free NewsletterSignupForm template

---
 resources/js/app.js                           |  1 +
 .../NewsletterSignupFormController.vue        | 32 ++++++++++
 .../newsletter-signup-form.blade.php          | 60 +++++++++++++++++++
 .../views/frontend/articles/show.blade.php    |  2 +-
 resources/views/informacie.blade.php          |  2 +-
 resources/views/kolekcia.blade.php            |  2 +-
 6 files changed, 96 insertions(+), 3 deletions(-)
 create mode 100644 resources/js/components/NewsletterSignupFormController.vue
 create mode 100644 resources/views/components/newsletter-signup-form.blade.php

diff --git a/resources/js/app.js b/resources/js/app.js
index 2941c218a..089306b9c 100644
--- a/resources/js/app.js
+++ b/resources/js/app.js
@@ -72,6 +72,7 @@ Vue.component('copy-to-clipboard-link', require('./components/CopyToClipboardLin
 Vue.component('bottom-modal', require('./components/BottomModal.vue').default);
 Vue.component('user-interaction-context', require('./components/UserInteractionContext.vue').default);
 Vue.component('livewire-vue-adaptor', require('./components/LivewireVueAdaptor.vue').default);
+Vue.component('newsletter-signup-form-controller', require('./components/NewsletterSignupFormController.vue').default);
 Vue.component('slider', require('./components/vue/slider').default);
 Vue.component('color-slider', require('./components/vue/color-slider').default);
 
diff --git a/resources/js/components/NewsletterSignupFormController.vue b/resources/js/components/NewsletterSignupFormController.vue
new file mode 100644
index 000000000..eb764fe9e
--- /dev/null
+++ b/resources/js/components/NewsletterSignupFormController.vue
@@ -0,0 +1,32 @@
+<script setup>
+import { ref } from 'vue'
+import { useApiClient } from './useApiClient'
+
+const apiClient = useApiClient()
+
+const props = defineProps(['url'])
+
+const error = ref(null)
+const success = ref(false)
+const loading = ref(false)
+
+async function submit(event) {
+    const data = new FormData(event.target)
+
+    loading.value = true
+
+    try {
+        await apiClient.post(props.url, data)
+        success.value = true
+        error.value = null
+    } catch (e) {
+        error.value = e.response.data.message
+    } finally {
+        loading.value = false
+    }
+}
+</script>
+
+<template>
+    <slot :error="error" :success="success" :loading="loading" :submit="submit"></slot>
+</template>
diff --git a/resources/views/components/newsletter-signup-form.blade.php b/resources/views/components/newsletter-signup-form.blade.php
new file mode 100644
index 000000000..bffc31e27
--- /dev/null
+++ b/resources/views/components/newsletter-signup-form.blade.php
@@ -0,0 +1,60 @@
+@props(['tracking-variant' => 'inline'])
+
+<newsletter-signup-form-controller url="{{ route('api.newsletter-subscriptions.store') }}"
+    v-slot="c">
+    <div class="row text-black">
+        <div class="col-md-6">
+            <template v-if="c.success">
+                <h3 class="text-5xl mt-4 pt-1 font-semibold animated fadeInDown visible-xs-block">
+                    {{ __('general.newsletter_sign_up.success') }}</h3>
+                <h3 class="text-center mt-5 text-6xl font-semibold animated tada fast hidden-xs">
+                    {{ __('general.newsletter_sign_up.success') }}</h3>
+            </template>
+            <template v-else-if="c.error">
+                <h3 class="text-4xl font-semibold animated headShake">
+                    {{ __('general.newsletter_sign_up.error') }}</h3>
+            </template>
+            <template v-else>
+                <h3 class="mt-2 text-3xl font-semibold visible-xs-block">
+                    {{ __('general.newsletter_sign_up.title') }}</h3>
+                <h3 class="text-4xl font-semibold hidden-xs">
+                    {{ __('general.newsletter_sign_up.title') }}</h3>
+            </template>
+        </div>
+        <div class="col-md-6">
+            <div class="row">
+                <div class="col-md-11 col-md-push-1">
+                    <div class="text-lg pb-md-1">{!! __('general.newsletter_sign_up.subtitle') !!}</div>
+
+                    <form @submit.prevent="c.submit" class="input-group mt-4">
+                        <input name="email" type="email"
+                            class="form-control bg-light no-border placeholder-black"
+                            :class="{'text-gray-500': c.success}" placeholder="@" required
+                            :readonly="c.success">
+                        <span class="input-group-btn">
+                            <button type="submit" class="btn btn-black font-light"
+                                :disabled="c.success">
+                                <template v-if="c.loading">
+                                    {{ __('general.newsletter_sign_up.button.loading') }}
+                                </template>
+                                <template v-else-if="c.success">
+                                    <i class="fa fa-check text-success"></i>
+                                    {{ __('general.newsletter_sign_up.button.success') }}
+                                </template>
+                                <template v-else>
+                                    {{ __('general.newsletter_sign_up.button.initial') }}
+                                </template>
+                                </template>
+                            </button>
+                        </span>
+                    </form>
+                    <div class="text-sm mt-3 mb-md-0 text-dark">
+                        {!! __('general.newsletter_sign_up.privacy_policy.blurb') !!}
+                        <a href="https://sng.sk/sk/sng-bratislava/stranka/gdpr" target="_blank"
+                            class="underline">{{ __('general.newsletter_sign_up.privacy_policy.link') }}</a>.
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</newsletter-signup-form-controller>
diff --git a/resources/views/frontend/articles/show.blade.php b/resources/views/frontend/articles/show.blade.php
index b1306acc7..8b3cb5e83 100644
--- a/resources/views/frontend/articles/show.blade.php
+++ b/resources/views/frontend/articles/show.blade.php
@@ -116,7 +116,7 @@
                 <div class="col-md-8 col-md-push-2">
                     <div class="bg-blue p-4 p-md-5">
                         <div class="mx-md-2">
-                            <livewire:newsletter-signup-form />
+                            <x-newsletter-signup-form />
                         </div>
                     </div>
                 </div>
diff --git a/resources/views/informacie.blade.php b/resources/views/informacie.blade.php
index 0813416ae..28780541f 100644
--- a/resources/views/informacie.blade.php
+++ b/resources/views/informacie.blade.php
@@ -109,7 +109,7 @@
     <div class="container">
         <div class="row py-5">
             <div class="col-lg-8 col-lg-offset-2">
-                <livewire:newsletter-signup-form variant="info-page" />
+                <x-newsletter-signup-form tracking-variant="info-page" />
             </div>
         </div>
     </div>
diff --git a/resources/views/kolekcia.blade.php b/resources/views/kolekcia.blade.php
index 0d6e26bad..9257ab433 100644
--- a/resources/views/kolekcia.blade.php
+++ b/resources/views/kolekcia.blade.php
@@ -163,7 +163,7 @@
                 <div class="col-md-8 col-md-push-2">
                     <div class="bg-blue p-4 p-md-5">
                         <div class="mx-md-2">
-                            <livewire:newsletter-signup-form />
+                            <x-newsletter-signup-form />
                         </div>
                     </div>
                 </div>

From 9d8220a6f01889683430f3e820bfd78601445f42 Mon Sep 17 00:00:00 2001
From: Ernest Walzel <ernest.walzel@sng.sk>
Date: Fri, 15 Mar 2024 13:30:06 +0100
Subject: [PATCH 3/9] Successful sign-up tracking

---
 .../NewsletterSignupFormController.vue        | 26 ++++++++++++++++---
 .../newsletter-signup-form.blade.php          |  4 +--
 2 files changed, 25 insertions(+), 5 deletions(-)

diff --git a/resources/js/components/NewsletterSignupFormController.vue b/resources/js/components/NewsletterSignupFormController.vue
index eb764fe9e..69d4202ad 100644
--- a/resources/js/components/NewsletterSignupFormController.vue
+++ b/resources/js/components/NewsletterSignupFormController.vue
@@ -4,7 +4,7 @@ import { useApiClient } from './useApiClient'
 
 const apiClient = useApiClient()
 
-const props = defineProps(['url'])
+const props = defineProps(['url', 'trackingVariant'])
 
 const error = ref(null)
 const success = ref(false)
@@ -17,16 +17,36 @@ async function submit(event) {
 
     try {
         await apiClient.post(props.url, data)
-        success.value = true
         error.value = null
+        success.value = true
+        track('signupSuccessful', props.trackingVariant)
     } catch (e) {
         error.value = e.response.data.message
     } finally {
         loading.value = false
     }
 }
+
+function track(action, label = undefined) {
+    if (!window?.dataLayer) {
+        return
+    }
+
+    window.dataLayer.push({
+        event: 'NewsletterSignupFormEvent',
+        eventCategory: 'NewsletterSignupForm',
+        eventAction: action,
+        eventLabel: label,
+    })
+}
 </script>
 
 <template>
-    <slot :error="error" :success="success" :loading="loading" :submit="submit"></slot>
+    <slot
+        :error="error"
+        :success="success"
+        :loading="loading"
+        :submit="submit"
+        :track="track"
+    ></slot>
 </template>
diff --git a/resources/views/components/newsletter-signup-form.blade.php b/resources/views/components/newsletter-signup-form.blade.php
index bffc31e27..29482eae2 100644
--- a/resources/views/components/newsletter-signup-form.blade.php
+++ b/resources/views/components/newsletter-signup-form.blade.php
@@ -1,7 +1,7 @@
-@props(['tracking-variant' => 'inline'])
+@props(['trackingVariant' => 'inline'])
 
 <newsletter-signup-form-controller url="{{ route('api.newsletter-subscriptions.store') }}"
-    v-slot="c">
+    tracking-variant="{{ $trackingVariant }}" v-slot="c">
     <div class="row text-black">
         <div class="col-md-6">
             <template v-if="c.success">

From 3f0be035ca6b483f755034fcc796c5299f7f507a Mon Sep 17 00:00:00 2001
From: Ernest Walzel <ernest.walzel@sng.sk>
Date: Fri, 15 Mar 2024 14:01:56 +0100
Subject: [PATCH 4/9] Livewire-free newsletter sign-up form as bottom modal

---
 app/Http/Middleware/EncryptCookies.php        |  4 +++-
 .../NewsletterSignupFormController.vue        | 15 ++----------
 .../useNewsletterSignupFormEvent.js           | 16 +++++++++++++
 ...sletter-signup-form-bottom-modal.blade.php | 24 +++++++++++++++++++
 .../views/frontend/articles/show.blade.php    |  2 +-
 resources/views/kolekcia.blade.php            |  2 +-
 6 files changed, 47 insertions(+), 16 deletions(-)
 create mode 100644 resources/js/components/composables/useNewsletterSignupFormEvent.js
 create mode 100644 resources/views/components/newsletter-signup-form-bottom-modal.blade.php

diff --git a/app/Http/Middleware/EncryptCookies.php b/app/Http/Middleware/EncryptCookies.php
index 3aa15f8dd..7ec1df313 100644
--- a/app/Http/Middleware/EncryptCookies.php
+++ b/app/Http/Middleware/EncryptCookies.php
@@ -12,6 +12,8 @@ class EncryptCookies extends BaseEncrypter
      * @var array
      */
     protected $except = [
-        //
+        // TODO replace newsletter cookies with encrypted cookies
+        'newsletterSubscribedAt',
+        'newsletterSignupModalDismissedAt',
     ];
 }
diff --git a/resources/js/components/NewsletterSignupFormController.vue b/resources/js/components/NewsletterSignupFormController.vue
index 69d4202ad..a0592c3e6 100644
--- a/resources/js/components/NewsletterSignupFormController.vue
+++ b/resources/js/components/NewsletterSignupFormController.vue
@@ -1,8 +1,10 @@
 <script setup>
 import { ref } from 'vue'
 import { useApiClient } from './useApiClient'
+import { useNewsletterSignupFormEvent } from './composables/useNewsletterSignupFormEvent'
 
 const apiClient = useApiClient()
+const { track } = useNewsletterSignupFormEvent()
 
 const props = defineProps(['url', 'trackingVariant'])
 
@@ -26,19 +28,6 @@ async function submit(event) {
         loading.value = false
     }
 }
-
-function track(action, label = undefined) {
-    if (!window?.dataLayer) {
-        return
-    }
-
-    window.dataLayer.push({
-        event: 'NewsletterSignupFormEvent',
-        eventCategory: 'NewsletterSignupForm',
-        eventAction: action,
-        eventLabel: label,
-    })
-}
 </script>
 
 <template>
diff --git a/resources/js/components/composables/useNewsletterSignupFormEvent.js b/resources/js/components/composables/useNewsletterSignupFormEvent.js
new file mode 100644
index 000000000..9719ff463
--- /dev/null
+++ b/resources/js/components/composables/useNewsletterSignupFormEvent.js
@@ -0,0 +1,16 @@
+export function useNewsletterSignupFormEvent() {
+    function track(action, label = undefined) {
+        if (!window?.dataLayer) {
+            return
+        }
+
+        window.dataLayer.push({
+            event: 'NewsletterSignupFormEvent',
+            eventCategory: 'NewsletterSignupForm',
+            eventAction: action,
+            eventLabel: label,
+        })
+    }
+
+    return { track }
+}
diff --git a/resources/views/components/newsletter-signup-form-bottom-modal.blade.php b/resources/views/components/newsletter-signup-form-bottom-modal.blade.php
new file mode 100644
index 000000000..81147cca9
--- /dev/null
+++ b/resources/views/components/newsletter-signup-form-bottom-modal.blade.php
@@ -0,0 +1,24 @@
+@props(['openOnScrolledPercent'])
+
+@unless(Cookie::get('newsletterSubscribedAt') || Cookie::get('newsletterSignupModalDismissedAt'))
+    <user-interaction-context v-slot="interaction">
+        <bottom-modal
+            :show="interaction.maxScrolledPercent >= {{ $openOnScrolledPercent }} && interaction.timeSpentSeconds >= 1"
+            show {{-- @open="c.onOpen" @close="c.onDismiss" --}}>
+            <div class="row py-5">
+                <div class="visible-lg-block col-lg-1 col-lg-offset-2 text-right pl-0 pt-4">
+                    <svg viewBox="0 0 101 110" fill="none" xmlns="http://www.w3.org/2000/svg">
+                        <rect x="3" y="3" width="94.7368" height="104" stroke="black"
+                            stroke-width="6" />
+                        <rect x="21.5" y="20" width="40" height="40" fill="black" />
+                        <rect x="47.8652" y="72.7769" width="20" height="20"
+                            transform="rotate(-20 47.8652 72.7769)" fill="black" />
+                    </svg>
+                </div>
+                <div class="col-lg-7 pr-lg-0 pl-lg-2">
+                    <x-newsletter-signup-form tracking-variant="bottom-modal" />
+                </div>
+            </div>
+        </bottom-modal>
+    </user-interaction-context>
+@endunless
diff --git a/resources/views/frontend/articles/show.blade.php b/resources/views/frontend/articles/show.blade.php
index 8b3cb5e83..591c2499c 100644
--- a/resources/views/frontend/articles/show.blade.php
+++ b/resources/views/frontend/articles/show.blade.php
@@ -126,7 +126,7 @@
     </div>
 </section>
 
-<livewire:newsletter-signup-form-bottom-modal open-on-scrolled-percent="40" />
+<x-newsletter-signup-form-bottom-modal open-on-scrolled-percent="40" />
 
 {{--
 mapa??
diff --git a/resources/views/kolekcia.blade.php b/resources/views/kolekcia.blade.php
index 9257ab433..a5d948cf2 100644
--- a/resources/views/kolekcia.blade.php
+++ b/resources/views/kolekcia.blade.php
@@ -173,7 +173,7 @@
     </div>
 </section>
 
-<livewire:newsletter-signup-form-bottom-modal open-on-scrolled-percent="30" />
+<x-newsletter-signup-form-bottom-modal open-on-scrolled-percent="30" />
 @stop
 
 @section('javascript')

From 60703394db78119681be66d6c823def761d58f8d Mon Sep 17 00:00:00 2001
From: Ernest Walzel <ernest.walzel@sng.sk>
Date: Fri, 15 Mar 2024 19:54:43 +0100
Subject: [PATCH 5/9] Tracking bottom modal opening and dismissal

---
 .../Api/NewsletterSubscriptionController.php  | 11 ++++
 resources/js/app.js                           |  1 +
 ...sletterSignupFormBottomModalController.vue | 62 +++++++++++++++++++
 ...sletter-signup-form-bottom-modal.blade.php | 10 +--
 routes/api.php                                |  4 ++
 .../Api/NewsletterSubscriptionsTest.php       |  6 ++
 6 files changed, 89 insertions(+), 5 deletions(-)
 create mode 100644 resources/js/components/NewsletterSignupFormBottomModalController.vue

diff --git a/app/Http/Controllers/Api/NewsletterSubscriptionController.php b/app/Http/Controllers/Api/NewsletterSubscriptionController.php
index 7998ebcda..05a176e4b 100644
--- a/app/Http/Controllers/Api/NewsletterSubscriptionController.php
+++ b/app/Http/Controllers/Api/NewsletterSubscriptionController.php
@@ -43,4 +43,15 @@ public function store(Request $request, MailChimp $mailChimp)
                 ->diffInMinutes()
         );
     }
+
+    public function storeDismissal()
+    {
+        return response('')->cookie(
+            'newsletterSignupModalDismissedAt',
+            Date::now()->toIso8601String(),
+            Date::now()
+                ->addDays(30)
+                ->diffInMinutes()
+        );
+    }
 }
diff --git a/resources/js/app.js b/resources/js/app.js
index 089306b9c..c7990e02e 100644
--- a/resources/js/app.js
+++ b/resources/js/app.js
@@ -73,6 +73,7 @@ Vue.component('bottom-modal', require('./components/BottomModal.vue').default);
 Vue.component('user-interaction-context', require('./components/UserInteractionContext.vue').default);
 Vue.component('livewire-vue-adaptor', require('./components/LivewireVueAdaptor.vue').default);
 Vue.component('newsletter-signup-form-controller', require('./components/NewsletterSignupFormController.vue').default);
+Vue.component('newsletter-signup-form-bottom-modal-controller', require('./components/NewsletterSignupFormBottomModalController.vue').default);
 Vue.component('slider', require('./components/vue/slider').default);
 Vue.component('color-slider', require('./components/vue/color-slider').default);
 
diff --git a/resources/js/components/NewsletterSignupFormBottomModalController.vue b/resources/js/components/NewsletterSignupFormBottomModalController.vue
new file mode 100644
index 000000000..f70b9e0fc
--- /dev/null
+++ b/resources/js/components/NewsletterSignupFormBottomModalController.vue
@@ -0,0 +1,62 @@
+<script setup>
+import { ref, onMounted, onBeforeUnmount } from 'vue'
+import { debounce } from 'debounce'
+import { computed } from 'vue'
+import { useNewsletterSignupFormEvent } from './composables/useNewsletterSignupFormEvent'
+import { useApiClient } from './useApiClient'
+
+const { track } = useNewsletterSignupFormEvent()
+const apiClient = useApiClient()
+
+const maxScrolledPercent = ref(0)
+const timeSpentInSeconds = ref(0)
+const timeSpentInterval = ref(null)
+
+const TimeSpentRefreshRate = 5 // seconds
+const ShowOnTimeSpent = 30 // seconds
+
+const onScrollDebounced = debounce(onScroll, 500)
+
+const props = defineProps({ showOnScrolledPercent: Number, dismissalUrl: String })
+
+onMounted(() => {
+    window.addEventListener('scroll', onScrollDebounced)
+    timeSpentInterval.value = setInterval(updateTimeSpent, TimeSpentRefreshRate * 1000)
+})
+
+onBeforeUnmount(() => {
+    clearInterval(timeSpentInterval.value)
+    window.removeEventListener('scroll', onScrollDebounced)
+})
+
+function onScroll() {
+    const percentScrolled = Math.floor(
+        (window.scrollY / (document.body.scrollHeight - document.body.clientHeight)) * 100
+    )
+    maxScrolledPercent.value = Math.max(maxScrolledPercent.value, percentScrolled)
+}
+
+function updateTimeSpent() {
+    timeSpentInSeconds.value += TimeSpentRefreshRate
+}
+
+const show = computed(() => {
+    return (
+        maxScrolledPercent.value >= props.showOnScrolledPercent ||
+        timeSpentInSeconds.value >= ShowOnTimeSpent
+    )
+})
+
+function onOpen() {
+    track('modalOpen')
+}
+
+function onDismiss() {
+    track('modalDismissed')
+    apiClient.post(props.dismissalUrl)
+}
+</script>
+
+<template>
+    <slot :show="show" :onOpen="onOpen" :onDismiss="onDismiss"></slot>
+</template>
diff --git a/resources/views/components/newsletter-signup-form-bottom-modal.blade.php b/resources/views/components/newsletter-signup-form-bottom-modal.blade.php
index 81147cca9..d4770be27 100644
--- a/resources/views/components/newsletter-signup-form-bottom-modal.blade.php
+++ b/resources/views/components/newsletter-signup-form-bottom-modal.blade.php
@@ -1,10 +1,10 @@
 @props(['openOnScrolledPercent'])
 
 @unless(Cookie::get('newsletterSubscribedAt') || Cookie::get('newsletterSignupModalDismissedAt'))
-    <user-interaction-context v-slot="interaction">
-        <bottom-modal
-            :show="interaction.maxScrolledPercent >= {{ $openOnScrolledPercent }} && interaction.timeSpentSeconds >= 1"
-            show {{-- @open="c.onOpen" @close="c.onDismiss" --}}>
+    <newsletter-signup-form-bottom-modal-controller
+        dismissal-url="{{ route('api.newsletter-subscriptions.dismiss') }}"
+        :show-on-scrolled-percent="{{ $openOnScrolledPercent }}" v-slot="c">
+        <bottom-modal :show="c.show" @open="c.onOpen" @close="c.onDismiss">
             <div class="row py-5">
                 <div class="visible-lg-block col-lg-1 col-lg-offset-2 text-right pl-0 pt-4">
                     <svg viewBox="0 0 101 110" fill="none" xmlns="http://www.w3.org/2000/svg">
@@ -20,5 +20,5 @@
                 </div>
             </div>
         </bottom-modal>
-    </user-interaction-context>
+    </newsletter-signup-form-bottom-modal-controller>
 @endunless
diff --git a/routes/api.php b/routes/api.php
index 040386a83..f8107d18c 100644
--- a/routes/api.php
+++ b/routes/api.php
@@ -32,6 +32,10 @@
 Route::resource('/newsletter-subscriptions', NewsletterSubscriptionController::class)->names(
     'api.newsletter-subscriptions'
 );
+Route::post('/newsletter-subscriptions/dismissals', [
+    NewsletterSubscriptionController::class,
+    'storeDismissal',
+])->name('api.newsletter-subscriptions.dismiss');
 
 Route::prefix('v1')
     ->name('api.v1.')
diff --git a/tests/Feature/Api/NewsletterSubscriptionsTest.php b/tests/Feature/Api/NewsletterSubscriptionsTest.php
index 5a68bfa53..3a1694f3a 100644
--- a/tests/Feature/Api/NewsletterSubscriptionsTest.php
+++ b/tests/Feature/Api/NewsletterSubscriptionsTest.php
@@ -21,4 +21,10 @@ public function test_create()
             ->assertStatus(201)
             ->assertCookie('newsletterSubscribedAt');
     }
+    public function test_dismissal()
+    {
+        $this->post(route('api.newsletter-subscriptions.dismiss'))
+            ->assertSuccessful()
+            ->assertCookie('newsletterSignupModalDismissedAt');
+    }
 }

From 34b930857605da2f54d45110532b31e13aee8501 Mon Sep 17 00:00:00 2001
From: Ernest Walzel <ernest.walzel@sng.sk>
Date: Fri, 15 Mar 2024 19:58:19 +0100
Subject: [PATCH 6/9] Move useApiClient into composables

---
 .../js/components/NewsletterSignupFormBottomModalController.vue | 2 +-
 resources/js/components/NewsletterSignupFormController.vue      | 2 +-
 resources/js/components/catalog-new/ItemsFilterController.vue   | 2 +-
 resources/js/components/catalog-new/useTitleUpdater.js          | 2 +-
 resources/js/components/{ => composables}/useApiClient.js       | 0
 5 files changed, 4 insertions(+), 4 deletions(-)
 rename resources/js/components/{ => composables}/useApiClient.js (100%)

diff --git a/resources/js/components/NewsletterSignupFormBottomModalController.vue b/resources/js/components/NewsletterSignupFormBottomModalController.vue
index f70b9e0fc..224ee465d 100644
--- a/resources/js/components/NewsletterSignupFormBottomModalController.vue
+++ b/resources/js/components/NewsletterSignupFormBottomModalController.vue
@@ -3,7 +3,7 @@ import { ref, onMounted, onBeforeUnmount } from 'vue'
 import { debounce } from 'debounce'
 import { computed } from 'vue'
 import { useNewsletterSignupFormEvent } from './composables/useNewsletterSignupFormEvent'
-import { useApiClient } from './useApiClient'
+import { useApiClient } from './composables/useApiClient'
 
 const { track } = useNewsletterSignupFormEvent()
 const apiClient = useApiClient()
diff --git a/resources/js/components/NewsletterSignupFormController.vue b/resources/js/components/NewsletterSignupFormController.vue
index a0592c3e6..6778d0742 100644
--- a/resources/js/components/NewsletterSignupFormController.vue
+++ b/resources/js/components/NewsletterSignupFormController.vue
@@ -1,6 +1,6 @@
 <script setup>
 import { ref } from 'vue'
-import { useApiClient } from './useApiClient'
+import { useApiClient } from './composables/useApiClient'
 import { useNewsletterSignupFormEvent } from './composables/useNewsletterSignupFormEvent'
 
 const apiClient = useApiClient()
diff --git a/resources/js/components/catalog-new/ItemsFilterController.vue b/resources/js/components/catalog-new/ItemsFilterController.vue
index bd436a49b..5b2262c31 100644
--- a/resources/js/components/catalog-new/ItemsFilterController.vue
+++ b/resources/js/components/catalog-new/ItemsFilterController.vue
@@ -1,6 +1,6 @@
 <script>
 import qs from 'qs'
-import { useApiClient } from '../useApiClient'
+import { useApiClient } from '../composables/useApiClient'
 import { useTitleUpdater } from './useTitleUpdater'
 
 function getParsedFilterFromUrl() {
diff --git a/resources/js/components/catalog-new/useTitleUpdater.js b/resources/js/components/catalog-new/useTitleUpdater.js
index 8c69867e6..1ddecb128 100644
--- a/resources/js/components/catalog-new/useTitleUpdater.js
+++ b/resources/js/components/catalog-new/useTitleUpdater.js
@@ -1,5 +1,5 @@
 import { onMounted, ref } from 'vue'
-import { useApiClient } from '../useApiClient'
+import { useApiClient } from '../composables/useApiClient'
 
 export function useTitleUpdater(staticPartSeparator) {
     const staticPart = ref('')
diff --git a/resources/js/components/useApiClient.js b/resources/js/components/composables/useApiClient.js
similarity index 100%
rename from resources/js/components/useApiClient.js
rename to resources/js/components/composables/useApiClient.js

From 4e2b083ce2dfa6a947d68aea8afa4ee0b5224b5b Mon Sep 17 00:00:00 2001
From: Ernest Walzel <ernest.walzel@sng.sk>
Date: Fri, 15 Mar 2024 20:07:23 +0100
Subject: [PATCH 7/9] Re-organize

---
 resources/js/app.js                                         | 4 ++--
 .../BottomModalController.vue}                              | 6 +++---
 .../FormController.vue}                                     | 6 +++---
 .../useFormEvent.js}                                        | 2 +-
 .../newsletter-signup-form-bottom-modal.blade.php           | 4 ++--
 resources/views/components/newsletter-signup-form.blade.php | 4 ++--
 6 files changed, 13 insertions(+), 13 deletions(-)
 rename resources/js/components/{NewsletterSignupFormBottomModalController.vue => newsletter-signup/BottomModalController.vue} (88%)
 rename resources/js/components/{NewsletterSignupFormController.vue => newsletter-signup/FormController.vue} (79%)
 rename resources/js/components/{composables/useNewsletterSignupFormEvent.js => newsletter-signup/useFormEvent.js} (87%)

diff --git a/resources/js/app.js b/resources/js/app.js
index c7990e02e..290589d68 100644
--- a/resources/js/app.js
+++ b/resources/js/app.js
@@ -72,8 +72,8 @@ Vue.component('copy-to-clipboard-link', require('./components/CopyToClipboardLin
 Vue.component('bottom-modal', require('./components/BottomModal.vue').default);
 Vue.component('user-interaction-context', require('./components/UserInteractionContext.vue').default);
 Vue.component('livewire-vue-adaptor', require('./components/LivewireVueAdaptor.vue').default);
-Vue.component('newsletter-signup-form-controller', require('./components/NewsletterSignupFormController.vue').default);
-Vue.component('newsletter-signup-form-bottom-modal-controller', require('./components/NewsletterSignupFormBottomModalController.vue').default);
+Vue.component('newsletter-signup.form-controller', require('./components/newsletter-signup/FormController.vue').default);
+Vue.component('newsletter-signup.bottom-modal-controller', require('./components/newsletter-signup/BottomModalController.vue').default);
 Vue.component('slider', require('./components/vue/slider').default);
 Vue.component('color-slider', require('./components/vue/color-slider').default);
 
diff --git a/resources/js/components/NewsletterSignupFormBottomModalController.vue b/resources/js/components/newsletter-signup/BottomModalController.vue
similarity index 88%
rename from resources/js/components/NewsletterSignupFormBottomModalController.vue
rename to resources/js/components/newsletter-signup/BottomModalController.vue
index 224ee465d..ab0a02129 100644
--- a/resources/js/components/NewsletterSignupFormBottomModalController.vue
+++ b/resources/js/components/newsletter-signup/BottomModalController.vue
@@ -2,10 +2,10 @@
 import { ref, onMounted, onBeforeUnmount } from 'vue'
 import { debounce } from 'debounce'
 import { computed } from 'vue'
-import { useNewsletterSignupFormEvent } from './composables/useNewsletterSignupFormEvent'
-import { useApiClient } from './composables/useApiClient'
+import { useApiClient } from '../composables/useApiClient'
+import { useFormEvent } from './useFormEvent'
 
-const { track } = useNewsletterSignupFormEvent()
+const { track } = useFormEvent()
 const apiClient = useApiClient()
 
 const maxScrolledPercent = ref(0)
diff --git a/resources/js/components/NewsletterSignupFormController.vue b/resources/js/components/newsletter-signup/FormController.vue
similarity index 79%
rename from resources/js/components/NewsletterSignupFormController.vue
rename to resources/js/components/newsletter-signup/FormController.vue
index 6778d0742..f1dc8c9bc 100644
--- a/resources/js/components/NewsletterSignupFormController.vue
+++ b/resources/js/components/newsletter-signup/FormController.vue
@@ -1,10 +1,10 @@
 <script setup>
 import { ref } from 'vue'
-import { useApiClient } from './composables/useApiClient'
-import { useNewsletterSignupFormEvent } from './composables/useNewsletterSignupFormEvent'
+import { useApiClient } from '../composables/useApiClient'
+import { useFormEvent } from './useFormEvent'
 
 const apiClient = useApiClient()
-const { track } = useNewsletterSignupFormEvent()
+const { track } = useFormEvent()
 
 const props = defineProps(['url', 'trackingVariant'])
 
diff --git a/resources/js/components/composables/useNewsletterSignupFormEvent.js b/resources/js/components/newsletter-signup/useFormEvent.js
similarity index 87%
rename from resources/js/components/composables/useNewsletterSignupFormEvent.js
rename to resources/js/components/newsletter-signup/useFormEvent.js
index 9719ff463..bc46b3b47 100644
--- a/resources/js/components/composables/useNewsletterSignupFormEvent.js
+++ b/resources/js/components/newsletter-signup/useFormEvent.js
@@ -1,4 +1,4 @@
-export function useNewsletterSignupFormEvent() {
+export function useFormEvent() {
     function track(action, label = undefined) {
         if (!window?.dataLayer) {
             return
diff --git a/resources/views/components/newsletter-signup-form-bottom-modal.blade.php b/resources/views/components/newsletter-signup-form-bottom-modal.blade.php
index d4770be27..36dd615f9 100644
--- a/resources/views/components/newsletter-signup-form-bottom-modal.blade.php
+++ b/resources/views/components/newsletter-signup-form-bottom-modal.blade.php
@@ -1,7 +1,7 @@
 @props(['openOnScrolledPercent'])
 
 @unless(Cookie::get('newsletterSubscribedAt') || Cookie::get('newsletterSignupModalDismissedAt'))
-    <newsletter-signup-form-bottom-modal-controller
+    <newsletter-signup.bottom-modal-controller
         dismissal-url="{{ route('api.newsletter-subscriptions.dismiss') }}"
         :show-on-scrolled-percent="{{ $openOnScrolledPercent }}" v-slot="c">
         <bottom-modal :show="c.show" @open="c.onOpen" @close="c.onDismiss">
@@ -20,5 +20,5 @@
                 </div>
             </div>
         </bottom-modal>
-    </newsletter-signup-form-bottom-modal-controller>
+    </newsletter-signup.bottom-modal-controller>
 @endunless
diff --git a/resources/views/components/newsletter-signup-form.blade.php b/resources/views/components/newsletter-signup-form.blade.php
index 29482eae2..c7cbe9264 100644
--- a/resources/views/components/newsletter-signup-form.blade.php
+++ b/resources/views/components/newsletter-signup-form.blade.php
@@ -1,6 +1,6 @@
 @props(['trackingVariant' => 'inline'])
 
-<newsletter-signup-form-controller url="{{ route('api.newsletter-subscriptions.store') }}"
+<newsletter-signup.form-controller v-cloak url="{{ route('api.newsletter-subscriptions.store') }}"
     tracking-variant="{{ $trackingVariant }}" v-slot="c">
     <div class="row text-black">
         <div class="col-md-6">
@@ -57,4 +57,4 @@ class="underline">{{ __('general.newsletter_sign_up.privacy_policy.link') }}</a>
             </div>
         </div>
     </div>
-</newsletter-signup-form-controller>
+</newsletter-signup.form-controller>

From 39d849d88957540c0cc0b2ba91404a551bbb0dd9 Mon Sep 17 00:00:00 2001
From: Ernest Walzel <ernest.walzel@sng.sk>
Date: Fri, 15 Mar 2024 20:10:19 +0100
Subject: [PATCH 8/9] Remove Livewire version of newsletter sign-up forms

---
 app/Http/Livewire/NewsletterSignupForm.php    | 60 -------------------
 .../NewsletterSignupFormBottomModal.php       | 34 -----------
 resources/js/app.js                           |  2 -
 .../js/components/LivewireVueAdaptor.vue      | 24 --------
 .../newsletter-signup-form-tracker.js         |  8 ---
 ...sletter-signup-form-bottom-modal.blade.php | 26 --------
 .../livewire/newsletter-signup-form.blade.php | 47 ---------------
 7 files changed, 201 deletions(-)
 delete mode 100644 app/Http/Livewire/NewsletterSignupForm.php
 delete mode 100644 app/Http/Livewire/NewsletterSignupFormBottomModal.php
 delete mode 100644 resources/js/components/LivewireVueAdaptor.vue
 delete mode 100644 resources/js/components/newsletter-signup-form-tracker.js
 delete mode 100644 resources/views/livewire/newsletter-signup-form-bottom-modal.blade.php
 delete mode 100644 resources/views/livewire/newsletter-signup-form.blade.php

diff --git a/app/Http/Livewire/NewsletterSignupForm.php b/app/Http/Livewire/NewsletterSignupForm.php
deleted file mode 100644
index 49b8d0975..000000000
--- a/app/Http/Livewire/NewsletterSignupForm.php
+++ /dev/null
@@ -1,60 +0,0 @@
-<?php
-
-namespace App\Http\Livewire;
-
-use DrewM\MailChimp\MailChimp;
-use Illuminate\Support\Facades\Cookie;
-use Illuminate\Support\Facades\Date;
-use Livewire\Component;
-
-class NewsletterSignupForm extends Component
-{
-    public $email;
-    public string $variant = 'inline';
-    public bool $success = false;
-
-    protected $rules = [
-        'email' => 'required|email',
-    ];
-
-    public function subscribe()
-    {
-        $this->validate();
-        $mailChimp = new MailChimp(config('mailchimp.apiKey'));
-        $listId = config('mailchimp.lists.webumenia-newsletter.id');
-
-        $mailChimp->post("lists/{$listId}/members", [
-            'email_address' => $this->email,
-            'status' => 'pending',
-            'email_type' => 'html',
-            'marketing_permissions' => [
-                [
-                    'marketing_permission_id' => config(
-                        'mailchimp.lists.webumenia-newsletter.marketing_permissions.default'
-                    ),
-                    'enabled' => true,
-                ],
-            ],
-        ]);
-
-        if (!$mailChimp->success()) {
-            $this->addError('subscription', $mailChimp->getLastError());
-            return;
-        }
-
-        $this->success = true;
-        Cookie::queue(
-            'newsletterSubscribedAt',
-            Date::now()->toIso8601String(),
-            Date::now()
-                ->addYears(10)
-                ->diffInMinutes()
-        );
-        $this->emit('trackNewsletterSignup', 'signupSuccessful', $this->variant);
-    }
-
-    public function render()
-    {
-        return view('livewire.newsletter-signup-form');
-    }
-}
diff --git a/app/Http/Livewire/NewsletterSignupFormBottomModal.php b/app/Http/Livewire/NewsletterSignupFormBottomModal.php
deleted file mode 100644
index a8cf1143e..000000000
--- a/app/Http/Livewire/NewsletterSignupFormBottomModal.php
+++ /dev/null
@@ -1,34 +0,0 @@
-<?php
-
-namespace App\Http\Livewire;
-
-use Illuminate\Support\Facades\Cookie;
-use Illuminate\Support\Facades\Date;
-use Livewire\Component;
-
-class NewsletterSignupFormBottomModal extends Component
-{
-    public int $openOnScrolledPercent = 0;
-
-    public function onOpen()
-    {
-        $this->emit('trackNewsletterSignup', 'modalOpen');
-    }
-
-    public function onDismissed()
-    {
-        Cookie::queue(
-            'newsletterSignupModalDismissedAt',
-             Date::now()->toIso8601String(),
-             Date::now()->addDays(30)->diffInMinutes()
-        );
-        $this->emit('trackNewsletterSignup', 'modalDismissed');
-    }
-
-    public function render()
-    {
-        if (Cookie::has('newsletterSubscribedAt')) return '';
-        if (Cookie::has('newsletterSignupModalDismissedAt')) return '';
-        return view('livewire.newsletter-signup-form-bottom-modal');
-    }
-}
diff --git a/resources/js/app.js b/resources/js/app.js
index 290589d68..64873c8cb 100644
--- a/resources/js/app.js
+++ b/resources/js/app.js
@@ -18,7 +18,6 @@ require('jquery.easing')
 // Components
 require('./components/searchbar')
 require('./components/clipboard-button')
-require('./components/newsletter-signup-form-tracker')
 
 // Vue components
 import Vue from 'vue'
@@ -71,7 +70,6 @@ Vue.component('copy-to-clipboard-group', require('./components/CopyToClipboardGr
 Vue.component('copy-to-clipboard-link', require('./components/CopyToClipboardLink.vue').default);
 Vue.component('bottom-modal', require('./components/BottomModal.vue').default);
 Vue.component('user-interaction-context', require('./components/UserInteractionContext.vue').default);
-Vue.component('livewire-vue-adaptor', require('./components/LivewireVueAdaptor.vue').default);
 Vue.component('newsletter-signup.form-controller', require('./components/newsletter-signup/FormController.vue').default);
 Vue.component('newsletter-signup.bottom-modal-controller', require('./components/newsletter-signup/BottomModalController.vue').default);
 Vue.component('slider', require('./components/vue/slider').default);
diff --git a/resources/js/components/LivewireVueAdaptor.vue b/resources/js/components/LivewireVueAdaptor.vue
deleted file mode 100644
index 9cc4ca8a1..000000000
--- a/resources/js/components/LivewireVueAdaptor.vue
+++ /dev/null
@@ -1,24 +0,0 @@
-<template>
-    <div >
-        <slot :call="call"></slot>
-    </div>
-</template>
-
-<script>
-
-// Component for passing messages between Vue and Livewire.
-// Must be placed at root of Livewire component (so that it gets wire:id attribute)
-
-export default {
-    methods: {
-        call(methodName, ...args) {
-            this.target[methodName](args)
-        }
-    },
-    computed: {
-        target() {
-            return window.livewire.find(this.$attrs['wire:id'])
-        }
-    }
-}
-</script>
\ No newline at end of file
diff --git a/resources/js/components/newsletter-signup-form-tracker.js b/resources/js/components/newsletter-signup-form-tracker.js
deleted file mode 100644
index c00b06c06..000000000
--- a/resources/js/components/newsletter-signup-form-tracker.js
+++ /dev/null
@@ -1,8 +0,0 @@
-Livewire.on('trackNewsletterSignup', function (eventAction, eventLabel) {
-    window.dataLayer.push({
-        'event': 'NewsletterSignupFormEvent',
-        'eventCategory': 'NewsletterSignupForm',
-        'eventAction': eventAction,
-        'eventLabel': eventLabel
-    })
-})
\ No newline at end of file
diff --git a/resources/views/livewire/newsletter-signup-form-bottom-modal.blade.php b/resources/views/livewire/newsletter-signup-form-bottom-modal.blade.php
deleted file mode 100644
index 56abc983d..000000000
--- a/resources/views/livewire/newsletter-signup-form-bottom-modal.blade.php
+++ /dev/null
@@ -1,26 +0,0 @@
-<livewire-vue-adaptor v-slot="lw">
-    <user-interaction-context v-slot="interaction">
-        <bottom-modal
-            :show="
-                interaction.maxScrolledPercent >= {{ $openOnScrolledPercent }}
-                && interaction.timeSpentSeconds >= 30
-            "
-            {{-- TODO tracking disabled WEBUMENIA-2042 --}}
-            {{-- v-on:open="lw.call('onOpen')" --}}
-            {{-- v-on:close="lw.call('onDismissed')" --}}
-        >
-            <div class="row py-5">
-                <div class="visible-lg-block col-lg-1 col-lg-offset-2 text-right pl-0 pt-4">
-                    <svg viewBox="0 0 101 110" fill="none" xmlns="http://www.w3.org/2000/svg">
-                        <rect x="3" y="3" width="94.7368" height="104" stroke="black" stroke-width="6"/>
-                        <rect x="21.5" y="20" width="40" height="40" fill="black"/>
-                        <rect x="47.8652" y="72.7769" width="20" height="20" transform="rotate(-20 47.8652 72.7769)" fill="black"/>
-                    </svg>
-                </div>
-                <div class="col-lg-7 pr-lg-0 pl-lg-2">
-                    <livewire:newsletter-signup-form variant="bottom-modal" />
-                </div>
-            </div>
-        </bottom-modal>
-    </user-interaction-context>
-</livewire-vue-adaptor>
\ No newline at end of file
diff --git a/resources/views/livewire/newsletter-signup-form.blade.php b/resources/views/livewire/newsletter-signup-form.blade.php
deleted file mode 100644
index fa549bdd2..000000000
--- a/resources/views/livewire/newsletter-signup-form.blade.php
+++ /dev/null
@@ -1,47 +0,0 @@
-<div class="row text-black">
-    <div class="col-md-6">
-        @if ($success)
-            <h3 class="text-5xl mt-4 pt-1 font-semibold animated fadeInDown visible-xs-block">{{ __('general.newsletter_sign_up.success') }}</h3>
-            <h3 class="text-center mt-5 text-6xl font-semibold animated tada fast hidden-xs">{{ __('general.newsletter_sign_up.success') }}</h3>
-        @elseif ($errors->any())
-            <h3 class="text-4xl font-semibold animated headShake">{{ __('general.newsletter_sign_up.error') }}</h3>
-        @else
-            <h3 class="mt-2 text-3xl font-semibold visible-xs-block">{{ __('general.newsletter_sign_up.title') }}</h3>
-            <h3 class="text-4xl font-semibold hidden-xs">{{ __('general.newsletter_sign_up.title') }}</h3>
-        @endif
-    </div>
-    <div class="col-md-6">
-        <div class="row">
-            <div class="col-md-11 col-md-push-1">
-                <div class="text-lg pb-md-1">{!! __('general.newsletter_sign_up.subtitle') !!}</div>
-
-                <form wire:submit.prevent="subscribe" class="input-group mt-4">
-                    <input
-                        type="email"
-                        class="form-control bg-light no-border placeholder-black {{ $success ? 'text-gray-500' : '' }}"
-                        placeholder="@"
-                        required
-                        @if ($success) readonly @endif
-                        wire:model.defer="email"
-                    >
-                    <span class="input-group-btn">
-                        <button type="submit" class="btn btn-black font-light" @if ($success) disabled @endif>
-                            <span wire:loading.remove>
-                                @if ($success)
-                                    <i class="fa fa-check text-success"></i> {{ __('general.newsletter_sign_up.button.success') }}
-                                @else
-                                    {{ __('general.newsletter_sign_up.button.initial') }}
-                                @endif
-                            </span>
-                            <span wire:loading>{{ __('general.newsletter_sign_up.button.loading') }}</span>
-                        </button>
-                    </span>
-                </form>
-                <div class="text-sm mt-3 mb-md-0 text-dark">
-                    {!! __('general.newsletter_sign_up.privacy_policy.blurb') !!}
-                    <a href="https://sng.sk/sk/sng-bratislava/stranka/gdpr" target="_blank" class="underline">{{ __('general.newsletter_sign_up.privacy_policy.link') }}</a>.
-                </div>
-            </div>
-        </div>
-    </div>
-</div>
\ No newline at end of file

From c7c867e96ed9d1e9918ea3280e2b1406f8145f47 Mon Sep 17 00:00:00 2001
From: Ernest Walzel <ernest.walzel@sng.sk>
Date: Fri, 15 Mar 2024 20:25:44 +0100
Subject: [PATCH 9/9] Remove Livewire dependencies

---
 composer.json                            |  1 -
 composer.lock                            | 75 +-----------------------
 package-lock.json                        | 10 +---
 package.json                             |  1 -
 resources/js/app.js                      |  1 -
 resources/views/layouts/master.blade.php |  2 -
 webpack.mix.js                           |  1 -
 7 files changed, 3 insertions(+), 88 deletions(-)

diff --git a/composer.json b/composer.json
index f0e1058a6..37ddfcbfe 100644
--- a/composer.json
+++ b/composer.json
@@ -34,7 +34,6 @@
         "league/csv": "^9.6.2",
         "league/flysystem-path-prefixing": "^3.0",
         "league/flysystem-webdav": "^3.0",
-        "livewire/livewire": "^2.7",
         "mcamara/laravel-localization": "^1.8",
         "primal/color": "^1.0",
         "rap2hpoutre/laravel-log-viewer": "dev-master",
diff --git a/composer.lock b/composer.lock
index b9dc8903f..fbc6e0012 100644
--- a/composer.lock
+++ b/composer.lock
@@ -4,7 +4,7 @@
         "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
         "This file is @generated automatically"
     ],
-    "content-hash": "9c7a9cc1dc606396e505d31521143504",
+    "content-hash": "c383bfe97d533226a4e6b4e445d485e3",
     "packages": [
         {
             "name": "anahkiasen/former",
@@ -3710,79 +3710,6 @@
             ],
             "time": "2022-04-17T13:12:02+00:00"
         },
-        {
-            "name": "livewire/livewire",
-            "version": "v2.12.3",
-            "source": {
-                "type": "git",
-                "url": "https://github.com/livewire/livewire.git",
-                "reference": "019b1e69d8cd8c7e749eba7a38e4fa69ecbc8f74"
-            },
-            "dist": {
-                "type": "zip",
-                "url": "https://api.github.com/repos/livewire/livewire/zipball/019b1e69d8cd8c7e749eba7a38e4fa69ecbc8f74",
-                "reference": "019b1e69d8cd8c7e749eba7a38e4fa69ecbc8f74",
-                "shasum": ""
-            },
-            "require": {
-                "illuminate/database": "^7.0|^8.0|^9.0|^10.0",
-                "illuminate/support": "^7.0|^8.0|^9.0|^10.0",
-                "illuminate/validation": "^7.0|^8.0|^9.0|^10.0",
-                "league/mime-type-detection": "^1.9",
-                "php": "^7.2.5|^8.0",
-                "symfony/http-kernel": "^5.0|^6.0"
-            },
-            "require-dev": {
-                "calebporzio/sushi": "^2.1",
-                "laravel/framework": "^7.0|^8.0|^9.0|^10.0",
-                "mockery/mockery": "^1.3.1",
-                "orchestra/testbench": "^5.0|^6.0|^7.0|^8.0",
-                "orchestra/testbench-dusk": "^5.2|^6.0|^7.0|^8.0",
-                "phpunit/phpunit": "^8.4|^9.0",
-                "psy/psysh": "@stable"
-            },
-            "type": "library",
-            "extra": {
-                "laravel": {
-                    "providers": [
-                        "Livewire\\LivewireServiceProvider"
-                    ],
-                    "aliases": {
-                        "Livewire": "Livewire\\Livewire"
-                    }
-                }
-            },
-            "autoload": {
-                "files": [
-                    "src/helpers.php"
-                ],
-                "psr-4": {
-                    "Livewire\\": "src/"
-                }
-            },
-            "notification-url": "https://packagist.org/downloads/",
-            "license": [
-                "MIT"
-            ],
-            "authors": [
-                {
-                    "name": "Caleb Porzio",
-                    "email": "calebporzio@gmail.com"
-                }
-            ],
-            "description": "A front-end framework for Laravel.",
-            "support": {
-                "issues": "https://github.com/livewire/livewire/issues",
-                "source": "https://github.com/livewire/livewire/tree/v2.12.3"
-            },
-            "funding": [
-                {
-                    "url": "https://github.com/livewire",
-                    "type": "github"
-                }
-            ],
-            "time": "2023-03-03T20:12:38+00:00"
-        },
         {
             "name": "maennchen/zipstream-php",
             "version": "v2.4.0",
diff --git a/package-lock.json b/package-lock.json
index 5784b1744..e6e70c5a7 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2861,7 +2861,7 @@
         "asynckit": {
             "version": "0.4.0",
             "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
-            "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="
+            "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k="
         },
         "atob": {
             "version": "2.1.2",
@@ -4435,7 +4435,7 @@
         "delayed-stream": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
-            "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ=="
+            "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk="
         },
         "delegate": {
             "version": "3.2.0",
@@ -7399,12 +7399,6 @@
                 "@types/trusted-types": "^2.0.2"
             }
         },
-        "livewire-vue": {
-            "version": "0.3.1",
-            "resolved": "https://registry.npmjs.org/livewire-vue/-/livewire-vue-0.3.1.tgz",
-            "integrity": "sha512-R04O2zq86goM0Hw2MztDxK1cEVb196wCiGr3fFF6j4CTA2ocox1bLB4sF7qzyu+mnXmNSy1Wo3CZoY5BJNpl4w==",
-            "dev": true
-        },
         "loader-runner": {
             "version": "4.3.0",
             "resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-4.3.0.tgz",
diff --git a/package.json b/package.json
index c2fc12825..9c6e3845a 100644
--- a/package.json
+++ b/package.json
@@ -23,7 +23,6 @@
         "laravel-vue-lang": "^3.1.3",
         "less": "^3.13.1",
         "less-loader": "^5.0.0",
-        "livewire-vue": "^0.3.1",
         "postcss": "^8.4.31",
         "prettier": "^2.5.1",
         "resolve-url-loader": "^3.1.2",
diff --git a/resources/js/app.js b/resources/js/app.js
index 64873c8cb..c6321f3d2 100644
--- a/resources/js/app.js
+++ b/resources/js/app.js
@@ -22,7 +22,6 @@ require('./components/clipboard-button')
 // Vue components
 import Vue from 'vue'
 import { ZiggyVue } from 'ziggy';
-import 'livewire-vue'
 import * as LottiePlayer from "@lottiefiles/lottie-player";
 import { VueMasonryPlugin } from 'vue-masonry'
 import { Lang } from 'laravel-vue-lang';
diff --git a/resources/views/layouts/master.blade.php b/resources/views/layouts/master.blade.php
index 084b1c748..cda6bfb16 100644
--- a/resources/views/layouts/master.blade.php
+++ b/resources/views/layouts/master.blade.php
@@ -33,7 +33,6 @@
 		<link rel="stylesheet" type="text/css" href="{{ mix('/css/app-tailwind.css') }}" />
 		<link rel="stylesheet" type="text/css" href="{{ mix('/css/style.css') }}" />
 		{!! Html::style('css/magnific-popup.css') !!}
-		@livewireStyles
 
 		{{-- JS --}}
 		@include('googletagmanager::head')
@@ -97,7 +96,6 @@
 	    </a>
 	</div>
 
-	@livewireScripts
 	<script type="text/javascript" src="{{ mix('/js/manifest.js') }}"></script>
 	<script type="text/javascript" src="{{ mix('/js/vendor.js') }}"></script>
 	<script type="text/javascript" src="{{ mix('/js/app.js') }}"></script>
diff --git a/webpack.mix.js b/webpack.mix.js
index 1f975c9af..df631e8e3 100644
--- a/webpack.mix.js
+++ b/webpack.mix.js
@@ -43,7 +43,6 @@ mix
         'lazysizes',
         'lazysizes/plugins/unveilhooks/ls.unveilhooks',
         'lazysizes/plugins/respimg/ls.respimg',
-        'livewire-vue',
         'selectize',
         'typeahead.js/dist/typeahead.bundle',
         'vue-select',