[Bug]: showPreferences method now working when switching language (next-intl)

Expected Behavior

Calling showPreferences method does not open preferences modal.

Current Behavior

` <button type="button" data-cc="show-preferencesModal" className="text-sm md:mt-0 mt-6 text-center" aria-label="Open Cookie Consent Preferences"

Cookie Preferences `

When clicking this button initially, it works well and opens the modal. Once, user switches language (I use the following library - https://next-intl-docs.vercel.app/), clicking button does not open the modal. But once user refreshes the browser, it starts working again (the modal opens, using newly selected language)

Steps to reproduce

Config

import` type { CookieConsentConfig } from 'vanilla-cookieconsent';
import { default as enTranslations } from '@/locale/en.json';
import { default as frTranslations } from '@/locale/fr.json';

const en = { consentModal: enTranslations.consentModal, preferencesModal: enTranslations.preferencesModal };
const fr = { consentModal: frTranslations.consentModal, preferencesModal: frTranslations.preferencesModal };

const config: CookieConsentConfig = {
  guiOptions: {
    consentModal: {
      layout: 'cloud',
      position: 'bottom',
    },
    preferencesModal: {
      layout: 'box',
      position: 'left',
    },
  },
  categories: {
    necessary: {
      enabled: true,
      readOnly: true,
      services: {
        language: {
          label: 'Language Preferences',
          cookies: [{ name: /^(NEXT_LOCALE)/ }],
        },
      },
    },
    analytics: {
      autoClear: {
        cookies: [{ name: /^(_ga|_gid)/ }],
      },
      services: {
        ga: {
          label: 'Google Analytics',
          cookies: [{ name: /^(_ga|_gid)/ }],
        },
      },
    },
  },
  language: {
    default: 'en',
    autoDetect: 'document',
    translations: {
      en,
      fr,
    },
  },
};

export default config;

Initialization

'use client';

import config from '@/lib/cookieConsent/config';
import { isDevelopment } from '@/lib/utils';
import { GoogleAnalytics } from '@next/third-parties/google';
import { useEffect, useState } from 'react';
import * as CookieConsent from 'vanilla-cookieconsent';

export default function ConsentManager() {
  const [consentedServices, setConsentedServices] = useState<{ [key: string]: string[] }>(() => {
    if (typeof window === 'undefined') return {};
    const initialCookie = CookieConsent.getCookie();
    return initialCookie?.services || {};
  });

  const loadGA = consentedServices?.analytics?.includes('ga');
  const _loadActOn = consentedServices?.marketing?.includes('acton');

  const cc_config = {
    ...config
  };

  useEffect(() => {
    CookieConsent.run(cc_config);

    if (!CookieConsent.validConsent()) {
      CookieConsent.reset(true);
      CookieConsent.run(cc_config);
    }
  }, []);

  return <></>;
}

Root Layout

 <html lang={locale}>
      <body>
        <NextIntlClientProvider locale={locale} messages={messages}>
          <LayoutProvider>
            <ConsentManager />
            {children}
            <Footer />
          </LayoutProvider>
        </NextIntlClientProvider>
      </body>
    </html>

Proposed fix or additional info.

No response

Version

3.0.1

On which browser do you see the issue?

Firefox, Chrome, Safari, Microsoft Edge

orestbida / cookieconsent