feat(add features page):Added features page

Added features page.
Synchronously update SEO meta and corresponding international translations.
This commit is contained in:
david_bai
2025-07-24 23:32:16 +08:00
parent 1853063565
commit 60c20fcfa6
14 changed files with 150 additions and 28 deletions
+6 -2
View File
@@ -87,7 +87,11 @@ export default function HomeClient({ messages, lang }: PageContentProps) {
{/* Key Features */}
<section aria-label="Key Features">
<LazyLoadWrapper>
<KeyFeatures messages={messages} />
<KeyFeatures
messages={messages}
isInToolPage
titleClassName="text-2xl md:text-3xl"
/>
</LazyLoadWrapper>
</section>
{/* FAQ Section */}
@@ -95,7 +99,7 @@ export default function HomeClient({ messages, lang }: PageContentProps) {
<LazyLoadWrapper>
<FAQSection
messages={messages}
isMainPage
isInToolPage
titleClassName="text-2xl md:text-3xl"
/>
</LazyLoadWrapper>
+42
View File
@@ -0,0 +1,42 @@
import KeyFeatures from "@/components/web/KeyFeatures";
import type { Metadata } from "next";
import { getDictionary } from "@/lib/dictionary";
import { supportedLocales } from "@/constants/i18n-config";
export async function generateMetadata({
params,
}: {
params: { lang: string };
}): Promise<Metadata> {
const messages = await getDictionary(params.lang);
return {
title: messages.meta.features.title,
description: messages.meta.features.description,
keywords: messages.meta.features.keywords,
metadataBase: new URL("https://www.privydrop.app"),
alternates: {
canonical: `/${params.lang}/features`,
languages: Object.fromEntries(
supportedLocales.map((lang) => [lang, `/${lang}/features`])
),
},
openGraph: {
title: messages.meta.features.title,
description: messages.meta.features.description,
url: `https://www.privydrop.app/${params.lang}/features`,
siteName: "PrivyDrop",
locale: params.lang,
type: "website",
},
};
}
export default async function Features({
params: { lang },
}: {
params: { lang: string };
}) {
const messages = await getDictionary(lang);
return <KeyFeatures messages={messages} />;
}
+10 -1
View File
@@ -4,7 +4,16 @@ import { supportedLocales } from "@/constants/i18n-config";
export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
const baseUrl = "https://www.privydrop.app";
const languages = supportedLocales;
const routes = ["", "/about", "/help", "/faq", "/terms", "/privacy"];
const routes = [
"",
"/features",
"/blog",
"/about",
"/help",
"/faq",
"/terms",
"/privacy",
];
const urls: MetadataRoute.Sitemap = [];
+4 -4
View File
@@ -42,7 +42,7 @@ const generateFAQs = (messages: { text: { faqs: FAQMessage } }): FAQ[] => {
};
interface FAQSectionProps {
isMainPage?: boolean; // Whether it is the FAQ section of the main page
isInToolPage?: boolean; // Whether it is in the tool page (e.g. homepage)
className?: string; // Allow passing custom className
showTitle?: boolean; // Whether to display the title
titleClassName?: string; // Title style class
@@ -51,7 +51,7 @@ interface FAQSectionProps {
}
// Control the level and style of the title through props, so it can be used on other pages as well as on a standalone page
export default function FAQSection({
isMainPage = false,
isInToolPage = false,
className = "",
showTitle = true,
titleClassName = "",
@@ -67,7 +67,7 @@ export default function FAQSection({
return (
<div className={containerClasses}>
{showTitle &&
(isMainPage ? (
(isInToolPage ? (
<h2 className={`text-3xl ${titleClasses}`}>
{messages.text.faqs.FAQ_dis}
</h2>
@@ -92,7 +92,7 @@ export default function FAQSection({
// // On the home page
// <FAQSection
// isMainPage
// isInToolPage
// titleClassName="text-2xl md:text-3xl" // Optional: use a slightly smaller font size on the home page
// /> // Use h2 tag
+1
View File
@@ -28,6 +28,7 @@ const Header = ({ messages, lang }: HeaderProps) => {
// Configuration for navigation items
const navItems = [
{ href: `/${lang}`, label: messages.text.Header.Home_dis },
{ href: `/${lang}/features`, label: messages.text.Header.Features_dis },
{ href: `/${lang}/blog`, label: messages.text.Header.Blog_dis },
{ href: `/${lang}/about`, label: messages.text.Header.About_dis },
{ href: `/${lang}/help`, label: messages.text.Header.Help_dis },
+28 -6
View File
@@ -1,16 +1,38 @@
import Image from "next/image";
import type { Messages } from "@/types/messages";
interface PageContentProps {
interface KeyFeaturesProps {
isInToolPage?: boolean; // Whether it is in the tool page (e.g. homepage)
className?: string; // Custom style class
showTitle?: boolean; // Whether to display the title
titleClassName?: string; // Title style class
messages: Messages;
}
export default function KeyFeatures({ messages }: PageContentProps) {
export default function KeyFeatures({
isInToolPage = false,
className = "",
showTitle = true,
titleClassName = "",
messages
}: KeyFeaturesProps) {
// Set container styles
const containerClasses = `container mx-auto px-4 py-8 ${className}`;
const defaultTitleClasses = "font-semibold mb-6";
const titleClasses = `${defaultTitleClasses} ${titleClassName}`.trim();
return (
<section className="mb-12">
<h2 className="text-3xl font-semibold mb-6">
{messages.text.KeyFeatures.h2}
</h2>
<section className={containerClasses}>
{showTitle &&
(isInToolPage ? (
<h2 className={`text-3xl ${titleClasses}`}>
{messages.text.KeyFeatures.h2}
</h2>
) : (
<h1 className={`text-4xl ${titleClasses}`}>
{messages.text.KeyFeatures.h2}
</h1>
))}
<div className="space-y-6">
<div>
<h3 className="text-xl font-semibold mb-2 flex items-center">
+9 -3
View File
@@ -18,14 +18,19 @@ export const de: Messages = {
faq: {
title: "PrivyDrop FAQ",
description:
"Finden Sie Antworten auf häufig gestellte Fragen zu PrivyDrop, einschließlich der Frage, wie Sie Dateien senden, Clipboard-Inhalte teilen und sichere und private Datenübertragungen gewährleisten können.",
"Finden Sie Antworten auf häufig gestellte Fragen zu PrivyDrop, einschließlich wie man Dateien sendet, Zwischenablage-Inhalte teilt und sichere und private Datenübertragungen gewährleistet.",
keywords:
"PrivyDrop FAQ, häufig gestellte Fragen, sichere Dateifreigabe FAQ, Hilfe zur privaten Datenfreigabe, Ende-zu-Ende-verschlüsselte Dateiübertragung, Support für sicheres Clipboard-Sharing, wie man PrivyDrop verwendet, Dateiübertragungs-FAQ, Fragen zur datenschutzorientierten Freigabe, PrivyDrop-Problembehandlung",
"PrivyDrop FAQ,häufig gestellte Fragen,sichere Dateifreigabe FAQ,private Datenfreigabe Hilfe,Ende-zu-Ende verschlüsselte Dateiübertragung,sichere Zwischenablage-Freigabe Unterstützung,wie man PrivyDrop verwendet,Dateiübertragung FAQ,datenschutzorientierte Freigabe Fragen,PrivyDrop Fehlerbehebung",
},
features: {
title: "PrivyDrop Kernfunktionen: 6 Hauptvorteile der P2P-Dateiübertragung | Sicher & Unbegrenzt",
description: "Entdecken Sie PrivyDrops Kernfunktionen: Ende-zu-Ende verschlüsselte P2P-Direktübertragung, unbegrenzte Dateigröße, fortsetzbare Übertragungen, Teamzusammenarbeit, umweltfreundliches Design und Open-Source-Transparenz. Erleben Sie wirklich sichere und private Dateifreigabe.",
keywords: "P2P-Dateiübertragungsfunktionen,Ende-zu-Ende verschlüsselte Übertragung,fortsetzbare Dateiübertragung,unbegrenzte Dateifreigabe,Teamzusammenarbeit Tool,umweltfreundliche Dateiübertragung,Open-Source-Dateifreigabe,private Datenübertragung,WebRTC-Dateifreigabe,sichere Dateisynchronisation,geräteübergreifende Dateiübertragung,lokale Dateiverarbeitung",
},
help: {
title: "PrivyDrop Hilfe und Support",
description:
"Finden Sie Informationen darüber, wie Sie den PrivyDrop-Support kontaktieren können, sowie Links zu unseren Seiten Über uns, Nutzungsbedingungen und Datenschutzrichtlinien für weitere Details zu unserem Dienst.",
"Finden Sie Informationen darüber, wie Sie den PrivyDrop-Support kontaktieren können, sowie Links zu unseren Seiten Über uns, Nutzungsbedingungen und Datenschutzrichtlinie für weitere Details über unseren Service.",
},
privacy: {
title: "PrivyDrop Datenschutzrichtlinie",
@@ -45,6 +50,7 @@ export const de: Messages = {
About_dis: "Über uns",
Help_dis: "Hilfe",
FAQ_dis: "FAQ",
Features_dis: "Kernfunktionen",
Terms_dis: "Nutzungsbedingungen",
Privacy_dis: "Datenschutz",
},
+6
View File
@@ -19,6 +19,11 @@ export const en: Messages = {
keywords:
"PrivyDrop FAQ,frequently asked questions,secure file sharing FAQ,private data sharing help,end-to-end encrypted file transfer,secure clipboard sharing support,how to use PrivyDrop,file transfer FAQ,privacy-focused sharing questions,PrivyDrop troubleshooting",
},
features: {
title: "PrivyDrop Core Features: 6 Key Advantages of P2P File Transfer | Secure & Unlimited",
description: "Discover PrivyDrop's core features: end-to-end encrypted P2P direct transfer, unlimited file size, resumable transfers, team collaboration, eco-friendly design, and open-source transparency. Experience truly secure and private file sharing.",
keywords: "P2P file transfer features,end-to-end encrypted transfer,resumable file transfer,unlimited file sharing,team collaboration tool,eco-friendly file transfer,open source file sharing,private data transfer,WebRTC file sharing,secure file sync,cross-device file transfer,local file processing",
},
help: {
title: "PrivyDrop Help and Support",
description:
@@ -42,6 +47,7 @@ export const en: Messages = {
About_dis: "About",
Help_dis: "Help",
FAQ_dis: "FAQ",
Features_dis: "Features",
Terms_dis: "Terms",
Privacy_dis: "Privacy",
},
+10 -4
View File
@@ -16,16 +16,21 @@ export const es: Messages = {
"Conozca PrivyDrop, nuestra misión de proporcionar un servicio seguro y privado de transferencia de archivos y compartición de portapapeles, y nuestro compromiso con la privacidad y protección de datos.",
},
faq: {
title: "Preguntas Frecuentes de PrivyDrop",
title: "PrivyDrop FAQ",
description:
"Encuentre respuestas a preguntas frecuentes sobre PrivyDrop, incluyendo cómo enviar archivos, compartir contenido del portapapeles y asegurar transferencias seguras y privadas.",
"Encuentra respuestas a las preguntas frecuentes sobre PrivyDrop, incluyendo cómo enviar archivos, compartir contenido del portapapeles y asegurar transferencias de datos seguras y privadas.",
keywords:
"FAQ PrivyDrop,preguntas frecuentes,FAQ compartir archivos seguros,ayuda compartir datos privados,transferencia cifrada extremo a extremo,soporte compartir portapapeles seguro,cómo usar PrivyDrop,FAQ transferencia archivos,preguntas compartir privado,solución problemas PrivyDrop",
"PrivyDrop FAQ,preguntas frecuentes,FAQ de compartir archivos seguros,ayuda de compartir datos privados,transferencia de archivos cifrada de extremo a extremo,soporte de compartir portapapeles seguro,cómo usar PrivyDrop,FAQ de transferencia de archivos,preguntas de compartir centrado en privacidad,solución de problemas de PrivyDrop",
},
features: {
title: "Características Principales de PrivyDrop: 6 Ventajas Clave de la Transferencia P2P | Seguro e Ilimitado",
description: "Descubre las características principales de PrivyDrop: transferencia directa P2P cifrada de extremo a extremo, tamaño de archivo ilimitado, transferencias reanudables, colaboración en equipo, diseño ecológico y transparencia de código abierto. Experimenta el intercambio de archivos verdaderamente seguro y privado.",
keywords: "características de transferencia de archivos P2P,transferencia cifrada de extremo a extremo,transferencia de archivos reanudable,compartir archivos ilimitado,herramienta de colaboración en equipo,transferencia de archivos ecológica,compartir archivos de código abierto,transferencia de datos privados,compartir archivos WebRTC,sincronización de archivos segura,transferencia de archivos entre dispositivos,procesamiento de archivos local",
},
help: {
title: "Ayuda y Soporte de PrivyDrop",
description:
"Encuentre información sobre cómo contactar con el soporte de PrivyDrop, así como enlaces a nuestras páginas Acerca de, Términos de Uso y Política de Privacidad para más detalles sobre nuestro servicio.",
"Encuentra información sobre cómo contactar al soporte de PrivyDrop, así como enlaces a nuestras páginas de Acerca de, Términos de Uso y Política de Privacidad para más detalles sobre nuestro servicio.",
},
privacy: {
title: "Política de Privacidad de PrivyDrop",
@@ -47,6 +52,7 @@ export const es: Messages = {
FAQ_dis: "FAQ",
Terms_dis: "Términos",
Privacy_dis: "Privacidad",
Features_dis: "Características",
},
Footer: {
CopyrightNotice: "PrivyDrop. Todos los derechos reservados.",
+11 -5
View File
@@ -16,16 +16,21 @@ export const fr: Messages = {
"Découvrez PrivyDrop, notre mission de fournir un service de transfert de fichiers et de partage de presse-papiers sécurisé et privé, ainsi que notre engagement envers la protection de la vie privée et des données des utilisateurs.",
},
faq: {
title: "FAQ de PrivyDrop",
title: "PrivyDrop FAQ",
description:
"Trouvez des réponses aux questions fréquemment posées sur PrivyDrop, y compris comment envoyer des fichiers, partager du contenu de presse-papiers et assurer des transferts de données sécurisés et privés.",
"Trouvez des réponses aux questions fréquemment posées sur PrivyDrop, y compris comment envoyer des fichiers, partager le contenu du presse-papiers et assurer des transferts de données sécurisés et privés.",
keywords:
"FAQ PrivyDrop, questions fréquemment posées, FAQ partage de fichiers sécurisé, aide au partage de données privées, transfert de fichiers chiffré de bout en bout, support de partage de presse-papiers sécurisé, comment utiliser PrivyDrop, FAQ transfert de fichiers, questions sur le partage axé sur la confidentialité, dépannage PrivyDrop",
"PrivyDrop FAQ,questions fréquemment posées,FAQ de partage de fichiers sécurisé,aide au partage de données privées,transfert de fichiers chiffré de bout en bout,support de partage de presse-papiers sécurisé,comment utiliser PrivyDrop,FAQ de transfert de fichiers,questions de partage axées sur la confidentialité,dépannage PrivyDrop",
},
features: {
title: "Fonctionnalités Principales de PrivyDrop : 6 Avantages Clés du Transfert P2P | Sécurisé et Illimité",
description: "Découvrez les fonctionnalités principales de PrivyDrop : transfert direct P2P chiffré de bout en bout, taille de fichier illimitée, transferts reprenables, collaboration d'équipe, conception écologique et transparence open source. Vivez un partage de fichiers vraiment sécurisé et privé.",
keywords: "fonctionnalités de transfert de fichiers P2P,transfert chiffré de bout en bout,transfert de fichiers reprendre,partage de fichiers illimité,outil de collaboration d'équipe,transfert de fichiers écologique,partage de fichiers open source,transfert de données privées,partage de fichiers WebRTC,synchronisation de fichiers sécurisée,transfert de fichiers inter-appareils,traitement de fichiers local",
},
help: {
title: "Aide et support de PrivyDrop",
title: "Aide et Support PrivyDrop",
description:
"Trouvez des informations sur la façon de contacter le support de PrivyDrop, ainsi que des liens vers nos pages À propos, Conditions d'utilisation et Politique de confidentialité pour plus de détails sur notre service.",
"Trouvez des informations sur comment contacter le support PrivyDrop, ainsi que des liens vers nos pages À propos, Conditions d'utilisation et Politique de confidentialité pour plus de détails sur notre service.",
},
privacy: {
title: "Politique de confidentialité de PrivyDrop",
@@ -47,6 +52,7 @@ export const fr: Messages = {
FAQ_dis: "FAQ",
Terms_dis: "Conditions",
Privacy_dis: "Confidentialité",
Features_dis: "Fonctionnalités",
},
Footer: {
CopyrightNotice: "PrivyDrop. Tous droits réservés.",
+6
View File
@@ -22,6 +22,11 @@ export const ja: Messages = {
keywords:
"PrivyDrop FAQ,よくある質問,安全なファイル共有FAQ,プライベートデータ共有ヘルプ,エンドツーエンド暗号化ファイル転送,安全なクリップボード共有サポート,PrivyDropの使用方法,ファイル転送FAQ,プライバシー重視の共有質問,PrivyDropトラブルシューティング",
},
features: {
title: "PrivyDropコア機能:P2Pファイル転送の6つの主要な利点 | 安全で無制限",
description: "PrivyDropのコア機能を発見しましょう:エンドツーエンド暗号化P2P直接転送、無制限のファイルサイズ、再開可能な転送、チームコラボレーション、エコフレンドリーなデザイン、オープンソースの透明性。真に安全でプライベートなファイル共有を体験してください。",
keywords: "P2Pファイル転送機能,エンドツーエンド暗号化転送,再開可能なファイル転送,無制限ファイル共有,チームコラボレーションツール,エコフレンドリーファイル転送,オープンソースファイル共有,プライベートデータ転送,WebRTCファイル共有,安全なファイル同期,クロスデバイスファイル転送,ローカルファイル処理",
},
help: {
title: "PrivyDropヘルプとサポート",
description:
@@ -45,6 +50,7 @@ export const ja: Messages = {
About_dis: "について",
Help_dis: "ヘルプ",
FAQ_dis: "FAQ",
Features_dis: "機能",
Terms_dis: "利用規約",
Privacy_dis: "プライバシー",
},
+9 -3
View File
@@ -18,14 +18,19 @@ export const ko: Messages = {
faq: {
title: "PrivyDrop FAQ",
description:
"PrivyDrop에 대해 자주 묻는 질문에 대한 답변을 찾아보세요. 파일을 보내는 방법, 클립보드 콘텐츠 공유하는 방법, 안전하고 개인적인 데이터 전송 보장하는 방법을 포함합니다.",
"파일 전송 방법, 클립보드 콘텐츠 공유 방법, 안전하고 개인적인 데이터 전송 보장 방법을 포함하여 PrivyDrop에 대한 자주 묻는 질문의 답변을 찾아보세요.",
keywords:
"PrivyDrop FAQ, 자주 묻는 질문, 안전한 파일 공유 FAQ, 개인 데이터 공유 도움말, 엔드투엔드 암호화 파일 전송, 안전한 클립보드 공유 지원, PrivyDrop 사용 방법, 파일 전송 FAQ, 개인 정보 보호 중심 공유 질문, PrivyDrop 문제 해결",
"PrivyDrop FAQ,자주 묻는 질문,안전한 파일 공유 FAQ,개인 데이터 공유 도움말,종단간 암호화 파일 전송,안전한 클립보드 공유 지원,PrivyDrop 사용 방법,파일 전송 FAQ,개인정보 중심 공유 질문,PrivyDrop 문제 해결",
},
features: {
title: "PrivyDrop 핵심 기능: P2P 파일 전송의 6가지 주요 장점 | 안전하고 무제한",
description: "PrivyDrop의 핵심 기능을 발견하세요: 종단간 암호화 P2P 직접 전송, 무제한 파일 크기, 재개 가능한 전송, 팀 협업, 친환경 설계, 오픈 소스 투명성. 진정으로 안전하고 개인적인 파일 공유를 경험하세요.",
keywords: "P2P 파일 전송 기능,종단간 암호화 전송,재개 가능한 파일 전송,무제한 파일 공유,팀 협업 도구,친환경 파일 전송,오픈 소스 파일 공유,개인 데이터 전송,WebRTC 파일 공유,안전한 파일 동기화,교차 장치 파일 전송,로컬 파일 처리",
},
help: {
title: "PrivyDrop 도움말 및 지원",
description:
"PrivyDrop 지원팀에 문의하는 방법에 대한 정보와 서비스에 대한 자세한 내용을 확인할 수 있는 소개, 이용 약관 개인정보 보호정책 페이지 링크를 찾아보세요.",
"PrivyDrop 지원팀에 연락하는 방법에 대한 정보와 우리 서비스에 대한 자세한 내용을 제공하는 소개, 이용약관, 개인정보처리방침 페이지로의 링크를 찾아보세요.",
},
privacy: {
title: "PrivyDrop 개인정보 보호정책",
@@ -47,6 +52,7 @@ export const ko: Messages = {
FAQ_dis: "FAQ",
Terms_dis: "이용 약관",
Privacy_dis: "개인정보 보호",
Features_dis: "기능",
},
Footer: {
CopyrightNotice: "PrivyDrop. 모든 권리 보유.",
+6
View File
@@ -20,6 +20,11 @@ export const zh: Messages = {
keywords:
"PrivyDrop常见问题,文件共享FAQ,私密数据共享帮助,端到端加密文件传输,安全剪贴板共享支持,如何使用PrivyDrop,文件传输问题,隐私共享问题,PrivyDrop故障排除",
},
features: {
title: "PrivyDrop核心特性:P2P文件传输的6大优势 | 安全快速无限制",
description: "探索PrivyDrop的核心特性:端到端加密的P2P直连传输、无文件大小限制、断点续传、团队协作、环保节能、开源透明。体验真正安全私密的文件共享解决方案。",
keywords: "P2P文件传输特性,端到端加密传输,断点续传功能,无限制文件共享,团队协作工具,环保文件传输,开源文件共享,私密数据传输,WebRTC文件共享,安全文件同步,跨设备文件传输,本地文件处理",
},
help: {
title: "PrivyDrop帮助与支持",
description:
@@ -43,6 +48,7 @@ export const zh: Messages = {
About_dis: "关于",
Help_dis: "帮助",
FAQ_dis: "常见问题",
Features_dis: "核心特性",
Terms_dis: "条款",
Privacy_dis: "隐私",
},
+2
View File
@@ -10,6 +10,7 @@ export type Meta = {
home: MetaData;
about: MetaData;
faq: MetaData;
features: MetaData;
help: MetaData;
privacy: MetaData;
terms: MetaData;
@@ -21,6 +22,7 @@ export type Header = {
About_dis: string;
Help_dis: string;
FAQ_dis: string;
Features_dis: string;
Terms_dis: string;
Privacy_dis: string;
};