authheader-fix

package-lock.json

@@ -11,6 +11,7 @@
       "license": "MIT",
       "dependencies": {
         "@authorizerdev/authorizer-js": "1.2.11",
+        "ackee-tracker": "5.1.0",
         "form-data": "4.0.0",
         "i18next": "22.4.15",
         "i18next-icu": "2.3.0",
@@ -6378,6 +6379,14 @@
         "tslib": "^2.3.1"
       }
     },
+    "node_modules/ackee-tracker": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/ackee-tracker/-/ackee-tracker-5.1.0.tgz",
+      "integrity": "sha512-A7iKkGyUnEXuOzxultQB7hnm4bStYCo1c38MYRRihBfqUP8AImhtZOODb00t9xrXs/BTsg06bz1MKpXeMs9sYw==",
+      "dependencies": {
+        "platform": "^1.3.6"
+      }
+    },
     "node_modules/acorn": {
       "version": "8.11.3",
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.3.tgz",
@@ -15944,6 +15953,11 @@
         "node": ">=8"
       }
     },
+    "node_modules/platform": {
+      "version": "1.3.6",
+      "resolved": "https://registry.npmjs.org/platform/-/platform-1.3.6.tgz",
+      "integrity": "sha512-fnWVljUchTro6RiCFvCXBbNhJc2NijN7oIQxbwsyL0buWJPG85v81ehlHI9fXrJsMNgTofEoWIQeClKpgxFLrg=="
+    },
     "node_modules/pluralize": {
       "version": "8.0.0",
       "resolved": "https://registry.npmjs.org/pluralize/-/pluralize-8.0.0.tgz",

package.json

@@ -31,6 +31,7 @@
   },
   "dependencies": {
     "@authorizerdev/authorizer-js": "1.2.11",
+    "ackee-tracker": "5.1.0",
     "form-data": "4.0.0",
     "i18next": "22.4.15",
     "i18next-icu": "2.3.0",

src/components/Nav/HeaderAuth.tsx

@@ -32,7 +32,7 @@ const MD_WIDTH_BREAKPOINT = 992
 export const HeaderAuth = (props: Props) => {
   const { t } = useLocalize()
   const { page } = useRouter()
-  const { session, author, isAuthenticated } = useSession()
+  const { session, author, isAuthenticated, isSessionLoaded } = useSession()
   const {
     unreadNotificationsCount,
     actions: { showNotificationsPanel },
@@ -58,7 +58,9 @@ export const HeaderAuth = (props: Props) => {
   const isNotificationsVisible = createMemo(() => isAuthenticated() && !isEditorPage())
   const isSaveButtonVisible = createMemo(() => isAuthenticated() && isEditorPage())
   const isCreatePostButtonVisible = createMemo(() => isAuthenticated() && !isEditorPage())
-  const isAuthenticatedControlsVisible = createMemo(() => isAuthenticated())
+  const isAuthenticatedControlsVisible = createMemo(
+    () => isAuthenticated() && session()?.user?.email_verified,
+  )
 
   const handleBurgerButtonClick = () => {
     toggleEditorPanel()
@@ -111,7 +113,7 @@ export const HeaderAuth = (props: Props) => {
 
   return (
     <ShowOnlyOnClient>
-      <Show when={session()?.user?.email_verified} keyed={true}>
+      <Show when={isSessionLoaded()} keyed={true}>
         <div class={clsx('col-auto col-lg-7', styles.usernav)}>
           <div class={styles.userControl}>
             <Show when={isCreatePostButtonVisible()}>