From caf588d90b3a92e8985e0880f10b76cf14b1a93b Mon Sep 17 00:00:00 2001 From: Brian Morrison II Date: Mon, 12 Aug 2024 21:01:57 -0500 Subject: [PATCH 1/4] use has --- package-lock.json | 60 +++++++++++++++++++++------------------ package.json | 4 +-- src/components/navbar.tsx | 30 ++++++++++++++------ 3 files changed, 57 insertions(+), 37 deletions(-) diff --git a/package-lock.json b/package-lock.json index 74d6520..62f050c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,7 +9,7 @@ "version": "0.1.0", "dependencies": { "@brianmmdev/clerk-webhooks-handler": "^1.0.5", - "@clerk/nextjs": "^5.1.6", + "@clerk/nextjs": "^5.2.14", "@hookform/resolvers": "^3.6.0", "@neondatabase/serverless": "^0.9.3", "@radix-ui/react-dialog": "^1.1.1", @@ -19,7 +19,7 @@ "class-variance-authority": "^0.7.0", "clsx": "^2.1.1", "lucide-react": "^0.397.0", - "next": "14.2.4", + "next": "^14.2.4", "portfinder": "^1.0.32", "react": "^18", "react-dom": "^18", @@ -70,12 +70,12 @@ } }, "node_modules/@clerk/backend": { - "version": "1.2.4", - "resolved": "https://registry.npmjs.org/@clerk/backend/-/backend-1.2.4.tgz", - "integrity": "sha512-H6K1kHPaDFM6pBdwDAHh1jWSZxCWhGPzDmqgc7LByjqKS6RZUf3cs5mJkIXyopUpHY7wvwj50vSF0xJ46MEzNA==", + "version": "1.6.1", + "resolved": "https://registry.npmjs.org/@clerk/backend/-/backend-1.6.1.tgz", + "integrity": "sha512-UA1zLXuHQBZ7CQtRXTKl5siejmfqOYs4jLfAyMnsHjY0r+PJ2/oZ4WsFepJNw1CdQdP2hi8wmrSuV3EZA6VjnQ==", "dependencies": { - "@clerk/shared": "2.3.1", - "@clerk/types": "4.6.1", + "@clerk/shared": "2.4.5", + "@clerk/types": "4.12.1", "cookie": "0.5.0", "snakecase-keys": "5.4.4", "tslib": "2.4.1" @@ -85,12 +85,12 @@ } }, "node_modules/@clerk/clerk-react": { - "version": "5.2.5", - "resolved": "https://registry.npmjs.org/@clerk/clerk-react/-/clerk-react-5.2.5.tgz", - "integrity": "sha512-Ihf1t2LdWTagW3U5BH5KRwQ8i+ECaZGEUymhJ89eZA+Ux5iXwLfOIBdwCIs45gbVuFiQ8WK0W00eaDgsNaf1mw==", + "version": "5.3.3", + "resolved": "https://registry.npmjs.org/@clerk/clerk-react/-/clerk-react-5.3.3.tgz", + "integrity": "sha512-GtwC2tQegwA74M2XiTLiwJ7wkywlwDjjz4gJLzSST33sa903uVlnWEUONFQjINgra8pfx9f2U6mmHVj1F27FQw==", "dependencies": { - "@clerk/shared": "2.3.1", - "@clerk/types": "4.6.1", + "@clerk/shared": "2.4.5", + "@clerk/types": "4.12.1", "tslib": "2.4.1" }, "engines": { @@ -102,16 +102,17 @@ } }, "node_modules/@clerk/nextjs": { - "version": "5.1.6", - "resolved": "https://registry.npmjs.org/@clerk/nextjs/-/nextjs-5.1.6.tgz", - "integrity": "sha512-HAxDzvVJ6EM99NbxNYOvMfGSSFEXyz+yPo1ER7RoV95sTH61PZ4ugsg+Ml0AhjQ60j3xUU/BPhQEYogGxvQzEA==", - "dependencies": { - "@clerk/backend": "1.2.4", - "@clerk/clerk-react": "5.2.5", - "@clerk/shared": "2.3.1", - "@clerk/types": "4.6.1", + "version": "5.2.14", + "resolved": "https://registry.npmjs.org/@clerk/nextjs/-/nextjs-5.2.14.tgz", + "integrity": "sha512-6m62iOOeSJkuyD+kw/k9zGaU+MpYTaFuFr+pX4TCQEgrvc3aOdeUXcLeeNYDIAORNtPtDx5+YS/Ld3J60/BG1Q==", + "dependencies": { + "@clerk/backend": "1.6.1", + "@clerk/clerk-react": "5.3.3", + "@clerk/shared": "2.4.5", + "@clerk/types": "4.12.1", "crypto-js": "4.2.0", "path-to-regexp": "6.2.2", + "server-only": "0.0.1", "tslib": "2.4.1" }, "engines": { @@ -124,12 +125,12 @@ } }, "node_modules/@clerk/shared": { - "version": "2.3.1", - "resolved": "https://registry.npmjs.org/@clerk/shared/-/shared-2.3.1.tgz", - "integrity": "sha512-WX7cCViYqkNMnbFfT2B93ykNcSseoYM1obMUynO60VBl9Zi6Epde5tn9VRamhuOdojgPR+DyYkH9AzBpXFYnSg==", + "version": "2.4.5", + "resolved": "https://registry.npmjs.org/@clerk/shared/-/shared-2.4.5.tgz", + "integrity": "sha512-WK8/LLow7q+OXzsRWtSAkqsBbtt16TcivfvN5bIhbcs52jIiA1EvIOetwFk5yXDNBHdEn2GxL7UXxdBaodselA==", "hasInstallScript": true, "dependencies": { - "@clerk/types": "4.6.1", + "@clerk/types": "4.12.1", "glob-to-regexp": "0.4.1", "js-cookie": "3.0.5", "std-env": "^3.7.0", @@ -152,9 +153,9 @@ } }, "node_modules/@clerk/types": { - "version": "4.6.1", - "resolved": "https://registry.npmjs.org/@clerk/types/-/types-4.6.1.tgz", - "integrity": "sha512-QFeNKPYDmTJ88l5QYG0SPwbABk42wRMalW3M/wAtr+wnQxBCXyX2XRZe9h4g2rH1VF+wG4Xe56abeeD+xE4iEw==", + "version": "4.12.1", + "resolved": "https://registry.npmjs.org/@clerk/types/-/types-4.12.1.tgz", + "integrity": "sha512-0torlmJM3S3kYdaZuIrw1pf4K8aMvoFV+PE1xg7MGfZ0enD9UO3Vhw24pP/yBhI4hVGtNu95E63gpeOFIYysrA==", "dependencies": { "csstype": "3.1.1" }, @@ -2384,6 +2385,11 @@ "loose-envify": "^1.1.0" } }, + "node_modules/server-only": { + "version": "0.0.1", + "resolved": "https://registry.npmjs.org/server-only/-/server-only-0.0.1.tgz", + "integrity": "sha512-qepMx2JxAa5jjfzxG79yPPq+8BuFToHd1hm7kI+Z4zAq1ftQiP7HcxMhDDItrbtwVeLg/cY2JnKnrcFkmiswNA==" + }, "node_modules/set-function-length": { "version": "1.2.2", "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz", diff --git a/package.json b/package.json index b09e86b..49b560f 100644 --- a/package.json +++ b/package.json @@ -12,7 +12,7 @@ }, "dependencies": { "@brianmmdev/clerk-webhooks-handler": "^1.0.5", - "@clerk/nextjs": "^5.1.6", + "@clerk/nextjs": "^5.2.14", "@hookform/resolvers": "^3.6.0", "@neondatabase/serverless": "^0.9.3", "@radix-ui/react-dialog": "^1.1.1", @@ -22,7 +22,7 @@ "class-variance-authority": "^0.7.0", "clsx": "^2.1.1", "lucide-react": "^0.397.0", - "next": "14.2.4", + "next": "^14.2.4", "portfinder": "^1.0.32", "react": "^18", "react-dom": "^18", diff --git a/src/components/navbar.tsx b/src/components/navbar.tsx index 19e0105..711d93b 100644 --- a/src/components/navbar.tsx +++ b/src/components/navbar.tsx @@ -1,23 +1,37 @@ +"use client" import * as React from "react" import Link from "next/link" -import { OrganizationSwitcher, SignedIn, SignedOut, UserButton } from "@clerk/nextjs" -import { metadata } from "@/app/layout" -import { Button } from "./ui/button" -import { auth } from "@clerk/nextjs/server" +import { OrganizationSwitcher, SignedIn, SignedOut, useAuth, UserButton } from "@clerk/nextjs" +import { KeyIcon } from "lucide-react" +import { ImSpinner } from "react-icons/im" function Navbar() { - const { sessionClaims } = auth() + const { has, isLoaded } = useAuth(); + + if(!isLoaded) { + return + } + + const isAdmin = has({ role: "org:admin" }); return (