Suggest a feature

What would you like to see in the future?
Want to post? Log in or Sign up
Showing
posts
Enhanced Localization & Customization Hooks for the New React-Based Vendor Dashboard
1. Overview With the release of Dokan Pro’s modern (React-driven) vendor dashboard, many site owners have struggled to translate, hide, or reorder interface elements—especially within the new Analytics/Reports screens. Currently, numerous labels (e.g. “Show:”, dropdown options like “All products” or “Comparison,” and input placeholders such as “Type to search for product”) are neither exposed in Dokan’s own translation files nor filterable via PHP hooks. As a result, non-English‐speaking marketplaces (or single-language deployments) must resort to fragile JavaScript overrides that break on every minor UI change. This feature request proposes: Full internationalization of all UI strings (including analytics/report components, input placeholders, and dynamically loaded headings) New PHP filters/hooks to hide or reorder dashboard panels and table columns Ability to set global default tab/menu names per language—so that every new vendor sees, for example, “Продукти” instead of “Products” without manual renaming A streamlined mechanism to hide specific category/filter options in vendor tables without custom JS 2. Use Cases Single-Language Marketplace (e.g., Bulgarian): A marketplace owner wants every new vendor to see the dashboard entirely in Bulgarian, including custom‐built analytics cards and input placeholders. Relying on JS to patch untranslated strings is brittle and nearly impossible for dynamically injected React components. When a Bulgarian vendor clicks into the product search field, the placeholder (“Търсене на продукт”) must appear immediately—without a split-second flash of “Type to search for product.” Per-User / Global Default Menu Renaming: Right now, Dokan Pro’s Menu Manager works well for existing users, but there is no way to define default names for all future vendors (e.g., “Dashboard → Табло,” “Products → Продукти,” “Reports → Отчети”). Administrators must either rename each vendor’s menu manually or write custom code. A simple filter like php Copy Edit add_filter( 'dokan_vendor_dashboard_menu', function( $menus ) { $menus['products']['title'] = 'Продукти'; return $menus; } ); would solve it—if such a filter existed and applied to the React dashboard. Hiding or Collapsing Dashboard Panels / Analytics Cards: A store manager may not want “Top Products by Revenue” or “Orders Summary” visible for all vendors, or might want to collapse them by default. Ideally, a filter—e.g., php Copy Edit add_filter( 'dokan_reports_panels', function( $panels ) { unset( $panels['top_products_revenue'] ); return $panels; } ); would remove that card entirely, rather than requiring CSS/JS workarounds. Removing Specific Filters/Columns from Vendor Tables: In the “Products” table, there are category filters or columns (like “Category,” “Stock Status,” etc.) that site owners may wish to hide for a simplified view. An ability to programmatically remove columns—e.g.: php Copy Edit add_filter( 'dokan_products_table_columns', function( $columns ) { unset( $columns['category'], $columns['stock'] ); return $columns; } ); would allow a cleaner, more tailored vendor interface. 3. Proposed Solutions A. Expose All UI Strings for Translation Wrap Every Label & Placeholder in Translation Functions In PHP templates and React components, ensure all visible text uses __( 'String', 'dokan-lite' ) (or the appropriate text domain). Example: php Copy Edit And in React: js Copy Edit { __( 'Compare Products', 'dokan-lite' ) } Generate a Unified JSON/WP-Localize for React Use wp_localize_script() or @wordpress/i18n to feed a dokan-translations.json object so React components can call __() at runtime. Populate this JSON with every dynamic string, including dropdown options (“All products,” “Single product,” “Comparison”) and input placeholders. B. Add PHP Filters/Hooks for Dashboard Panels & Tabs Dashboard Panels Filter Introduce a hook like php Copy Edit /** * @param array $panels { * Array of panel definitions: 'panel_key' => [ 'title' => '', 'component' => '' ] * } */ do_action( 'dokan_dashboard_panels', &$panels ); Allow removing or reordering: php Copy Edit add_action( 'dokan_dashboard_panels', function( &$panels ) { unset( $panels['top_products_revenue'], $panels['orders_summary'] ); // Reindex or re‐order if needed. } ); Vendor Menu Titles Filter A filter before rendering menu items, for example: php Copy Edit /** * @hook dokan_vendor_dashboard_menu * @param array $menus Array of tab definitions: key => [ 'title' => '', 'url' => '' ] * @return array */ apply_filters( 'dokan_vendor_dashboard_menu', $menus ); Site owners could set default titles in functions.php or via a custom settings page. C. Control Table Columns & Filters via Hooks Products Table Columns Filter Before rendering the “Products” table, apply: php Copy Edit $columns = apply_filters( 'dokan_products_table_columns', $default_columns ); Example usage: php Copy Edit add_filter( 'dokan_products_table_columns', function( $cols ) { unset( $cols['category'], $cols['stock_status'] ); return $cols; } ); Reports/Analytics Filters Filter If the Reports page uses a PHP array for filter‐names (e.g., $filter_options), wrap it: php Copy Edit $filter_options = apply_filters( 'dokan_reports_filter_options', $filter_options ); Developers could then remove or rename specific filter labels (e.g., remove “Comparison”). 4. Benefits & Impact Maintainability & Future-Proofing Relying on PHP filters/hookable methods ensures that when Dokan or WooCommerce updates the underlying React components, existing customizations remain intact. Site owners avoid fragile JavaScript “mutation observers” that frequently break after minor UI changes. Full Localization for Single-Language Marketplaces Immediately serve a fully translated dashboard to Bulgarian vendors (or any other single-language market), without requiring site owners to learn React internals or monkey-patch elements. Encourage non-English-language adoption, expanding Dokan’s global user base. Better UX & Reduced Support Overhead When vendors see a consistent, fully translated interface (including placeholders that appear the instant an input is focused), they won’t be confused by mixed English/Bulgarian UI. Hiding unnecessary panels and columns streamlines the vendor experience, reducing clutter and support requests. Empower Developers & Integrators By offering documented filters (with code examples), third-party developers can build add-ons or theme integrations more easily. Encourages a more vibrant ecosystem of localized themes and marketplace extensions. 5. Backward Compatibility & Implementation Notes Graceful Fallback Existing installations without these new hooks should continue working as normal. The added filters/actions should default to including all panels/columns with English labels. When the filter does not exist, Dokan falls back to its current hard-coded behavior. WooCommerce Upstream Strings Because many Analytics/Reports strings come from WooCommerce core, collaborate upstream with WooCommerce to ensure those components are also internationalized. Until then, Dokan can expose filters that allow overriding the final rendered labels (e.g., a filter on $report_labels that merges WooCommerce’s translations with Dokan’s custom overrides). Documentation & Code Examples Each new hook should be documented in the official Dokan Developer Docs (https://docs.dokan.co/). Provide at least two or three code snippets per hook to demonstrate common use cases (e.g., hiding a panel, renaming a tab, customizing a table column). 6. Next Steps for Review Review & Incorporate Internationalization Hooks Identify all React components in dokan-lite/assets/js/modules/report-analytics (and similar folders) that output hard-coded text. Wrap each string in __() or _x() calls. Generate an updated POT file that includes these new strings so site owners can translate everything via Loco Translate. Define & Register New Filters in PHP Backend In includes/Dashboard/, add filter points for: Dashboard panels (dokan_dashboard_panels) Vendor menu items (dokan_vendor_dashboard_menu) Table columns (dokan_products_table_columns, dokan_orders_table_columns, etc.) Report filter options (dokan_reports_filter_options) Publish Documentation & Examples Add a “Developer” section to Dokan Docs showing how to use these new filters. Example gist or code sandbox demonstrating a single-language Bulgarian site using these hooks to fully localize and simplify the dashboard. Release Timeline & Backport Strategy Ideally, include these updates in the next minor release (e.g., 3.8.x) so that affected merchants can immediately benefit. Ensure that documentation is updated at the same time to minimize confusion. Conclusion: By adding comprehensive translation support for all dynamic UI strings and providing well-documented PHP filters to hide or rename dashboard components, Dokan Pro will dramatically improve the experience for non-English marketplaces and developer integrators. These enhancements will reduce the reliance on fragile JavaScript workarounds, streamline vendor onboarding, and strengthen Dokan’s position as a truly global, customizable multi-vendor platform.
1