Snyk report fixes + offcanvas sidebar fix (#263)
Refactor: - Improved consistency and robustness by standardizing file encoding arguments from 'utf-8' to 'utf8' across various file read/write operations. - Simplified status mapping logic in billing components and services by replacing switch statements with direct mapping objects for clearer and more maintainable code. - Enhanced type conversion and error handling in billing and internationalization components for improved reliability. - Updated sorting logic in team member tables for more predictable member ordering. - Improved error logging with sanitized output to prevent formatting issues. - Adjusted environment variable whitelisting to use a more flexible matching pattern. - Fix variables for sidebar style handling Style: - Refined spacing and layout in account selector and sidebar header components for better visual consistency.
This commit is contained in:
committed by
GitHub
parent
cb80e4fdcf
commit
fc2fda595a
@@ -2,43 +2,27 @@ import { Enums } from '@kit/supabase/database';
|
||||
import { Alert, AlertDescription, AlertTitle } from '@kit/ui/alert';
|
||||
import { Trans } from '@kit/ui/trans';
|
||||
|
||||
const statusBadgeMap: Record<Enums<'subscription_status'>, `success` | `destructive` | `warning`> = {
|
||||
active: 'success',
|
||||
trialing: 'success',
|
||||
past_due: 'destructive',
|
||||
canceled: 'destructive',
|
||||
unpaid: 'destructive',
|
||||
incomplete: 'warning',
|
||||
incomplete_expired: 'destructive',
|
||||
paused: 'warning',
|
||||
};
|
||||
|
||||
export function CurrentPlanAlert(
|
||||
props: React.PropsWithoutRef<{
|
||||
status: Enums<'subscription_status'>;
|
||||
}>,
|
||||
) {
|
||||
let variant: 'success' | 'warning' | 'destructive';
|
||||
const prefix = 'billing:status';
|
||||
|
||||
const text = `${prefix}.${props.status}.description`;
|
||||
const title = `${prefix}.${props.status}.heading`;
|
||||
|
||||
switch (props.status) {
|
||||
case 'active':
|
||||
variant = 'success';
|
||||
break;
|
||||
case 'trialing':
|
||||
variant = 'success';
|
||||
break;
|
||||
case 'past_due':
|
||||
variant = 'destructive';
|
||||
break;
|
||||
case 'canceled':
|
||||
variant = 'destructive';
|
||||
break;
|
||||
case 'unpaid':
|
||||
variant = 'destructive';
|
||||
break;
|
||||
case 'incomplete':
|
||||
variant = 'warning';
|
||||
break;
|
||||
case 'incomplete_expired':
|
||||
variant = 'destructive';
|
||||
break;
|
||||
case 'paused':
|
||||
variant = 'warning';
|
||||
break;
|
||||
}
|
||||
const variant = statusBadgeMap[props.status];
|
||||
|
||||
return (
|
||||
<Alert variant={variant}>
|
||||
@@ -51,4 +35,4 @@ export function CurrentPlanAlert(
|
||||
</AlertDescription>
|
||||
</Alert>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -4,43 +4,27 @@ import { Trans } from '@kit/ui/trans';
|
||||
|
||||
type Status = Enums<'subscription_status'> | Enums<'payment_status'>;
|
||||
|
||||
const statusBadgeMap: Record<Status, `success` | `destructive` | `warning`> = {
|
||||
active: 'success',
|
||||
succeeded: 'success',
|
||||
trialing: 'success',
|
||||
past_due: 'destructive',
|
||||
failed: 'destructive',
|
||||
canceled: 'destructive',
|
||||
unpaid: 'destructive',
|
||||
incomplete: 'warning',
|
||||
pending: 'warning',
|
||||
incomplete_expired: 'destructive',
|
||||
paused: 'warning',
|
||||
}
|
||||
|
||||
export function CurrentPlanBadge(
|
||||
props: React.PropsWithoutRef<{
|
||||
status: Status;
|
||||
}>,
|
||||
) {
|
||||
let variant: 'success' | 'warning' | 'destructive';
|
||||
const text = `billing:status.${props.status}.badge`;
|
||||
|
||||
switch (props.status) {
|
||||
case 'active':
|
||||
case 'succeeded':
|
||||
variant = 'success';
|
||||
break;
|
||||
case 'trialing':
|
||||
variant = 'success';
|
||||
break;
|
||||
case 'past_due':
|
||||
case 'failed':
|
||||
variant = 'destructive';
|
||||
break;
|
||||
case 'canceled':
|
||||
variant = 'destructive';
|
||||
break;
|
||||
case 'unpaid':
|
||||
variant = 'destructive';
|
||||
break;
|
||||
case 'incomplete':
|
||||
case 'pending':
|
||||
variant = 'warning';
|
||||
break;
|
||||
case 'incomplete_expired':
|
||||
variant = 'destructive';
|
||||
break;
|
||||
case 'paused':
|
||||
variant = 'warning';
|
||||
break;
|
||||
}
|
||||
const variant = statusBadgeMap[props.status];
|
||||
|
||||
return (
|
||||
<Badge data-test={'current-plan-card-status-badge'} variant={variant}>
|
||||
|
||||
@@ -258,7 +258,7 @@ function Tiers({
|
||||
i18nKey={'billing:andAbove'}
|
||||
values={{
|
||||
unit,
|
||||
previousTier: (previousTierFrom as number) - 1,
|
||||
previousTier: (Number(previousTierFrom) as number) - 1,
|
||||
}}
|
||||
/>
|
||||
</span>
|
||||
|
||||
@@ -1,4 +1,3 @@
|
||||
import { BillingConfig } from '@kit/billing';
|
||||
import { UpsertSubscriptionParams } from '@kit/billing/types';
|
||||
|
||||
type SubscriptionStatus =
|
||||
@@ -23,8 +22,6 @@ export function createLemonSqueezySubscriptionPayloadBuilderService() {
|
||||
* @description This class is used to build the subscription payload for Lemon Squeezy
|
||||
*/
|
||||
class LemonSqueezySubscriptionPayloadBuilderService {
|
||||
private config?: BillingConfig;
|
||||
|
||||
/**
|
||||
* @name build
|
||||
* @description Build the subscription payload for Lemon Squeezy
|
||||
@@ -103,24 +100,18 @@ class LemonSqueezySubscriptionPayloadBuilderService {
|
||||
}
|
||||
|
||||
private getSubscriptionStatus(status: SubscriptionStatus) {
|
||||
switch (status) {
|
||||
case 'active':
|
||||
return 'active';
|
||||
case 'cancelled':
|
||||
return 'canceled';
|
||||
case 'paused':
|
||||
return 'paused';
|
||||
case 'on_trial':
|
||||
return 'trialing';
|
||||
case 'past_due':
|
||||
return 'past_due';
|
||||
case 'unpaid':
|
||||
return 'unpaid';
|
||||
case 'expired':
|
||||
return 'past_due';
|
||||
default:
|
||||
return 'active';
|
||||
}
|
||||
const statusMap = {
|
||||
active: 'active',
|
||||
cancelled: 'canceled',
|
||||
paused: 'paused',
|
||||
on_trial: 'trialing',
|
||||
past_due: 'past_due',
|
||||
unpaid: 'unpaid',
|
||||
expired: 'past_due',
|
||||
} satisfies Record<SubscriptionStatus, UpsertSubscriptionParams['status']>;
|
||||
|
||||
// Default to 'active' if status is unknown
|
||||
return statusMap[status] || 'active';
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -447,19 +447,16 @@ export class LemonSqueezyWebhookHandlerService
|
||||
|
||||
return type;
|
||||
}
|
||||
|
||||
private getOrderStatus(status: OrderStatus) {
|
||||
switch (status) {
|
||||
case 'paid':
|
||||
return 'succeeded';
|
||||
case 'pending':
|
||||
return 'pending';
|
||||
case 'failed':
|
||||
return 'failed';
|
||||
case 'refunded':
|
||||
return 'failed';
|
||||
default:
|
||||
return 'pending';
|
||||
}
|
||||
const statusMap = {
|
||||
paid: 'succeeded',
|
||||
pending: 'pending',
|
||||
failed: 'failed',
|
||||
refunded: 'failed',
|
||||
} satisfies Record<OrderStatus, UpsertOrderParams['status']>
|
||||
|
||||
return statusMap[status] ?? 'pending';
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -100,7 +100,7 @@ export function AccountSelector({
|
||||
role="combobox"
|
||||
aria-expanded={open}
|
||||
className={cn(
|
||||
'dark:shadow-primary/10 group w-full min-w-0 px-2 lg:w-auto lg:max-w-fit',
|
||||
'dark:shadow-primary/10 group w-full min-w-0 px-2 lg:w-auto lg:max-w-fit mr-1',
|
||||
{
|
||||
'justify-start': !collapsed,
|
||||
'm-auto justify-center px-2 lg:w-full': collapsed,
|
||||
@@ -114,7 +114,7 @@ export function AccountSelector({
|
||||
<span
|
||||
className={cn('flex max-w-full items-center', {
|
||||
'justify-center gap-x-0': collapsed,
|
||||
'gap-x-4': !collapsed,
|
||||
'gap-x-2': !collapsed,
|
||||
})}
|
||||
>
|
||||
<PersonalAccountAvatar />
|
||||
@@ -133,7 +133,7 @@ export function AccountSelector({
|
||||
<span
|
||||
className={cn('flex max-w-full items-center', {
|
||||
'justify-center gap-x-0': collapsed,
|
||||
'gap-x-4': !collapsed,
|
||||
'gap-x-2': !collapsed,
|
||||
})}
|
||||
>
|
||||
<Avatar className={'rounded-xs h-6 w-6'}>
|
||||
@@ -158,7 +158,7 @@ export function AccountSelector({
|
||||
</If>
|
||||
|
||||
<CaretSortIcon
|
||||
className={cn('ml-2 h-4 w-4 shrink-0 opacity-50', {
|
||||
className={cn('ml-1 h-4 w-4 shrink-0 opacity-50', {
|
||||
hidden: collapsed,
|
||||
})}
|
||||
/>
|
||||
|
||||
@@ -92,7 +92,7 @@ export function AccountMembersTable({
|
||||
})
|
||||
.sort((prev, next) => {
|
||||
if (prev.primary_owner_user_id === prev.user_id) {
|
||||
return -1;
|
||||
return 0;
|
||||
}
|
||||
|
||||
if (prev.role_hierarchy_level < next.role_hierarchy_level) {
|
||||
|
||||
@@ -128,7 +128,7 @@ export function parseAcceptLanguageHeader(
|
||||
const trimmedLocale = locale.trim();
|
||||
const numQ = Number(q.replace(/q ?=/, ''));
|
||||
|
||||
return [isNaN(numQ) ? 0 : numQ, trimmedLocale];
|
||||
return [Number.isNaN(numQ) ? 0 : numQ, trimmedLocale];
|
||||
})
|
||||
.sort(([q1], [q2]) => q2 - q1) // Sort by quality value in descending order
|
||||
.flatMap(([_, locale]) => {
|
||||
|
||||
@@ -244,7 +244,7 @@ function onError({
|
||||
|
||||
console.error(
|
||||
{
|
||||
error,
|
||||
error: JSON.stringify(error).replace(/["\\]/g, '\\$&'),
|
||||
name: `auth.callback`,
|
||||
},
|
||||
`An error occurred while signing user in`,
|
||||
|
||||
@@ -392,7 +392,7 @@ const SidebarHeader: React.FC<React.ComponentPropsWithRef<'div'>> = ({
|
||||
return (
|
||||
<div
|
||||
data-sidebar="header"
|
||||
className={cn('flex flex-col gap-2 p-2', className)}
|
||||
className={cn('flex flex-col gap-2 p-2 group-data-[state=collapsed]:group-data-[collapsible=offcanvas]:hidden', className)}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user