debugging for deployment

This commit is contained in:
Harivansh Rathi 2024-12-04 22:18:13 -05:00
parent e426c4ff92
commit 72193f9967
8 changed files with 185 additions and 133 deletions

View file

@ -1,14 +1,11 @@
import React from 'react';
import { BlogPost } from '../data/blogPosts';
interface ShareButtonsProps {
post: BlogPost;
title: string;
url?: string;
}
export const ShareButtons: React.FC<ShareButtonsProps> = ({ post }) => {
const url = window.location.href;
const title = `Check out ${post.character}'s blog post: ${post.title}`;
export const ShareButtons: React.FC<ShareButtonsProps> = ({ title, url = window.location.href }) => {
const shareLinks = [
{
name: 'Twitter',

View file

@ -58,8 +58,8 @@ function Calendar({
...classNames,
}}
components={{
IconLeft: ({ ...props }) => <ChevronLeftIcon className="h-4 w-4" />,
IconRight: ({ ...props }) => <ChevronRightIcon className="h-4 w-4" />,
IconLeft: () => <ChevronLeftIcon className="h-4 w-4" />,
IconRight: () => <ChevronRightIcon className="h-4 w-4" />,
}}
{...props}
/>

View file

@ -1,8 +1,8 @@
import * as React from 'react';
import * as RechartsPrimitive from 'recharts';
import {
import type { TooltipProps } from 'recharts';
import type {
NameType,
Payload,
ValueType,
} from 'recharts/types/component/DefaultTooltipContent';
@ -72,7 +72,7 @@ ChartContainer.displayName = 'Chart';
const ChartStyle = ({ id, config }: { id: string; config: ChartConfig }) => {
const colorConfig = Object.entries(config).filter(
([_, config]) => config.theme || config.color
([, itemConfig]) => itemConfig.theme || itemConfig.color
);
if (!colorConfig.length) {
@ -105,17 +105,34 @@ ${colorConfig
const ChartTooltip = RechartsPrimitive.Tooltip;
const ChartTooltipContent = React.forwardRef<
HTMLDivElement,
React.ComponentProps<typeof RechartsPrimitive.Tooltip> &
React.ComponentProps<'div'> & {
hideLabel?: boolean;
hideIndicator?: boolean;
indicator?: 'line' | 'dot' | 'dashed';
nameKey?: string;
labelKey?: string;
}
>(
interface PayloadItem {
dataKey?: string;
name?: string;
value?: number;
payload?: {
fill?: string;
color?: string;
};
color?: string;
}
interface CustomTooltipProps extends Omit<TooltipProps<ValueType, NameType>, 'formatter'> {
className?: string;
hideLabel?: boolean;
hideIndicator?: boolean;
indicator?: 'line' | 'dot' | 'dashed';
nameKey?: string;
labelKey?: string;
labelClassName?: string;
color?: string;
formatter?: (value: ValueType, name: string, props: PayloadItem, index: number, payload: PayloadItem) => React.ReactNode;
}
const getPayloadConfigFromPayload = (config: ChartConfig, payload: PayloadItem, key: string) => {
return config[key] || config[payload.dataKey || ''] || config[payload.name || ''];
};
const ChartTooltipContent = React.forwardRef<HTMLDivElement, CustomTooltipProps>(
(
{
active,
@ -188,10 +205,10 @@ const ChartTooltipContent = React.forwardRef<
>
{!nestLabel ? tooltipLabel : null}
<div className="grid gap-1.5">
{payload.map((item, index) => {
{payload.map((item: PayloadItem, index: number) => {
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
@ -202,7 +219,7 @@ const ChartTooltipContent = React.forwardRef<
)}
>
{formatter && item?.value !== undefined && item.name ? (
formatter(item.value, item.name, item, index, item.payload)
formatter(item.value, item.name, item, index, item)
) : (
<>
{itemConfig?.icon ? (
@ -257,112 +274,7 @@ const ChartTooltipContent = React.forwardRef<
);
}
);
ChartTooltipContent.displayName = 'ChartTooltip';
const ChartLegend = RechartsPrimitive.Legend;
ChartTooltipContent.displayName = 'ChartTooltipContent';
const ChartLegendContent = React.forwardRef<
HTMLDivElement,
React.ComponentProps<'div'> &
Pick<RechartsPrimitive.LegendProps, 'payload' | 'verticalAlign'> & {
hideIcon?: boolean;
nameKey?: string;
}
>(
(
{ className, hideIcon = false, payload, verticalAlign = 'bottom', nameKey },
ref
) => {
const { config } = useChart();
if (!payload?.length) {
return null;
}
return (
<div
ref={ref}
className={cn(
'flex items-center justify-center gap-4',
verticalAlign === 'top' ? 'pb-3' : 'pt-3',
className
)}
>
{payload.map((item) => {
const key = `${nameKey || item.dataKey || 'value'}`;
const itemConfig = getPayloadConfigFromPayload(config, item, key);
return (
<div
key={item.value}
className={cn(
'flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3 [&>svg]:text-muted-foreground'
)}
>
{itemConfig?.icon && !hideIcon ? (
<itemConfig.icon />
) : (
<div
className="h-2 w-2 shrink-0 rounded-[2px]"
style={{
backgroundColor: item.color,
}}
/>
)}
{itemConfig?.label}
</div>
);
})}
</div>
);
}
);
ChartLegendContent.displayName = 'ChartLegend';
// Helper to extract item config from a payload.
function getPayloadConfigFromPayload(
config: ChartConfig,
payload: unknown,
key: string
) {
if (typeof payload !== 'object' || payload === null) {
return undefined;
}
const payloadPayload =
'payload' in payload &&
typeof payload.payload === 'object' &&
payload.payload !== null
? payload.payload
: undefined;
let configLabelKey: string = key;
if (
key in payload &&
typeof payload[key as keyof typeof payload] === 'string'
) {
configLabelKey = payload[key as keyof typeof payload] as string;
} else if (
payloadPayload &&
key in payloadPayload &&
typeof payloadPayload[key as keyof typeof payloadPayload] === 'string'
) {
configLabelKey = payloadPayload[
key as keyof typeof payloadPayload
] as string;
}
return configLabelKey in config
? config[configLabelKey]
: config[key as keyof typeof config];
}
export {
ChartContainer,
ChartTooltip,
ChartTooltipContent,
ChartLegend,
ChartLegendContent,
ChartStyle,
};
export { ChartContainer, ChartTooltip, ChartTooltipContent };

View file

@ -83,7 +83,12 @@ const ToastDescription = React.forwardRef<
));
ToastDescription.displayName = ToastPrimitives.Description.displayName;
type ToastProps = React.ComponentPropsWithoutRef<typeof Toast>;
type ToastActionElement = React.ReactElement<typeof ToastPrimitives.Action>;
export {
type ToastProps,
type ToastActionElement,
ToastProvider,
ToastViewport,
Toast,

View file

@ -1,7 +1,6 @@
import { useState } from 'react';
import { Heart, MapPin, Calendar } from 'lucide-react';
import { successStories, SuccessStory } from '@/data/success-stories';
import { cn } from '@/lib/utils';
const StoryModal = ({ story, onClose }: { story: SuccessStory; onClose: () => void }) => {
return (

View file

@ -5,6 +5,8 @@ export type VendorCategory =
| 'catering'
| 'music'
| 'flowers'
| 'transport'
| 'stationery'
| 'matchmaking'
| 'modiste';