User consent is now between ACCEPT and REJECT cookies.

Signed-off-by: Simon Viénot <[email protected]>
hashgraph · Aug 4, 2023 · 241c01e · 241c01e
1 parent af3610e
commit 241c01e
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 31 deletions.
diff --git a/src/App.vue b/src/App.vue
@@ -29,8 +29,8 @@
   <router-view/>
 
   <CookiesDialog v-model:show-dialog="showCookiesDialog"
-                 @onChooseNecessary="handleChooseNecessaryCookies"
-                 @onChooseAll="handleChooseAllCookies">
+                 @onChooseReject="handleChooseRejectCookies"
+                 @onChooseAccept="handleChooseAcceptCookies">
   </CookiesDialog>
 
 </template>
@@ -98,8 +98,8 @@ export default defineComponent({
 
     const showCookiesDialog = ref(false)
 
-    const acceptAllCookies = ref<boolean|null>(null)
-    watch(acceptAllCookies, (value) => {
+    const acceptCookies = ref<boolean|null>(null)
+    watch(acceptCookies, (value) => {
       if (value != null && value) {
         insertGoogleTag(import.meta.env.VITE_APP_GOOGLE_TAG_ID)
       }
@@ -114,10 +114,10 @@ export default defineComponent({
     onBeforeMount(() => {
       const tagId = import.meta.env.VITE_APP_GOOGLE_TAG_ID
       if (tagId != undefined && tagId.length > 0) {
-        acceptAllCookies.value = AppStorage.getCookiePolicyAcceptAll()
-        showCookiesDialog.value = (acceptAllCookies.value == null)
+        acceptCookies.value = AppStorage.getAcceptCookiePolicy()
+        showCookiesDialog.value = (acceptCookies.value == null)
       } else {
-        acceptAllCookies.value = null
+        acceptCookies.value = null
         showCookiesDialog.value = false
       }
     })
@@ -132,22 +132,22 @@ export default defineComponent({
       window.removeEventListener('resize', onResizeHandler);
     })
 
-    const handleChooseNecessaryCookies = () => {
-      acceptAllCookies.value = false
-      AppStorage.setCookiePolicyAcceptAll(false)
+    const handleChooseRejectCookies = () => {
+      acceptCookies.value = false
+      AppStorage.setAcceptCookiePolicy(false)
     }
 
-    const handleChooseAllCookies = () => {
-      acceptAllCookies.value = true
-      AppStorage.setCookiePolicyAcceptAll(true)
+    const handleChooseAcceptCookies = () => {
+      acceptCookies.value = true
+      AppStorage.setAcceptCookiePolicy(true)
     }
 
     return {
       isMediumScreen,
       onMainDashboardPage,
       showCookiesDialog,
-      handleChooseNecessaryCookies,
-      handleChooseAllCookies,
+      handleChooseRejectCookies,
+      handleChooseAcceptCookies,
     }
   },
 });

diff --git a/src/AppStorage.ts b/src/AppStorage.ts
@@ -89,18 +89,19 @@ export class AppStorage {
     // cookiePolicy
     //
 
-    private static readonly COOKIE_POLICY_NAME = 'cookiePolicy'
-    private static readonly COOKIE_POLICY_ACCEPT_ALL = 'acceptAll'
-    private static readonly COOKIE_POLICY_ACCEPT_NECESSARY = 'acceptNecessary'
+    private static readonly COOKIE_POLICY_NAME = 'cookie_policy'
+    private static readonly COOKIE_POLICY_ACCEPT = 'accept'
+    private static readonly COOKIE_POLICY_REJECT = 'reject'
+    private static readonly COOKIE_POLICY_VALIDITY = 365 // days
 
-    public static getCookiePolicyAcceptAll(): boolean|null {
+    public static getAcceptCookiePolicy(): boolean|null {
         const policy = AppStorage.readCookie(AppStorage.COOKIE_POLICY_NAME)
-        return policy != null ? policy === AppStorage.COOKIE_POLICY_ACCEPT_ALL : null
+        return policy != null ? policy === AppStorage.COOKIE_POLICY_ACCEPT : null
     }
 
-    public static setCookiePolicyAcceptAll(choice: boolean): void {
-        const policy = choice ? AppStorage.COOKIE_POLICY_ACCEPT_ALL : AppStorage.COOKIE_POLICY_ACCEPT_NECESSARY
-        AppStorage.createCookie(AppStorage.COOKIE_POLICY_NAME, policy, 1)
+    public static setAcceptCookiePolicy(accept: boolean): void {
+        const policy = accept ? AppStorage.COOKIE_POLICY_ACCEPT : AppStorage.COOKIE_POLICY_REJECT
+        AppStorage.createCookie(AppStorage.COOKIE_POLICY_NAME, policy, AppStorage.COOKIE_POLICY_VALIDITY)
     }
 
     //

diff --git a/src/components/CookiesDialog.vue b/src/components/CookiesDialog.vue
@@ -35,8 +35,8 @@
       <span>to understand how Swirlds Labs collects and uses information.</span>
       <div class="is-flex is-justify-content-space-between is-align-items-baseline mt-4">
         <div class="is-flex is-justify-content-flex-end">
-          <button class="button is-white is-small" @click="handleChooseNecessary">NECESSARY COOKIES</button>
-          <button class="button is-info is-small ml-4" @click="handleChooseAll">ALL COOKIES</button>
+          <button class="button is-white is-small" @click="handleChooseReject">REJECT</button>
+          <button class="button is-info is-small ml-4" @click="handleChooseAccept">ACCEPT</button>
         </div>
       </div>
     </template>
@@ -63,17 +63,17 @@ export default defineComponent({
     iconClass: String
   },
   setup(props, context) {
-    const handleChooseAll = () => {
+    const handleChooseAccept = () => {
       context.emit('update:showDialog', false)
-      context.emit('onChooseAll')
+      context.emit('onChooseAccept')
     }
-    const handleChooseNecessary = () => {
+    const handleChooseReject = () => {
       context.emit('update:showDialog', false)
-      context.emit('onChooseNecessary')
+      context.emit('onChooseReject')
     }
     return {
-      handleChooseAll,
-      handleChooseNecessary
+      handleChooseAccept,
+      handleChooseReject,
     }
   }
 });