🎨 yarn fix

src/components/AuthSync.tsx

@@ -1,9 +1,10 @@
-import { useActiveOrg, useAuthInfo } from './propelauth';
-import { useMemo, useEffect } from 'react';
-import { trpc } from './trpc';
 import cookie from 'js-cookie';
+import { useEffect, useMemo } from 'react';
+
 import { AUTH_COOKIE_NAME } from '../constants';
 import { parseJwt } from './jwt';
+import { useActiveOrg, useAuthInfo } from './propelauth';
+import { trpc } from './trpc';
 
 export function AuthSync() {
 	// refresh_token is stored in secure cookie, so the only way to get access_token is to wait for propel auth to get new access_token from their backend
@@ -19,6 +20,7 @@ export function AuthSync() {
 				orgId,
 			};
 		}
+
 		return { isLoggedIn: undefined, accessToken: undefined, userId: undefined };
 	}, [auth, orgId]);
 
@@ -28,6 +30,7 @@ export function AuthSync() {
 			authMutation.mutate(params);
 			return;
 		}
+
 		if (params.isLoggedIn) {
 			// store new cookie to backend if new access_token is much fresher than the one in backend or userId doesn't match
 			const cookieValues = new URLSearchParams(cookie.get(AUTH_COOKIE_NAME) || '');
@@ -40,6 +43,7 @@ export function AuthSync() {
 				authMutation.mutate(params);
 				return;
 			}
+
 			const expFromCookie = cookieValues.get('exp');
 			const expFromCookieNumber = Number(expFromCookie) || 0;
 			console.log('expFromCookieNumber', jwtValues.exp - expFromCookieNumber);

src/components/Counter.tsx

@@ -1,4 +1,5 @@
 import { useRef } from 'react';
+
 import { trpc, TRPCProvider } from './trpc';
 
 export function Counter(props: React.ComponentProps<typeof CounterInteral>) {

src/components/Login.tsx

@@ -1,6 +1,5 @@
-import { AuthProvider, LoginManager } from './propelauth';
-
 import { env } from '../config';
+import { AuthProvider, LoginManager } from './propelauth';
 import { PropelAuthCSS } from './PropelAuthCSS';
 
 export function Login() {
@@ -15,6 +14,7 @@ export function LoginInternal() {
 	const redirectToYourProduct = () => {
 		window.location.href = '/app';
 	};
+
 	return (
 		<PropelAuthCSS>
 			<LoginManager

src/components/LoginPasswordless.tsx

@@ -1,6 +1,5 @@
-import { AuthProvider, LoginPasswordless } from './propelauth';
-
 import { env } from '../config';
+import { AuthProvider, LoginPasswordless } from './propelauth';
 import { PropelAuthCSS } from './PropelAuthCSS';
 
 export function Login() {

src/components/PropelAuthCSS.tsx

@@ -1,7 +1,8 @@
-import { createPortal } from 'react-dom';
+import { BaseElements } from '@propelauth/base-elements';
 import { useCallback, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
+
 import { BetaComponentLibraryProvider } from './propelauth';
-import { BaseElements } from '@propelauth/base-elements';
 
 export function PropelAuthCSS({ children }: { children: React.ReactNode }) {
 	return (

src/components/Signup.tsx

@@ -1,12 +1,12 @@
-import { AuthProvider, Signup as SignupManager } from './propelauth';
-
 import { env } from '../config';
+import { AuthProvider, Signup as SignupManager } from './propelauth';
 import { PropelAuthCSS } from './PropelAuthCSS';
 
 export function Signup() {
 	const redirectToYourProduct = () => {
 		window.location.href = '/app';
 	};
+
 	return (
 		<AuthProvider authUrl={env.PUBLIC_AUTH_URL}>
 			<PropelAuthCSS>

src/components/app/App.tsx

@@ -1,19 +1,20 @@
+import type { OrgMemberInfo } from '@propelauth/javascript';
+import type { UseAuthInfoLoggedInProps } from '@propelauth/react/types/useAuthInfo';
+
+import { env } from '../../config';
+import { AuthSync } from '../AuthSync';
+import { SupportWidget } from '../fogbender/Support';
+import { LoginInternal } from '../Login';
 import {
 	AuthProvider,
+	saveOrgSelectionToLocalStorage,
 	useActiveOrg,
 	useAuthInfo,
-	saveOrgSelectionToLocalStorage,
 	useRedirectFunctions,
 } from '../propelauth';
-import type { OrgMemberInfo } from '@propelauth/javascript';
-import type { UseAuthInfoLoggedInProps } from '@propelauth/react/types/useAuthInfo';
-import { env } from '../../config';
 import { TRPCProvider } from '../trpc';
-import { AuthSync } from '../AuthSync';
-import { SupportWidget } from '../fogbender/Support';
-import { LoginInternal } from '../Login';
-import { AppNav } from './Nav';
 import { Layout } from './Layout';
+import { AppNav } from './Nav';
 
 export function App() {
 	return (
@@ -35,6 +36,7 @@ function AppInteral() {
 	if (auth.loading === true) {
 		return <div className="container my-10 mx-4">Loading...</div>;
 	}
+
 	if (auth.user === null) {
 		return (
 			<>
@@ -45,6 +47,7 @@ function AppInteral() {
 			</>
 		);
 	}
+
 	if (!activeOrg) {
 		const orgs = auth.orgHelper.getOrgs();
 		if (orgs.length === 0) {
@@ -64,6 +67,7 @@ function AppInteral() {
 				</>
 			);
 		}
+
 		return (
 			<>
 				<h1 className="text-2xl font-bold text-center">Please select an organization</h1>
@@ -88,6 +92,7 @@ function AppInteral() {
 			</>
 		);
 	}
+
 	return <AppWithOrg auth={auth} activeOrg={activeOrg} />;
 }
 

src/components/app/Nav.tsx

@@ -1,13 +1,14 @@
 import classNames from 'clsx';
-import { useState, useEffect, useRef } from 'react';
+import { useEffect, useRef, useState } from 'react';
+
+import { env } from '../../config';
+import { SupportWidget } from '../fogbender/Support';
 import {
 	requireActiveOrg,
 	saveOrgSelectionToLocalStorage,
 	useLogoutFunction,
 	useRedirectFunctions,
 } from '../propelauth';
-import { env } from '../../config';
-import { SupportWidget } from '../fogbender/Support';
 
 export function AppNav() {
 	const menuRef = useRef<HTMLDivElement>(null);
@@ -33,15 +34,18 @@ export function AppNav() {
 				setIsMenuOpen(false);
 			}
 		};
+
 		const handleEscape = (e: KeyboardEvent) => {
 			if (e.key === 'Escape') {
 				setIsMenuOpen(false);
 			}
 		};
+
 		if (isMenuOpen) {
 			document.addEventListener('click', closeMenu);
 			document.addEventListener('keydown', handleEscape);
 		}
+
 		return () => {
 			document.removeEventListener('click', closeMenu);
 			document.removeEventListener('keydown', handleEscape);

src/components/app/Prompts.tsx

@@ -1,12 +1,13 @@
 import { DehydratedState, useQueryClient } from '@tanstack/react-query';
 import { getQueryKey } from '@trpc/react-query';
+import { useReducer, useRef } from 'react';
+
 import { env } from '../../config';
-import { AuthProvider, requireActiveOrg } from '../propelauth';
-import { TRPCProvider, trpc } from '../trpc';
 import { AuthSync } from '../AuthSync';
-import { useReducer, useRef } from 'react';
-import { AppNav } from './Nav';
+import { AuthProvider, requireActiveOrg } from '../propelauth';
+import { trpc, TRPCProvider } from '../trpc';
 import { Layout } from './Layout';
+import { AppNav } from './Nav';
 
 export function Prompts(props: { dehydratedState: DehydratedState }) {
 	return (
@@ -40,7 +41,7 @@ function Interal() {
 		},
 	});
 	const runPromptMutation = trpc.prompts.runPrompt.useMutation();
-	const [showAddPrompt, toggleShowAddPrompt] = useReducer((state) => !state, !!!!!!!!!false);
+	const [showAddPrompt, toggleShowAddPrompt] = useReducer((state) => !state, !false);
 	const { activeOrg } = requireActiveOrg();
 	const orgId = activeOrg?.orgId || '';
 	const promptsQuery = trpc.prompts.getPrompts.useQuery(
@@ -97,6 +98,7 @@ function Interal() {
 										return;
 									}
 								}
+
 								addPromptMutation.mutate(
 									{ orgId, prompt, response },
 									{

src/components/app/Settings.tsx

@@ -1,10 +1,11 @@
 import { useQueryClient } from '@tanstack/react-query';
 import { getQueryKey } from '@trpc/react-query';
+import { useReducer } from 'react';
+
 import { env } from '../../config';
-import { AuthProvider, requireActiveOrg } from '../propelauth';
-import { TRPCProvider, trpc } from '../trpc';
 import { AuthSync } from '../AuthSync';
-import { useReducer } from 'react';
+import { AuthProvider, requireActiveOrg } from '../propelauth';
+import { trpc, TRPCProvider } from '../trpc';
 import { Layout } from './Layout';
 import { AppNav } from './Nav';
 

src/components/fogbender/Support.tsx

@@ -1,23 +1,24 @@
+import type { OrgMemberInfo } from '@propelauth/react';
+import type { UseAuthInfoLoggedInProps } from '@propelauth/react/types/useAuthInfo';
 import {
-	FogbenderWidget,
-	FogbenderSimpleFloatie,
-	FogbenderProvider,
 	FogbenderConfig,
-	FogbenderIsConfigured,
 	FogbenderHeadlessWidget,
+	FogbenderIsConfigured,
+	FogbenderProvider,
+	FogbenderSimpleFloatie,
 	FogbenderUnreadBadge,
+	FogbenderWidget,
 } from 'fogbender-react';
-import { AuthProvider } from '../propelauth';
-import { TRPCProvider } from '../trpc';
-import { AuthSync } from '../AuthSync';
 import { useMemo } from 'react';
-import type { OrgMemberInfo } from '@propelauth/react';
-import type { UseAuthInfoLoggedInProps } from '@propelauth/react/types/useAuthInfo';
-import { apiServer, queryKeys, useQuery } from '../client';
-import type { FogbenderTokenResponse } from '../../types/types';
+
 import { env } from '../../config';
-import { useActiveOrg, useAuthInfo } from '../propelauth';
+import type { FogbenderTokenResponse } from '../../types/types';
 import { AppNav } from '../app/Nav';
+import { AuthSync } from '../AuthSync';
+import { apiServer, queryKeys, useQuery } from '../client';
+import { AuthProvider } from '../propelauth';
+import { useActiveOrg, useAuthInfo } from '../propelauth';
+import { TRPCProvider } from '../trpc';
 
 export const FullPageSupport = () => {
 	return (
@@ -42,6 +43,7 @@ export const SupportWidget = ({ kind }: { kind: 'widget' | 'floatie' | 'badge' }
 		if (kind !== 'widget') {
 			return null;
 		}
+
 		return (
 			<div className="container mt-8 mx-auto">
 				<h3 className="text-2xl font-bold">Prompts with Friends / Support</h3>
@@ -69,6 +71,7 @@ export const SupportWidget = ({ kind }: { kind: 'widget' | 'floatie' | 'badge' }
 			/>
 		);
 	}
+
 	return null;
 };
 
@@ -106,6 +109,7 @@ export const Internal = ({
 		if (!userJWT) {
 			return;
 		}
+
 		return {
 			widgetId,
 			customerId: activeOrg.orgId,

src/components/head/posthog.ts

@@ -1,4 +1,5 @@
 import posthog from 'posthog-js';
+
 import { env } from '../../config';
 
 if (env.PUBLIC_POSTHOG_KEY) {

src/components/jwt.ts

@@ -1,10 +1,11 @@
 export function parseJwt(token: string) {
-	var base64Url = token.split('.')[1];
+	const base64Url = token.split('.')[1];
 	if (!base64Url) {
 		return;
 	}
-	var base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/');
-	var jsonPayload = decodeURIComponent(
+
+	const base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/');
+	const jsonPayload = decodeURIComponent(
 		window
 			.atob(base64)
 			.split('')
@@ -18,6 +19,7 @@ export function parseJwt(token: string) {
 		if (typeof parsed === 'object' && parsed !== null) {
 			return parsed as Record<string, unknown>;
 		}
+
 		console.error('Could not parse JWT payload', parsed);
 		return;
 	} catch (e) {

src/components/landing/B2B.astro

@@ -1,7 +1,7 @@
 ---
-import Layout from '../../layouts/Layout.astro';
 import b2b7logo from '../../assets/b2b7.svg';
 import wink from '../../assets/wink.svg';
+import Layout from '../../layouts/Layout.astro';
 
 const websiteTitle = 'B2B SaaS Kit';
 

src/components/landing/Dev.astro

@@ -1,6 +1,6 @@
 ---
-import Layout from '../../layouts/Layout.astro';
 import { websiteTitle } from '../../constants';
+import Layout from '../../layouts/Layout.astro';
 export const prerender = true;
 ---
 

src/components/landing/Prod.astro

@@ -1,8 +1,8 @@
 ---
-import Layout from '../../layouts/Layout.astro';
-import { websiteTitle } from '../../constants';
 import b2b7logo from '../../assets/b2b7.svg';
 import free from '../../assets/free.svg';
+import { websiteTitle } from '../../constants';
+import Layout from '../../layouts/Layout.astro';
 export const prerender = true;
 ---
 

src/components/propelauth.tsx

@@ -32,13 +32,13 @@ export function requireActiveOrg() {
 
 export {
 	AuthProvider,
-	useActiveOrg,
-	useAuthInfo,
-	saveOrgSelectionToLocalStorage,
-	useRedirectFunctions,
 	BetaComponentLibraryProvider,
-	Signup,
+	LoginManager,
 	LoginPasswordless,
+	saveOrgSelectionToLocalStorage,
+	Signup,
+	useActiveOrg,
+	useAuthInfo,
 	useLogoutFunction,
-	LoginManager,
+	useRedirectFunctions,
 };