From 72193f99678df90429b7da5329a31c74cbab9180 Mon Sep 17 00:00:00 2001 From: rathi Date: Wed, 4 Dec 2024 22:18:13 -0500 Subject: [PATCH] debugging for deployment --- package-lock.json | 135 +++++++++++++++++++++++++++ package.json | 2 + src/components/ShareButtons.tsx | 9 +- src/components/ui/calendar.tsx | 4 +- src/components/ui/chart.tsx | 160 +++++++------------------------- src/components/ui/toast.tsx | 5 + src/pages/SuccessStories.tsx | 1 - src/types/vendors.ts | 2 + 8 files changed, 185 insertions(+), 133 deletions(-) diff --git a/package-lock.json b/package-lock.json index 517c8b1..408c51a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -45,6 +45,7 @@ "@tailwindcss/line-clamp": "^0.4.4", "@tailwindcss/typography": "^0.5.15", "@types/d3": "^7.4.3", + "@types/recharts": "^1.8.29", "class-variance-authority": "^0.7.0", "clsx": "^2.1.1", "cmdk": "^1.0.0", @@ -61,6 +62,7 @@ "react-hook-form": "^7.53.0", "react-resizable-panels": "^2.1.3", "react-router-dom": "^6.28.0", + "recharts": "^2.14.1", "sonner": "^1.5.0", "tailwind-merge": "^2.5.5", "tailwindcss-animate": "^1.0.7", @@ -3491,6 +3493,31 @@ "@types/react": "*" } }, + "node_modules/@types/recharts": { + "version": "1.8.29", + "resolved": "https://registry.npmjs.org/@types/recharts/-/recharts-1.8.29.tgz", + "integrity": "sha512-ulKklaVsnFIIhTQsQw226TnOibrddW1qUQNFVhoQEyY1Z7FRQrNecFCGt7msRuJseudzE9czVawZb17dK/aPXw==", + "license": "MIT", + "dependencies": { + "@types/d3-shape": "^1", + "@types/react": "*" + } + }, + "node_modules/@types/recharts/node_modules/@types/d3-path": { + "version": "1.0.11", + "resolved": "https://registry.npmjs.org/@types/d3-path/-/d3-path-1.0.11.tgz", + "integrity": "sha512-4pQMp8ldf7UaB/gR8Fvvy69psNHkTpD/pVw3vmEi8iZAB9EPMBruB1JvHO4BIq9QkUUd2lV1F5YXpMNj7JPBpw==", + "license": "MIT" + }, + "node_modules/@types/recharts/node_modules/@types/d3-shape": { + "version": "1.3.12", + "resolved": "https://registry.npmjs.org/@types/d3-shape/-/d3-shape-1.3.12.tgz", + "integrity": "sha512-8oMzcd4+poSLGgV0R1Q1rOlx/xdmozS4Xab7np0eamFFUYq71AU9pOCJEFnkXW2aI/oXdVYJzw6pssbSut7Z9Q==", + "license": "MIT", + "dependencies": { + "@types/d3-path": "^1" + } + }, "node_modules/@typescript-eslint/eslint-plugin": { "version": "8.8.1", "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.8.1.tgz", @@ -5286,6 +5313,12 @@ } } }, + "node_modules/decimal.js-light": { + "version": "2.5.1", + "resolved": "https://registry.npmjs.org/decimal.js-light/-/decimal.js-light-2.5.1.tgz", + "integrity": "sha512-qIMFpTMZmny+MMIitAB6D7iVPEorVw6YQRWkvarTkT4tBeSLLiHzcwj6q0MmYSFCiVpiqPJTJEYIrpcPzVEIvg==", + "license": "MIT" + }, "node_modules/decompress-response": { "version": "3.3.0", "resolved": "https://registry.npmjs.org/decompress-response/-/decompress-response-3.3.0.tgz", @@ -5749,12 +5782,27 @@ "node": ">=0.10.0" } }, + "node_modules/eventemitter3": { + "version": "4.0.7", + "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz", + "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==", + "license": "MIT" + }, "node_modules/fast-deep-equal": { "version": "3.1.3", "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz", "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==", "dev": true }, + "node_modules/fast-equals": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/fast-equals/-/fast-equals-5.0.1.tgz", + "integrity": "sha512-WF1Wi8PwwSY7/6Kx0vKXtw8RwuSGoM1bvDaJbu7MxDlR1vovZjIAKrnzyrThgAjm6JDTu0fVgWXDlMGspodfoQ==", + "license": "MIT", + "engines": { + "node": ">=6.0.0" + } + }, "node_modules/fast-glob": { "version": "3.3.2", "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.2.tgz", @@ -6526,6 +6574,12 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/lodash": { + "version": "4.17.21", + "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", + "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", + "license": "MIT" + }, "node_modules/lodash-es": { "version": "4.17.21", "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz", @@ -7501,6 +7555,21 @@ "react-dom": ">=16.8" } }, + "node_modules/react-smooth": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/react-smooth/-/react-smooth-4.0.3.tgz", + "integrity": "sha512-PyxIrra8WZWrMRFcCiJsZ+JqFaxEINAt+v/w++wQKQlmO99Eh3+JTLeKApdTsLX2roBdWYXqPsaS8sO4UmdzIg==", + "license": "MIT", + "dependencies": { + "fast-equals": "^5.0.1", + "prop-types": "^15.8.1", + "react-transition-group": "^4.4.5" + }, + "peerDependencies": { + "react": "^16.8.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + } + }, "node_modules/react-style-singleton": { "version": "2.2.1", "resolved": "https://registry.npmjs.org/react-style-singleton/-/react-style-singleton-2.2.1.tgz", @@ -7558,6 +7627,44 @@ "node": ">=8.10.0" } }, + "node_modules/recharts": { + "version": "2.14.1", + "resolved": "https://registry.npmjs.org/recharts/-/recharts-2.14.1.tgz", + "integrity": "sha512-xtWulflkA+/xu4/QClBdtZYN30dbvTHjxjkh5XTMrH/CQ3WGDDPHHa/LLKCbgoqz0z3UaSH2/blV1i6VNMeh1g==", + "license": "MIT", + "dependencies": { + "clsx": "^2.0.0", + "eventemitter3": "^4.0.1", + "lodash": "^4.17.21", + "react-is": "^18.3.1", + "react-smooth": "^4.0.0", + "recharts-scale": "^0.4.4", + "tiny-invariant": "^1.3.1", + "victory-vendor": "^36.6.8" + }, + "engines": { + "node": ">=14" + }, + "peerDependencies": { + "react": "^16.0.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.0.0 || ^17.0.0 || ^18.0.0" + } + }, + "node_modules/recharts-scale": { + "version": "0.4.5", + "resolved": "https://registry.npmjs.org/recharts-scale/-/recharts-scale-0.4.5.tgz", + "integrity": "sha512-kivNFO+0OcUNu7jQquLXAxz1FIwZj8nrj+YkOKc5694NbjCvcT6aSZiIzNzd2Kul4o4rTto8QVR9lMNtxD4G1w==", + "license": "MIT", + "dependencies": { + "decimal.js-light": "^2.4.1" + } + }, + "node_modules/recharts/node_modules/react-is": { + "version": "18.3.1", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz", + "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==", + "license": "MIT" + }, "node_modules/regenerator-runtime": { "version": "0.14.1", "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz", @@ -8062,6 +8169,12 @@ "three": ">=0.168" } }, + "node_modules/tiny-invariant": { + "version": "1.3.3", + "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.3.3.tgz", + "integrity": "sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==", + "license": "MIT" + }, "node_modules/tinycolor2": { "version": "1.6.0", "resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.6.0.tgz", @@ -8281,6 +8394,28 @@ "react-dom": "^16.8 || ^17.0 || ^18.0" } }, + "node_modules/victory-vendor": { + "version": "36.9.2", + "resolved": "https://registry.npmjs.org/victory-vendor/-/victory-vendor-36.9.2.tgz", + "integrity": "sha512-PnpQQMuxlwYdocC8fIJqVXvkeViHYzotI+NJrCuav0ZYFoq912ZHBk3mCeuj+5/VpodOjPe1z0Fk2ihgzlXqjQ==", + "license": "MIT AND ISC", + "dependencies": { + "@types/d3-array": "^3.0.3", + "@types/d3-ease": "^3.0.0", + "@types/d3-interpolate": "^3.0.1", + "@types/d3-scale": "^4.0.2", + "@types/d3-shape": "^3.1.0", + "@types/d3-time": "^3.0.0", + "@types/d3-timer": "^3.0.0", + "d3-array": "^3.1.6", + "d3-ease": "^3.0.1", + "d3-interpolate": "^3.0.1", + "d3-scale": "^4.0.2", + "d3-shape": "^3.1.0", + "d3-time": "^3.0.0", + "d3-timer": "^3.0.1" + } + }, "node_modules/vite": { "version": "5.4.8", "resolved": "https://registry.npmjs.org/vite/-/vite-5.4.8.tgz", diff --git a/package.json b/package.json index 99964f1..1065529 100644 --- a/package.json +++ b/package.json @@ -47,6 +47,7 @@ "@tailwindcss/line-clamp": "^0.4.4", "@tailwindcss/typography": "^0.5.15", "@types/d3": "^7.4.3", + "@types/recharts": "^1.8.29", "class-variance-authority": "^0.7.0", "clsx": "^2.1.1", "cmdk": "^1.0.0", @@ -63,6 +64,7 @@ "react-hook-form": "^7.53.0", "react-resizable-panels": "^2.1.3", "react-router-dom": "^6.28.0", + "recharts": "^2.14.1", "sonner": "^1.5.0", "tailwind-merge": "^2.5.5", "tailwindcss-animate": "^1.0.7", diff --git a/src/components/ShareButtons.tsx b/src/components/ShareButtons.tsx index 371383c..3835d04 100644 --- a/src/components/ShareButtons.tsx +++ b/src/components/ShareButtons.tsx @@ -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 = ({ post }) => { - const url = window.location.href; - const title = `Check out ${post.character}'s blog post: ${post.title}`; - +export const ShareButtons: React.FC = ({ title, url = window.location.href }) => { const shareLinks = [ { name: 'Twitter', diff --git a/src/components/ui/calendar.tsx b/src/components/ui/calendar.tsx index 1b7bc45..1c59433 100644 --- a/src/components/ui/calendar.tsx +++ b/src/components/ui/calendar.tsx @@ -58,8 +58,8 @@ function Calendar({ ...classNames, }} components={{ - IconLeft: ({ ...props }) => , - IconRight: ({ ...props }) => , + IconLeft: () => , + IconRight: () => , }} {...props} /> diff --git a/src/components/ui/chart.tsx b/src/components/ui/chart.tsx index 13c1bd3..3d6fcd9 100644 --- a/src/components/ui/chart.tsx +++ b/src/components/ui/chart.tsx @@ -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 & - 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, '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( ( { active, @@ -188,10 +205,10 @@ const ChartTooltipContent = React.forwardRef< > {!nestLabel ? tooltipLabel : null}
- {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 (
{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 & { - hideIcon?: boolean; - nameKey?: string; - } ->( - ( - { className, hideIcon = false, payload, verticalAlign = 'bottom', nameKey }, - ref - ) => { - const { config } = useChart(); - - if (!payload?.length) { - return null; - } - - return ( -
- {payload.map((item) => { - const key = `${nameKey || item.dataKey || 'value'}`; - const itemConfig = getPayloadConfigFromPayload(config, item, key); - - return ( -
svg]:h-3 [&>svg]:w-3 [&>svg]:text-muted-foreground' - )} - > - {itemConfig?.icon && !hideIcon ? ( - - ) : ( -
- )} - {itemConfig?.label} -
- ); - })} -
- ); - } -); -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 }; diff --git a/src/components/ui/toast.tsx b/src/components/ui/toast.tsx index 48e2b11..505c274 100644 --- a/src/components/ui/toast.tsx +++ b/src/components/ui/toast.tsx @@ -83,7 +83,12 @@ const ToastDescription = React.forwardRef< )); ToastDescription.displayName = ToastPrimitives.Description.displayName; +type ToastProps = React.ComponentPropsWithoutRef; +type ToastActionElement = React.ReactElement; + export { + type ToastProps, + type ToastActionElement, ToastProvider, ToastViewport, Toast, diff --git a/src/pages/SuccessStories.tsx b/src/pages/SuccessStories.tsx index 1944fbd..75475b4 100644 --- a/src/pages/SuccessStories.tsx +++ b/src/pages/SuccessStories.tsx @@ -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 ( diff --git a/src/types/vendors.ts b/src/types/vendors.ts index c267f8f..c7f5523 100644 --- a/src/types/vendors.ts +++ b/src/types/vendors.ts @@ -5,6 +5,8 @@ export type VendorCategory = | 'catering' | 'music' | 'flowers' + | 'transport' + | 'stationery' | 'matchmaking' | 'modiste';