chore: file formatting
This commit is contained in:
@@ -1,11 +1,11 @@
|
||||
import { BytescaleUploader } from "@/components/BytescaleUploader/BytescaleUploader";
|
||||
import { BytescaleUploader } from '@/components/BytescaleUploader/BytescaleUploader';
|
||||
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import { Textarea } from "@/components/ui/textarea";
|
||||
import { Badge } from '@/components/ui/badge';
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { Label } from '@/components/ui/label';
|
||||
import { Textarea } from '@/components/ui/textarea';
|
||||
|
||||
import { X } from "lucide-react";
|
||||
import { X } from 'lucide-react';
|
||||
|
||||
interface SeoData {
|
||||
seoTitle?: string;
|
||||
@@ -21,15 +21,10 @@ interface SeoFieldsProps {
|
||||
value?: SeoData;
|
||||
onChange: (seo: SeoData) => void;
|
||||
slug?: string;
|
||||
folderPath?: "/seo";
|
||||
folderPath?: '/seo';
|
||||
}
|
||||
|
||||
export default function SeoFields({
|
||||
value,
|
||||
onChange,
|
||||
slug,
|
||||
folderPath = "/seo",
|
||||
}: SeoFieldsProps) {
|
||||
export default function SeoFields({ value, onChange, slug, folderPath = '/seo' }: SeoFieldsProps) {
|
||||
const seo = value || {};
|
||||
|
||||
const updateSeo = (field: keyof SeoData, fieldValue: any) => {
|
||||
@@ -41,8 +36,8 @@ export default function SeoFields({
|
||||
|
||||
const removeTag = (index: number) => {
|
||||
updateSeo(
|
||||
"tags",
|
||||
(seo.tags || []).filter((_, i) => i !== index),
|
||||
'tags',
|
||||
(seo.tags || []).filter((_, i) => i !== index)
|
||||
);
|
||||
};
|
||||
|
||||
@@ -52,9 +47,7 @@ export default function SeoFields({
|
||||
<div>
|
||||
<h3 className="text-lg font-bold">SEO Settings</h3>
|
||||
|
||||
<p className="text-sm text-muted-foreground">
|
||||
Optimize for Google & social sharing
|
||||
</p>
|
||||
<p className="text-sm text-muted-foreground">Optimize for Google & social sharing</p>
|
||||
</div>
|
||||
|
||||
<Badge variant="secondary">Optional</Badge>
|
||||
@@ -64,41 +57,33 @@ export default function SeoFields({
|
||||
<div className="flex items-center justify-between">
|
||||
<Label className="text-sm font-semibold">SEO Title</Label>
|
||||
|
||||
<span className="text-xs text-muted-foreground">
|
||||
{seo.seoTitle?.length || 0}/60
|
||||
</span>
|
||||
<span className="text-xs text-muted-foreground">{seo.seoTitle?.length || 0}/60</span>
|
||||
</div>
|
||||
|
||||
<Input
|
||||
placeholder="Best Health Checkup Package in Kochi"
|
||||
value={seo.seoTitle || ""}
|
||||
onChange={(e) => updateSeo("seoTitle", e.target.value)}
|
||||
value={seo.seoTitle || ''}
|
||||
onChange={(e) => updateSeo('seoTitle', e.target.value)}
|
||||
/>
|
||||
|
||||
<p className="text-xs text-muted-foreground">
|
||||
Recommended: 50–60 characters
|
||||
</p>
|
||||
<p className="text-xs text-muted-foreground">Recommended: 50–60 characters</p>
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
<div className="flex items-center justify-between">
|
||||
<Label className="text-sm font-semibold">Meta Description</Label>
|
||||
|
||||
<span className="text-xs text-muted-foreground">
|
||||
{seo.metaDescription?.length || 0}/160
|
||||
</span>
|
||||
<span className="text-xs text-muted-foreground">{seo.metaDescription?.length || 0}/160</span>
|
||||
</div>
|
||||
|
||||
<Textarea
|
||||
rows={4}
|
||||
placeholder="Short description shown in Google search results"
|
||||
value={seo.metaDescription || ""}
|
||||
onChange={(e) => updateSeo("metaDescription", e.target.value)}
|
||||
value={seo.metaDescription || ''}
|
||||
onChange={(e) => updateSeo('metaDescription', e.target.value)}
|
||||
/>
|
||||
|
||||
<p className="text-xs text-muted-foreground">
|
||||
Recommended: 150–160 characters
|
||||
</p>
|
||||
<p className="text-xs text-muted-foreground">Recommended: 150–160 characters</p>
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
@@ -106,8 +91,8 @@ export default function SeoFields({
|
||||
|
||||
<Input
|
||||
placeholder="health checkup package kochi"
|
||||
value={seo.focusKeyphrase || ""}
|
||||
onChange={(e) => updateSeo("focusKeyphrase", e.target.value)}
|
||||
value={seo.focusKeyphrase || ''}
|
||||
onChange={(e) => updateSeo('focusKeyphrase', e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -122,11 +107,7 @@ export default function SeoFields({
|
||||
>
|
||||
<span>{tag}</span>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => removeTag(index)}
|
||||
className="hover:text-red-500 transition-colors"
|
||||
>
|
||||
<button type="button" onClick={() => removeTag(index)} className="hover:text-red-500 transition-colors">
|
||||
<X className="h-3 w-3" />
|
||||
</button>
|
||||
</div>
|
||||
@@ -136,16 +117,16 @@ export default function SeoFields({
|
||||
placeholder="Type keyword and press Enter"
|
||||
className="border-0 shadow-none focus-visible:ring-0 min-w-[220px] flex-1"
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === "Enter" && e.currentTarget.value.trim()) {
|
||||
if (e.key === 'Enter' && e.currentTarget.value.trim()) {
|
||||
e.preventDefault();
|
||||
|
||||
const newTag = e.currentTarget.value.trim();
|
||||
|
||||
if (!(seo.tags || []).includes(newTag)) {
|
||||
updateSeo("tags", [...(seo.tags || []), newTag]);
|
||||
updateSeo('tags', [...(seo.tags || []), newTag]);
|
||||
}
|
||||
|
||||
e.currentTarget.value = "";
|
||||
e.currentTarget.value = '';
|
||||
}
|
||||
}}
|
||||
/>
|
||||
@@ -159,9 +140,7 @@ export default function SeoFields({
|
||||
<div>
|
||||
<h4 className="font-bold">Open Graph (Social Preview)</h4>
|
||||
|
||||
<p className="text-sm text-muted-foreground">
|
||||
Facebook, WhatsApp & Twitter sharing
|
||||
</p>
|
||||
<p className="text-sm text-muted-foreground">Facebook, WhatsApp & Twitter sharing</p>
|
||||
</div>
|
||||
|
||||
<Badge variant="secondary">Optional</Badge>
|
||||
@@ -172,13 +151,11 @@ export default function SeoFields({
|
||||
|
||||
<Input
|
||||
placeholder="Title for social sharing"
|
||||
value={seo.ogTitle || ""}
|
||||
onChange={(e) => updateSeo("ogTitle", e.target.value)}
|
||||
value={seo.ogTitle || ''}
|
||||
onChange={(e) => updateSeo('ogTitle', e.target.value)}
|
||||
/>
|
||||
|
||||
<p className="text-xs text-muted-foreground">
|
||||
If empty, SEO title will be used
|
||||
</p>
|
||||
<p className="text-xs text-muted-foreground">If empty, SEO title will be used</p>
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
@@ -187,22 +164,20 @@ export default function SeoFields({
|
||||
<Textarea
|
||||
rows={4}
|
||||
placeholder="Description for social sharing"
|
||||
value={seo.ogDescription || ""}
|
||||
onChange={(e) => updateSeo("ogDescription", e.target.value)}
|
||||
value={seo.ogDescription || ''}
|
||||
onChange={(e) => updateSeo('ogDescription', e.target.value)}
|
||||
/>
|
||||
|
||||
<p className="text-xs text-muted-foreground">
|
||||
If empty, meta description will be used
|
||||
</p>
|
||||
<p className="text-xs text-muted-foreground">If empty, meta description will be used</p>
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
<Label className="text-sm font-semibold">OG Image</Label>
|
||||
|
||||
<BytescaleUploader
|
||||
value={seo.ogImage || ""}
|
||||
value={seo.ogImage || ''}
|
||||
folderPath={folderPath}
|
||||
onChange={(url) => updateSeo("ogImage", url)}
|
||||
onChange={(url) => updateSeo('ogImage', url)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user