desloppify: extract shared Premium features and move component data outside render
- PricingCards.tsx: Extract repeated Premium features array to PREMIUM_FEATURES constant - Footer.tsx: Move footerSections, socialLinks, and CURRENT_YEAR outside component to avoid recreation on every render
This commit is contained in:
Krystie
@@ -1,50 +1,50 @@
|
||||
import Link from 'next/link';
|
||||
import Image from 'next/image';
|
||||
|
||||
const footerSections = [
|
||||
{
|
||||
title: 'Product',
|
||||
links: [
|
||||
{ label: 'Features', href: '/features' },
|
||||
{ label: 'Pricing', href: '/pricing' },
|
||||
{ label: 'Documentation', href: '/docs' },
|
||||
{ label: 'About', href: '/about' },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: 'Resources',
|
||||
links: [
|
||||
{ label: 'Getting Started', href: '/docs' },
|
||||
{ label: 'API Reference', href: '/docs#api' },
|
||||
{ label: 'Community', href: '#' },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: 'Support',
|
||||
links: [
|
||||
{ label: 'Contact', href: 'mailto:support@dashcaddy.net' },
|
||||
{ label: 'Discord', href: '#' },
|
||||
{ label: 'Privacy Policy', href: '#' },
|
||||
{ label: 'Terms of Service', href: '#' },
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
const socialLinks = [
|
||||
{
|
||||
icon: (
|
||||
<svg className="h-5 w-5" fill="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M20.317 4.37a19.791 19.791 0 00-4.885-1.515a.074.074 0 00-.079.037c-.211.375-.444.864-.607 1.25a18.27 18.27 0 00-5.487 0c-.163-.386-.395-.875-.607-1.25a.077.077 0 00-.079-.037A19.736 19.736 0 003.677 4.37a.07.07 0 00-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 00.031.057 19.9 19.9 0 005.993 3.03.078.078 0 00.084-.028c.462-.63.873-1.295 1.226-1.994a.076.076 0 00-.042-.106 13.107 13.107 0 01-1.872-.892.077.077 0 01-.008-.128 10.2 10.2 0 00.372-.294.075.075 0 01.078-.01c3.928 1.793 8.18 1.793 12.062 0a.075.075 0 01.079.009c.12.098.246.198.373.295a.077.077 0 01-.006.127 12.299 12.299 0 01-1.873.892.076.076 0 00-.041.107c.359.698.77 1.364 1.225 1.994a.077.077 0 00.084.028 19.839 19.839 0 006.002-3.03.076.076 0 00.032-.057c.534-4.506-.9-8.4-3.821-11.865a.055.055 0 00-.032-.027zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.948-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.948 2.419-2.157 2.419zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.948-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.948 2.419-2.157 2.419z" />
|
||||
</svg>
|
||||
),
|
||||
label: 'Discord',
|
||||
href: '#',
|
||||
},
|
||||
];
|
||||
|
||||
const CURRENT_YEAR = new Date().getFullYear();
|
||||
|
||||
export default function Footer() {
|
||||
const currentYear = new Date().getFullYear();
|
||||
|
||||
const footerSections = [
|
||||
{
|
||||
title: 'Product',
|
||||
links: [
|
||||
{ label: 'Features', href: '/features' },
|
||||
{ label: 'Pricing', href: '/pricing' },
|
||||
{ label: 'Documentation', href: '/docs' },
|
||||
{ label: 'About', href: '/about' },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: 'Resources',
|
||||
links: [
|
||||
{ label: 'Getting Started', href: '/docs' },
|
||||
{ label: 'API Reference', href: '/docs#api' },
|
||||
{ label: 'Community', href: '#' },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: 'Support',
|
||||
links: [
|
||||
{ label: 'Contact', href: 'mailto:support@dashcaddy.net' },
|
||||
{ label: 'Discord', href: '#' },
|
||||
{ label: 'Privacy Policy', href: '#' },
|
||||
{ label: 'Terms of Service', href: '#' },
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
const socialLinks = [
|
||||
{
|
||||
icon: (
|
||||
<svg className="h-5 w-5" fill="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M20.317 4.37a19.791 19.791 0 00-4.885-1.515a.074.074 0 00-.079.037c-.211.375-.444.864-.607 1.25a18.27 18.27 0 00-5.487 0c-.163-.386-.395-.875-.607-1.25a.077.077 0 00-.079-.037A19.736 19.736 0 003.677 4.37a.07.07 0 00-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 00.031.057 19.9 19.9 0 005.993 3.03.078.078 0 00.084-.028c.462-.63.873-1.295 1.226-1.994a.076.076 0 00-.042-.106 13.107 13.107 0 01-1.872-.892.077.077 0 01-.008-.128 10.2 10.2 0 00.372-.294.075.075 0 01.078-.01c3.928 1.793 8.18 1.793 12.062 0a.075.075 0 01.079.009c.12.098.246.198.373.295a.077.077 0 01-.006.127 12.299 12.299 0 01-1.873.892.076.076 0 00-.041.107c.359.698.77 1.364 1.225 1.994a.077.077 0 00.084.028 19.839 19.839 0 006.002-3.03.076.076 0 00.032-.057c.534-4.506-.9-8.4-3.821-11.865a.055.055 0 00-.032-.027zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.948-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.948 2.419-2.157 2.419zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.948-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.948 2.419-2.157 2.419z" />
|
||||
</svg>
|
||||
),
|
||||
label: 'Discord',
|
||||
href: '#',
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<footer className="border-t border-surface-700/50 bg-surface-950">
|
||||
<div className="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 py-12">
|
||||
@@ -112,7 +112,7 @@ export default function Footer() {
|
||||
<div className="border-t border-surface-700/50 pt-8">
|
||||
<div className="flex flex-col sm:flex-row items-center justify-center gap-3">
|
||||
<p className="text-sm text-surface-500">
|
||||
© {currentYear} DashCaddy. All rights reserved. A product by
|
||||
© {CURRENT_YEAR} DashCaddy. All rights reserved. A product by
|
||||
</p>
|
||||
<Image
|
||||
src="/images/samiahmed7777-logo.png"
|
||||
|
||||
@@ -14,6 +14,13 @@ type Plan = {
|
||||
features: string[];
|
||||
};
|
||||
|
||||
// Premium features shared across all paid plans
|
||||
const PREMIUM_FEATURES = [
|
||||
'Auto-Login SSO',
|
||||
'Recipes (multi-container stack deployment)',
|
||||
'Docker Swarm orchestration'
|
||||
] as const;
|
||||
|
||||
export default function PricingCards() {
|
||||
const [loadingPlan, setLoadingPlan] = useState<string | null>(null);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
@@ -40,11 +47,7 @@ export default function PricingCards() {
|
||||
price: '$25',
|
||||
period: 'per month',
|
||||
description: 'Premium feature access for one month.',
|
||||
features: [
|
||||
'Auto-Login SSO',
|
||||
'Recipes (multi-container stack deployment)',
|
||||
'Docker Swarm orchestration'
|
||||
]
|
||||
features: [...PREMIUM_FEATURES]
|
||||
},
|
||||
{
|
||||
code: 'premium_3m',
|
||||
@@ -54,11 +57,7 @@ export default function PricingCards() {
|
||||
savings: 'Best short-term value',
|
||||
description: 'A better value plan for regular use.',
|
||||
highlighted: true,
|
||||
features: [
|
||||
'Auto-Login SSO',
|
||||
'Recipes (multi-container stack deployment)',
|
||||
'Docker Swarm orchestration'
|
||||
]
|
||||
features: [...PREMIUM_FEATURES]
|
||||
},
|
||||
{
|
||||
code: 'premium_6m',
|
||||
@@ -67,11 +66,7 @@ export default function PricingCards() {
|
||||
period: 'every 6 months',
|
||||
savings: 'Strong loyalty pricing',
|
||||
description: 'The commitment plan with aggressive value.',
|
||||
features: [
|
||||
'Auto-Login SSO',
|
||||
'Recipes (multi-container stack deployment)',
|
||||
'Docker Swarm orchestration'
|
||||
]
|
||||
features: [...PREMIUM_FEATURES]
|
||||
},
|
||||
{
|
||||
code: 'premium_12m',
|
||||
@@ -80,11 +75,7 @@ export default function PricingCards() {
|
||||
period: 'per year',
|
||||
savings: 'Best overall value',
|
||||
description: 'The best-value annual Premium plan.',
|
||||
features: [
|
||||
'Auto-Login SSO',
|
||||
'Recipes (multi-container stack deployment)',
|
||||
'Docker Swarm orchestration'
|
||||
]
|
||||
features: [...PREMIUM_FEATURES]
|
||||
}
|
||||
], []);
|
||||
|
||||
|
||||
Reference in New Issue
Block a user