feat(i18n): add Persian (Farsi) localization with RTL support

apps/live/src/lib/pdf/node-renderers.tsx

@@ -88,6 +88,11 @@ const getFlexAlignStyle = (textAlign: string | null | undefined): Style => {
   return {};
 };
 
+const getRtlStyle = (dir: string | null | undefined): Style => {
+  if (dir !== "rtl") return {};
+  return { fontFamily: "Vazirmatn" };
+};
+
 export const nodeRenderers: NodeRendererRegistry = {
   doc: (_node: TipTapNode, children: ReactElement[], ctx: PDFRenderContext): ReactElement => (
     <View key={ctx.getKey()}>{children}</View>
@@ -98,16 +103,21 @@ export const nodeRenderers: NodeRendererRegistry = {
 
   paragraph: (node: TipTapNode, children: ReactElement[], ctx: PDFRenderContext): ReactElement => {
     const textAlign = node.attrs?.textAlign as string | null;
+    const dir = node.attrs?.dir as string | null | undefined;
+    const isRtl = dir === "rtl";
+    // For RTL paragraphs with no explicit alignment, default to right-aligned
+    const effectiveTextAlign = textAlign ?? (isRtl ? "right" : null);
     const background = node.attrs?.backgroundColor as string | undefined;
-    const alignStyle = getTextAlignStyle(textAlign);
-    const flexStyle = getFlexAlignStyle(textAlign);
+    const alignStyle = getTextAlignStyle(effectiveTextAlign);
+    const flexStyle = getFlexAlignStyle(effectiveTextAlign);
+    const rtlStyle = getRtlStyle(dir);
     const resolvedBgColor =
       background && background !== "default" ? resolveColorForPdf(background, "background") : null;
     const bgStyle = resolvedBgColor ? { backgroundColor: resolvedBgColor } : {};
 
     return (
       <View key={ctx.getKey()} style={[pdfStyles.paragraphWrapper, flexStyle, bgStyle]}>
-        <Text style={[pdfStyles.paragraph, alignStyle, bgStyle]}>{children}</Text>
+        <Text style={[pdfStyles.paragraph, alignStyle, rtlStyle, bgStyle]}>{children}</Text>
       </View>
     );
   },
@@ -117,12 +127,17 @@ export const nodeRenderers: NodeRendererRegistry = {
     const styleKey = `heading${level}` as keyof typeof pdfStyles;
     const style = pdfStyles[styleKey] || pdfStyles.heading1;
     const textAlign = node.attrs?.textAlign as string | null;
-    const alignStyle = getTextAlignStyle(textAlign);
-    const flexStyle = getFlexAlignStyle(textAlign);
+    const dir = node.attrs?.dir as string | null | undefined;
+    const isRtl = dir === "rtl";
+    // For RTL headings with no explicit alignment, default to right-aligned
+    const effectiveTextAlign = textAlign ?? (isRtl ? "right" : null);
+    const alignStyle = getTextAlignStyle(effectiveTextAlign);
+    const flexStyle = getFlexAlignStyle(effectiveTextAlign);
+    const rtlStyle = getRtlStyle(dir);
 
     return (
       <View key={ctx.getKey()} style={flexStyle}>
-        <Text style={[style, alignStyle]}>{children}</Text>
+        <Text style={[style, alignStyle, rtlStyle]}>{children}</Text>
       </View>
     );
   },

apps/live/src/lib/pdf/plane-pdf-exporter.tsx

@@ -50,6 +50,25 @@ Font.register({
   ],
 });
 
+// Resolve Vazirmatn font files from the fonts directory at the package root.
+// Place the woff files at apps/live/fonts/vazirmatn/ before starting the server.
+// Download from: https://github.com/rastikerdar/vazirmatn/releases
+const vazirmatnFontDir = path.resolve(process.cwd(), "fonts/vazirmatn");
+
+Font.register({
+  family: "Vazirmatn",
+  fonts: [
+    {
+      src: path.join(vazirmatnFontDir, "vazirmatn-regular.woff"),
+      fontWeight: 400,
+    },
+    {
+      src: path.join(vazirmatnFontDir, "vazirmatn-bold.woff"),
+      fontWeight: 700,
+    },
+  ],
+});
+
 export const createPdfDocument = (doc: TipTapDocument, options: PDFExportOptions = {}) => {
   const { title, author, subject, pageSize = "A4", pageOrientation = "portrait", metadata, noAssets } = options;
 

apps/web/core/components/editor/pdf/document.tsx

@@ -17,6 +17,11 @@ import interSemibold from "@/app/assets/fonts/inter/semibold.ttf?url";
 import interThin from "@/app/assets/fonts/inter/thin.ttf?url";
 import interUltraBold from "@/app/assets/fonts/inter/ultrabold.ttf?url";
 import interUltraLight from "@/app/assets/fonts/inter/ultralight.ttf?url";
+// Vazirmatn — Persian/Arabic font for RTL content.
+// Place font files at apps/web/app/assets/fonts/vazirmatn/ before building.
+// Download from: https://github.com/rastikerdar/vazirmatn/releases
+import vazirmatnBold from "@/app/assets/fonts/vazirmatn/bold.ttf?url";
+import vazirmatnRegular from "@/app/assets/fonts/vazirmatn/regular.ttf?url";
 // constants
 import { EDITOR_PDF_DOCUMENT_STYLESHEET } from "@/constants/editor";
 
@@ -44,6 +49,14 @@ Font.register({
   ],
 });
 
+Font.register({
+  family: "Vazirmatn",
+  fonts: [
+    { src: vazirmatnRegular, fontWeight: "normal" },
+    { src: vazirmatnBold, fontWeight: "bold" },
+  ],
+});
+
 type Props = {
   content: string;
   pageFormat: PageProps["size"];

apps/web/core/constants/editor.ts

@@ -236,6 +236,12 @@ const EDITOR_PDF_FONT_FAMILY_STYLES: Styles = {
   ".courier-bold": {
     fontFamily: "Courier-Bold",
   },
+  // RTL content (Persian, Arabic, Hebrew, etc.) — use a font that carries
+  // the required Unicode shaping tables so letters connect correctly.
+  "[dir='rtl']": {
+    fontFamily: "Vazirmatn",
+    textAlign: "right",
+  },
 };
 
 const EDITOR_PDF_TYPOGRAPHY_STYLES: Styles = {

packages/i18n/src/constants/language.ts

@@ -28,6 +28,17 @@ export const SUPPORTED_LANGUAGES: ILanguageOption[] = [
   { label: "Română", value: "ro" },
   { label: "Tiếng việt", value: "vi-VN" },
   { label: "Türkçe", value: "tr-TR" },
+  { label: "فارسی", value: "fa" },
 ];
 
 export const LANGUAGE_STORAGE_KEY = "userLanguage";
+
+// Languages that render right-to-left. Used to set the document `dir` attribute
+// so the entire UI layout (not just text) mirrors for these locales.
+// When adding a new RTL locale (e.g. Arabic "ar", Hebrew "he", Urdu "ur"),
+// register it in TLanguage + SUPPORTED_LANGUAGES first, then add it here.
+export const RTL_LANGUAGES: TLanguage[] = ["fa"];
+
+export const isRTLLanguage = (lng: TLanguage): boolean => RTL_LANGUAGES.includes(lng);
+
+export const getLanguageDirection = (lng: TLanguage): "rtl" | "ltr" => (isRTLLanguage(lng) ? "rtl" : "ltr");

packages/i18n/src/core/set-language.ts

@@ -5,7 +5,7 @@
  */
 
 import { initPromise, i18nInstance } from "./instance";
-import { LANGUAGE_STORAGE_KEY } from "../constants/language";
+import { LANGUAGE_STORAGE_KEY, getLanguageDirection } from "../constants/language";
 import type { TLanguage } from "../types";
 
 export async function setLanguage(lng: TLanguage): Promise<void> {
@@ -14,5 +14,8 @@ export async function setLanguage(lng: TLanguage): Promise<void> {
   if (typeof window !== "undefined") {
     localStorage.setItem(LANGUAGE_STORAGE_KEY, lng);
     document.documentElement.lang = lng;
+    // Mirror the whole UI for RTL locales (e.g. Persian) by setting the
+    // document direction, not just translating the text.
+    document.documentElement.dir = getLanguageDirection(lng);
   }
 }

packages/i18n/src/index.ts

@@ -20,4 +20,11 @@ export type { TNamespace } from "./constants/namespaces";
 export { setLanguage } from "./core/set-language";
 
 // Constants
-export { FALLBACK_LANGUAGE, SUPPORTED_LANGUAGES, LANGUAGE_STORAGE_KEY } from "./constants/language";
+export {
+  FALLBACK_LANGUAGE,
+  SUPPORTED_LANGUAGES,
+  LANGUAGE_STORAGE_KEY,
+  RTL_LANGUAGES,
+  isRTLLanguage,
+  getLanguageDirection,
+} from "./constants/language";

packages/i18n/src/locales/fa/accessibility.json

@@ -0,0 +1,34 @@
+{
+  "aria_labels": {
+    "projects_sidebar": {
+      "workspace_logo": "لوگوی فضای کاری",
+      "open_workspace_switcher": "باز کردن تغییردهنده فضای کاری",
+      "open_user_menu": "باز کردن منوی کاربر",
+      "open_command_palette": "باز کردن پالت دستور",
+      "open_extended_sidebar": "باز کردن نوار کناری گسترده",
+      "close_extended_sidebar": "بستن نوار کناری گسترده",
+      "create_favorites_folder": "ایجاد پوشه موردعلاقه‌ها",
+      "open_folder": "باز کردن پوشه",
+      "close_folder": "بستن پوشه",
+      "open_favorites_menu": "باز کردن منوی موردعلاقه‌ها",
+      "close_favorites_menu": "بستن منوی موردعلاقه‌ها",
+      "enter_folder_name": "وارد کردن نام پوشه",
+      "create_new_project": "ایجاد پروژه جدید",
+      "open_projects_menu": "باز کردن منوی پروژه‌ها",
+      "close_projects_menu": "بستن منوی پروژه‌ها",
+      "toggle_quick_actions_menu": "نمایش/پنهان کردن منوی عملکردهای سریع",
+      "open_project_menu": "باز کردن منوی پروژه",
+      "close_project_menu": "بستن منوی پروژه",
+      "collapse_sidebar": "جمع کردن نوار کناری",
+      "expand_sidebar": "گسترش نوار کناری",
+      "edition_badge": "باز کردن مودال پلن‌های پولی"
+    },
+    "auth_forms": {
+      "clear_email": "پاک کردن ایمیل",
+      "show_password": "نمایش رمز عبور",
+      "hide_password": "پنهان کردن رمز عبور",
+      "close_alert": "بستن هشدار",
+      "close_popover": "بستن پاپ‌اور"
+    }
+  }
+}