gib/convex-monorepo
Template
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update Convex with no payload to be just like convex with payload but without payload

Browse Source
This commit is contained in:
Gabriel Brown
2026-06-21 15:35:42 -05:00
parent 13b8b36c4c
commit fba73a92ce
130 changed files with 15637 additions and 32018 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/backend/.cache/.prettiercache
+1 -1
View File
File diff suppressed because one or more lines are too long
packages/backend/convex/_generated/api.d.ts
Vendored
-2
View File
@@ -15,7 +15,6 @@ import type * as custom_auth_providers_password from "../custom/auth/providers/p
import type * as custom_auth_providers_usesend from "../custom/auth/providers/usesend.js";
import type * as files from "../files.js";
import type * as http from "../http.js";
import type * as utils from "../utils.js";
import type {
ApiFromModules,
@@ -31,7 +30,6 @@ declare const fullApi: ApiFromModules<{
"custom/auth/providers/usesend": typeof custom_auth_providers_usesend;
files: typeof files;
http: typeof http;
utils: typeof utils;
}>;
/**
packages/backend/convex/auth.ts
+2 -3
View File
@@ -8,7 +8,7 @@ import {
import { ConvexError, v } from 'convex/values';
import type { Doc, Id } from './_generated/dataModel';
import type { MutationCtx, QueryCtx } from './_generated/server';
import type { QueryCtx } from './_generated/server';
import { api } from './_generated/api';
import { action, mutation, query } from './_generated/server';
import { Password, validatePassword } from './custom/auth';
@@ -96,11 +96,10 @@ export const updateUserPassword = action({
if (!userId) throw new ConvexError('Not authenticated.');
const user = await ctx.runQuery(api.auth.getUser, { userId });
if (!user?.email) throw new ConvexError('User not found.');
const verified = await retrieveAccount(ctx, {
await retrieveAccount(ctx, {
provider: 'password',
account: { id: user.email, secret: currentPassword },
});
if (!verified) throw new ConvexError('Current password is incorrect.');
if (!validatePassword(newPassword))
throw new ConvexError('Invalid password.');
packages/backend/convex/custom/auth/providers/usesend.ts
+13 -10
View File
@@ -11,32 +11,35 @@ export default function UseSendProvider(config: EmailUserConfig): EmailConfig {
from: process.env.USESEND_FROM_EMAIL ?? 'noreply@example.com',
maxAge: 24 * 60 * 60, // 24 hours
async generateVerificationToken() {
generateVerificationToken: () => {
const random: RandomReader = {
read(bytes) {
crypto.getRandomValues(bytes);
read: (bytes) => {
crypto.getRandomValues(bytes as Uint8Array<ArrayBuffer>);
},
};
return generateRandomString(random, alphabet('0-9'), 6);
},
async sendVerificationRequest(params) {
sendVerificationRequest: async (params) => {
const { identifier: to, provider, url, token } = params;
// Derive a display name from the site URL, fallback to 'App'
const siteUrl = process.env.USESEND_FROM_EMAIL ?? '';
const appName = siteUrl.split('@')[1]?.split('.')[0] ?? 'App';
const useSend = new UseSend(
process.env.USESEND_API_KEY!,
process.env.USESEND_URL!,
);
const apiKey = process.env.USESEND_API_KEY;
const useSendUrl = process.env.USESEND_URL;
if (!apiKey || !useSendUrl) {
throw new Error('USESEND_API_KEY and USESEND_URL must be set.');
}
const useSend = new UseSend(apiKey, useSendUrl);
// For password reset, we want to send the code, not the magic link
const isPasswordReset =
url.includes('reset') || provider.id?.includes('reset');
url.includes('reset') || provider.id.includes('reset');
const result = await useSend.emails.send({
from: provider.from!,
from: provider.from ?? 'noreply@example.com',
to: [to],
subject: isPasswordReset
? `Reset your password - ${appName}`
packages/backend/convex/globals.d.ts
Vendored
+10
View File
@@ -0,0 +1,10 @@
// Declare process.env for Convex backend environment variables.
// Convex supports process.env to read variables set in the Convex Dashboard.
declare const process: {
readonly env: {
readonly USESEND_API_KEY?: string;
readonly USESEND_URL?: string;
readonly USESEND_FROM_EMAIL?: string;
readonly [key: string]: string | undefined;
};
};
packages/backend/convex/schema.ts
+1
View File
@@ -18,6 +18,7 @@ const applicationTables = {
phoneVerificationTime: v.optional(v.number()),
isAnonymous: v.optional(v.boolean()),
/* Fields below here are custom & not defined in authTables */
isAdmin: v.optional(v.boolean()),
themePreference: v.optional(
v.union(v.literal('light'), v.literal('dark'), v.literal('system')),
),
packages/backend/convex/utils.ts
-16
View File
@@ -1,16 +0,0 @@
export function missingEnvVariableUrl(envVarName: string, whereToGet: string) {
const deployment = deploymentName();
if (!deployment) return `Missing ${envVarName} in environment variables.`;
return (
`\n Missing ${envVarName} in environment variables.\n\n` +
` Get it from ${whereToGet} .\n Paste it on the Convex dashboard:\n` +
` https://dashboard.convex.dev/d/${deployment}/settings?var=${envVarName}`
);
}
export function deploymentName() {
const url = process.env.CONVEX_CLOUD_URL;
if (!url) return undefined;
const regex = new RegExp('https://(.+).convex.cloud');
return regex.exec(url)?.[1];
}
packages/backend/eslint.config.ts
+10
View File
@@ -0,0 +1,10 @@
import { defineConfig } from 'eslint/config';
import { baseConfig } from '@gib/eslint-config/base';
export default defineConfig(
{
ignores: ['convex/_generated/**', 'types/**', 'scripts/**', 'dist/**'],
},
baseConfig,
);
packages/backend/package.json
+15 -6
View File
@@ -14,31 +14,40 @@
"scripts": {
"dev": "bun with-env convex dev",
"dev:tunnel": "bun with-env convex dev",
"dev:web": "bun with-env convex dev",
"setup": "bun with-env convex dev --until-success",
"clean": "git clean -xdf .cache .turbo dist node_modules",
"format": "prettier --check . --ignore-path ../../.gitignore",
"lint": "eslint --flag unstable_native_nodejs_ts_config",
"typecheck": "tsc --noEmit",
"with-env": "dotenv -e ../../.env --"
"test:unit": "vitest run --project unit",
"test:integration": "vitest run --project integration --passWithNoTests",
"test:component": "vitest run --project component --passWithNoTests",
"with-env": "sh ../../scripts/with-env ${INFISICAL_ENV:-dev} --"
},
"dependencies": {
"@oslojs/crypto": "^1.0.1",
"@react-email/components": "0.5.4",
"@react-email/render": "^1.4.0",
"@react-email/components": "1.0.10",
"@react-email/render": "^2.0.4",
"convex": "catalog:convex",
"react": "catalog:react19",
"react-dom": "catalog:react19",
"usesend-js": "^1.5.6",
"usesend-js": "^1.6.3",
"zod": "catalog:"
},
"devDependencies": {
"@edge-runtime/vm": "catalog:test",
"@gib/eslint-config": "workspace:*",
"@gib/prettier-config": "workspace:*",
"@gib/tsconfig": "workspace:*",
"@gib/vitest-config": "workspace:*",
"@types/node": "catalog:",
"convex-test": "catalog:test",
"eslint": "catalog:",
"prettier": "catalog:",
"react-email": "4.2.11",
"typescript": "catalog:"
"react-email": "5.2.10",
"typescript": "catalog:",
"vitest": "catalog:test"
},
"prettier": "@gib/prettier-config"
}
packages/backend/tests/unit/harness.test.ts
+13
View File
@@ -0,0 +1,13 @@
import { convexTest } from 'convex-test';
import { describe, expect, test } from 'vitest';
import schema from '../../convex/schema';
const modules = import.meta.glob('../../convex/**/*.*s');
describe('convex-test harness', () => {
test('boots and executes against the project schema', async () => {
const t = convexTest(schema, modules);
expect(await t.run(() => Promise.resolve(42))).toBe(42);
});
});
packages/backend/tests/vite-env.d.ts
Vendored
+1
View File
@@ -0,0 +1 @@
/// <reference types="vite/client" />
packages/backend/tsconfig.json
+6
View File
@@ -0,0 +1,6 @@
{
"extends": "@gib/tsconfig/base.json",
"compilerOptions": { "lib": ["ES2022", "DOM"], "types": ["node"] },
"include": ["tests", "vitest.config.ts"],
"exclude": ["node_modules", "convex/_generated"]
}
packages/backend/vitest.config.ts
+13
View File
@@ -0,0 +1,13 @@
import { defineConfig } from 'vitest/config';
import { convexProject, nodeProject } from '@gib/vitest-config';
export default defineConfig({
test: {
projects: [
convexProject('unit', ['tests/unit/**/*.test.ts']),
convexProject('integration', ['tests/integration/**/*.test.ts']),
nodeProject('component', ['tests/component/**/*.test.{ts,tsx}']),
],
},
});
packages/ui/.cache/.eslintcache
+1 -1
View File
File diff suppressed because one or more lines are too long
packages/ui/.cache/.prettiercache
+1 -1
View File
File diff suppressed because one or more lines are too long
packages/ui/.cache/tsbuildinfo.json
+1 -10982
View File
File diff suppressed because one or more lines are too long
packages/ui/package.json
+18 -9
View File
@@ -12,23 +12,27 @@
"format": "prettier --check . --ignore-path ../../.gitignore",
"lint": "eslint --flag unstable_native_nodejs_ts_config",
"typecheck": "tsc --noEmit --emitDeclarationOnly false",
"test:unit": "vitest run --project unit --passWithNoTests",
"test:integration": "vitest run --project integration --passWithNoTests",
"test:component": "NODE_ENV=test vitest run --project component",
"ui-add": "bunx --bun shadcn@latest add && prettier src --write --list-different"
},
"dependencies": {
"@base-ui/react": "^1.3.0",
"@hookform/resolvers": "^5.2.2",
"@radix-ui/react-avatar": "^1.1.10",
"@radix-ui/react-avatar": "^1.1.11",
"@radix-ui/react-checkbox": "^1.3.3",
"@radix-ui/react-dialog": "^1.1.15",
"@radix-ui/react-dropdown-menu": "^2.1.16",
"@radix-ui/react-icons": "^1.3.2",
"@radix-ui/react-label": "^2.1.7",
"@radix-ui/react-progress": "^1.1.7",
"@radix-ui/react-label": "^2.1.8",
"@radix-ui/react-progress": "^1.1.8",
"@radix-ui/react-scroll-area": "^1.2.10",
"@radix-ui/react-separator": "^1.1.7",
"@radix-ui/react-slot": "^1.2.3",
"@radix-ui/react-separator": "^1.1.8",
"@radix-ui/react-slot": "^1.2.4",
"@radix-ui/react-switch": "^1.2.6",
"@radix-ui/react-tabs": "^1.1.13",
"@tabler/icons-react": "^3.41.0",
"class-variance-authority": "^0.7.1",
"clsx": "^2.1.1",
"cmdk": "^1.1.1",
@@ -36,26 +40,31 @@
"embla-carousel-react": "^8.6.0",
"input-otp": "^1.4.2",
"lucide-react": "^0.577.0",
"motion": "^12.38.0",
"next-themes": "^0.4.6",
"radix-ui": "^1.4.3",
"react-day-picker": "^9.14.0",
"react-hook-form": "^7.65.0",
"react-hook-form": "^7.72.0",
"react-image-crop": "^11.0.10",
"react-resizable-panels": "^4",
"recharts": "^3.8.0",
"react-resizable-panels": "^4.7.6",
"recharts": "^3.8.1",
"sonner": "^2.0.7",
"tailwind-merge": "^3.3.1",
"tailwind-merge": "^3.5.0",
"vaul": "^1.1.2"
},
"devDependencies": {
"@gib/eslint-config": "workspace:*",
"@gib/prettier-config": "workspace:*",
"@gib/tsconfig": "workspace:*",
"@gib/vitest-config": "workspace:*",
"@testing-library/react": "catalog:test",
"@types/react": "catalog:react19",
"eslint": "catalog:",
"jsdom": "catalog:test",
"prettier": "catalog:",
"react": "catalog:react19",
"typescript": "catalog:",
"vitest": "catalog:test",
"zod": "catalog:"
},
"peerDependencies": {
packages/ui/src/based-avatar.tsx
+3 -3
View File
@@ -4,12 +4,12 @@ import type { ComponentProps } from 'react';
import * as AvatarPrimitive from '@radix-ui/react-avatar';
import { User } from 'lucide-react';
import { AvatarImage, cn } from '@gib/ui';
import { cn } from '@gib/ui';
type BasedAvatarProps = ComponentProps<typeof AvatarPrimitive.Root> & {
src?: string | null;
fullName?: string | null;
imageProps?: Omit<ComponentProps<typeof AvatarImage>, 'data-slot'>;
imageProps?: Omit<ComponentProps<typeof AvatarPrimitive.Image>, 'data-slot'>;
fallbackProps?: ComponentProps<typeof AvatarPrimitive.Fallback>;
userIconProps?: ComponentProps<typeof User>;
};
@@ -35,7 +35,7 @@ const BasedAvatar = ({
{...props}
>
{src ? (
<AvatarImage
<AvatarPrimitive.Image
{...imageProps}
src={src}
className={imageProps?.className}
packages/ui/src/based-progress.tsx
+1 -1
View File
@@ -45,7 +45,7 @@ const BasedProgress = ({
<ProgressPrimitive.Indicator
data-slot='progress-indicator'
className='bg-primary h-full w-full flex-1 transition-all'
style={{ transform: `translateX(-${100 - (progress ?? 0)}%)` }}
style={{ transform: `translateX(-${100 - progress}%)` }}
/>
</ProgressPrimitive.Root>
);
packages/ui/src/carousel.tsx
+2 -3
View File
@@ -98,7 +98,7 @@ const Carousel = ({
api.on('select', onSelect);
return () => {
api?.off('select', onSelect);
api.off('select', onSelect);
};
}, [api, onSelect]);
@@ -108,8 +108,7 @@ const Carousel = ({
carouselRef,
api: api,
opts,
orientation:
orientation || (opts?.axis === 'y' ? 'vertical' : 'horizontal'),
orientation: orientation,
scrollPrev,
scrollNext,
canScrollPrev,
packages/ui/src/chart.tsx
+51 -26
View File
@@ -48,7 +48,7 @@ const ChartContainer = ({
>['children'];
}) => {
const uniqueId = React.useId();
const chartId = `chart-${id || uniqueId.replace(/:/g, '')}`;
const chartId = `chart-${id ?? uniqueId.replace(/:/g, '')}`;
return (
<ChartContext.Provider value={{ config }}>
@@ -72,7 +72,7 @@ const ChartContainer = ({
const ChartStyle = ({ id, config }: { id: string; config: ChartConfig }) => {
const colorConfig = Object.entries(config).filter(
([, config]) => config.theme || config.color,
([, config]) => config.theme ?? config.color,
);
if (!colorConfig.length) {
@@ -89,7 +89,7 @@ ${prefix} [data-chart=${id}] {
${colorConfig
.map(([key, itemConfig]) => {
const color =
itemConfig.theme?.[theme as keyof typeof itemConfig.theme] ||
itemConfig.theme?.[theme as keyof typeof itemConfig.theme] ??
itemConfig.color;
return color ? ` --color-${key}: ${color};` : null;
})
@@ -105,6 +105,15 @@ ${colorConfig
const ChartTooltip = RechartsPrimitive.Tooltip;
type ChartPayloadItem = {
name?: string | number;
value?: number | string;
dataKey?: string | number;
type?: string;
color?: string;
payload?: Record<string, unknown> & { fill?: string };
};
const ChartTooltipContent = ({
active,
payload,
@@ -119,14 +128,29 @@ const ChartTooltipContent = ({
color,
nameKey,
labelKey,
}: React.ComponentProps<typeof RechartsPrimitive.Tooltip> &
React.ComponentProps<'div'> & {
hideLabel?: boolean;
hideIndicator?: boolean;
indicator?: 'line' | 'dot' | 'dashed';
nameKey?: string;
labelKey?: string;
}) => {
}: React.ComponentProps<'div'> & {
active?: boolean;
payload?: ChartPayloadItem[];
label?: React.ReactNode;
labelFormatter?: (
value: React.ReactNode,
payload: ChartPayloadItem[],
) => React.ReactNode;
formatter?: (
value: number | string,
name: string | number,
item: ChartPayloadItem,
index: number,
itemPayload: ChartPayloadItem['payload'],
) => React.ReactNode;
color?: string;
labelClassName?: string;
hideLabel?: boolean;
hideIndicator?: boolean;
indicator?: 'line' | 'dot' | 'dashed';
nameKey?: string;
labelKey?: string;
}) => {
const { config } = useChart();
const tooltipLabel = React.useMemo(() => {
@@ -135,11 +159,11 @@ const ChartTooltipContent = ({
}
const [item] = payload;
const key = `${labelKey || item?.dataKey || item?.name || 'value'}`;
const key = `${labelKey ?? item?.dataKey ?? item?.name ?? 'value'}`;
const itemConfig = getPayloadConfigFromPayload(config, item, key);
const value =
!labelKey && typeof label === 'string'
? config[label]?.label || label
? (config[label]?.label ?? label)
: itemConfig?.label;
if (labelFormatter) {
@@ -183,19 +207,19 @@ const ChartTooltipContent = ({
{payload
.filter((item) => item.type !== 'none')
.map((item, index) => {
const key = `${nameKey || item.name || item.dataKey || 'value'}`;
const key = `${nameKey ?? item.name ?? item.dataKey ?? 'value'}`;
const itemConfig = getPayloadConfigFromPayload(config, item, key);
const indicatorColor = color || item.payload.fill || item.color;
const indicatorColor = color ?? item.payload?.fill ?? item.color;
return (
<div
key={item.dataKey}
key={item.dataKey ?? index}
className={cn(
'[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5',
indicator === 'dot' && 'items-center',
)}
>
{formatter && item?.value !== undefined && item.name ? (
{formatter && item.value !== undefined && item.name ? (
formatter(item.value, item.name, item, index, item.payload)
) : (
<>
@@ -232,7 +256,7 @@ const ChartTooltipContent = ({
<div className='grid gap-1.5'>
{nestLabel ? tooltipLabel : null}
<span className='text-muted-foreground'>
{itemConfig?.label || item.name}
{itemConfig?.label ?? item.name}
</span>
</div>
{item.value && (
@@ -259,11 +283,12 @@ const ChartLegendContent = ({
payload,
verticalAlign = 'bottom',
nameKey,
}: React.ComponentProps<'div'> &
Pick<RechartsPrimitive.LegendProps, 'payload' | 'verticalAlign'> & {
hideIcon?: boolean;
nameKey?: string;
}) => {
}: React.ComponentProps<'div'> & {
payload?: ChartPayloadItem[];
verticalAlign?: 'top' | 'bottom';
hideIcon?: boolean;
nameKey?: string;
}) => {
const { config } = useChart();
if (!payload?.length) {
@@ -280,13 +305,13 @@ const ChartLegendContent = ({
>
{payload
.filter((item) => item.type !== 'none')
.map((item) => {
const key = `${nameKey || item.dataKey || 'value'}`;
.map((item, index) => {
const key = `${nameKey ?? item.dataKey ?? 'value'}`;
const itemConfig = getPayloadConfigFromPayload(config, item, key);
return (
<div
key={item.value}
key={item.value ?? index}
className={cn(
'[&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3',
)}
packages/ui/src/combobox.tsx
+10 -7
View File
@@ -68,13 +68,16 @@ const ComboboxInput = ({
/>
<InputGroupAddon align='inline-end'>
{showTrigger && (
<InputGroupButton
size='icon-xs'
variant='ghost'
render={<ComboboxTrigger />}
data-slot='input-group-button'
className='group-has-data-[slot=combobox-clear]/input-group:hidden data-pressed:bg-transparent'
disabled={disabled}
<ComboboxTrigger
render={
<InputGroupButton
size='icon-xs'
variant='ghost'
data-slot='input-group-button'
className='group-has-data-[slot=combobox-clear]/input-group:hidden data-pressed:bg-transparent'
disabled={disabled}
/>
}
/>
)}
{showClear && <ComboboxClear disabled={disabled} />}
packages/ui/src/css.d.ts
Vendored
+1
View File
@@ -0,0 +1 @@
declare module '*.css';
packages/ui/src/form.tsx
+1 -5
View File
@@ -46,10 +46,6 @@ const useFormField = () => {
const formState = useFormState({ name: fieldContext.name });
const fieldState = getFieldState(fieldContext.name, formState);
if (!fieldContext) {
throw new Error('useFormField should be used within <FormField>');
}
const { id } = itemContext;
return {
@@ -138,7 +134,7 @@ const FormDescription = ({
const FormMessage = ({ className, ...props }: React.ComponentProps<'p'>) => {
const { error, formMessageId } = useFormField();
const body = error ? String(error?.message ?? '') : props.children;
const body = error ? String(error.message ?? '') : props.children;
if (!body) {
return null;
packages/ui/src/hooks/use-on-click-outside.tsx
-1
View File
@@ -1,5 +1,4 @@
import * as React from 'react';
import { MousePointerClick, X } from 'lucide-react';
type EventType =
| 'mousedown'
packages/ui/src/image-crop.tsx
+23 -18
View File
@@ -153,7 +153,7 @@ export const ImageCrop = ({
useEffect(() => {
const reader = new FileReader();
reader.addEventListener('load', () =>
setImgSrc(reader.result?.toString() || ''),
setImgSrc(typeof reader.result === 'string' ? reader.result : ''),
);
reader.readAsDataURL(file);
}, [file]);
@@ -173,12 +173,13 @@ export const ImageCrop = ({
onChange?.(pixelCrop, percentCrop);
};
const handleComplete = async (
const handleComplete = (
pixelCrop: PixelCrop,
percentCrop: PercentCrop,
) => {
): Promise<void> => {
setCompletedCrop(pixelCrop);
onComplete?.(pixelCrop, percentCrop);
return Promise.resolve();
};
const applyCrop = async () => {
@@ -293,19 +294,17 @@ export const ImageCropApply = ({
if (asChild) {
return (
<Slot.Root onClick={handleClick} {...(props as any)}>
<Slot.Root
onClick={handleClick}
{...(props as ComponentProps<typeof Slot.Root>)}
>
{children}
</Slot.Root>
);
}
return (
<Button
onClick={handleClick}
size='icon'
variant='ghost'
{...(props as any)}
>
<Button onClick={handleClick} size='icon' variant='ghost' {...props}>
{children ?? <CropIcon className='size-4' />}
</Button>
);
@@ -330,19 +329,17 @@ export const ImageCropReset = ({
if (asChild) {
return (
<Slot.Root onClick={handleClick} {...(props as any)}>
<Slot.Root
onClick={handleClick}
{...(props as ComponentProps<typeof Slot.Root>)}
>
{children}
</Slot.Root>
);
}
return (
<Button
onClick={handleClick}
size='icon'
variant='ghost'
{...(props as any)}
>
<Button onClick={handleClick} size='icon' variant='ghost' {...props}>
{children ?? <RotateCcwIcon className='size-4' />}
</Button>
);
@@ -372,7 +369,15 @@ export const Cropper = ({
onChange={onChange}
onComplete={onComplete}
onCrop={onCrop}
{...(props as any)}
{...(props as Omit<
ImageCropProps,
| 'file'
| 'maxImageSize'
| 'onChange'
| 'onComplete'
| 'onCrop'
| 'children'
>)}
>
<ImageCropContent className={className} style={style} />
</ImageCrop>
packages/ui/src/input-otp.tsx
+1 -1
View File
@@ -47,7 +47,7 @@ const InputOTPSlot = ({
index: number;
}) => {
const inputOTPContext = React.useContext(OTPInputContext);
const { char, hasFakeCaret, isActive } = inputOTPContext?.slots[index] ?? {};
const { char, hasFakeCaret, isActive } = inputOTPContext.slots[index] ?? {};
return (
<div
packages/ui/src/progress.tsx
+1 -1
View File
@@ -21,7 +21,7 @@ const Progress = ({
<ProgressPrimitive.Indicator
data-slot='progress-indicator'
className='bg-primary size-full flex-1 transition-all'
style={{ transform: `translateX(-${100 - (value || 0)}%)` }}
style={{ transform: `translateX(-${100 - (value ?? 0)}%)` }}
/>
</ProgressPrimitive.Root>
);
packages/ui/src/sidebar.tsx
+3 -3
View File
@@ -602,9 +602,9 @@ const SidebarMenuSkeleton = ({
showIcon?: boolean;
}) => {
// Random width between 50 to 90%.
const width = React.useMemo(() => {
return `${Math.floor(Math.random() * 40) + 50}%`;
}, []);
const [width] = React.useState(
() => `${Math.floor(Math.random() * 40) + 50}%`,
);
return (
<div
packages/ui/src/toggle-group.tsx
+4 -4
View File
@@ -58,13 +58,13 @@ const ToggleGroupItem = ({
return (
<ToggleGroupPrimitive.Item
data-slot='toggle-group-item'
data-variant={context.variant || variant}
data-size={context.size || size}
data-variant={context.variant ?? variant}
data-size={context.size ?? size}
data-spacing={context.spacing}
className={cn(
toggleVariants({
variant: context.variant || variant,
size: context.size || size,
variant: context.variant ?? variant,
size: context.size ?? size,
}),
'w-auto min-w-0 shrink-0 px-3 focus:z-10 focus-visible:z-10',
'data-[spacing=0]:rounded-none data-[spacing=0]:shadow-none data-[spacing=0]:first:rounded-l-md data-[spacing=0]:last:rounded-r-md data-[spacing=0]:data-[variant=outline]:border-l-0 data-[spacing=0]:data-[variant=outline]:first:border-l',
packages/ui/tests/component/button.test.tsx
+13
View File
@@ -0,0 +1,13 @@
import { render, screen } from '@testing-library/react';
import { describe, expect, it } from 'vitest';
import { Button } from '../../src/button';
describe('Button', () => {
it('renders its children', () => {
render(<Button>Click me</Button>);
expect(
screen.getByRole('button', { name: 'Click me' }),
).toBeInTheDocument();
});
});
packages/ui/tests/jest-dom.d.ts
Vendored
+1
View File
@@ -0,0 +1 @@
import '@testing-library/jest-dom/vitest';
packages/ui/tsconfig.json
+1 -1
View File
@@ -5,6 +5,6 @@
"jsx": "preserve",
"rootDir": "."
},
"include": ["src"],
"include": ["src", "tests", "vitest.config.ts"],
"exclude": ["node_modules"]
}
packages/ui/vitest.config.ts
+13
View File
@@ -0,0 +1,13 @@
import { defineConfig } from 'vitest/config';
import { jsdomProject, nodeProject } from '@gib/vitest-config';
export default defineConfig({
test: {
projects: [
nodeProject('unit', ['tests/unit/**/*.test.{ts,tsx}']),
nodeProject('integration', ['tests/integration/**/*.test.{ts,tsx}']),
jsdomProject('component', ['tests/component/**/*.test.{ts,tsx}']),
],
},
});