feat(dashboard): support RTL in dashboard (#11252)

* fix: add direction attribute to components and adjust styles for RTL support

* fix(data-grid): comment it out

* Added useDocumentDirection hook

* refactor: Integrate useDocumentDirection hook

* refactor: Standardize direction prop usage across components

* resolve

* fix: resolve build errors

* fix : remove unused useDocument

* Apply RTL styles for some components

* Create smooth-gorillas-hide.md

* refactor: update some styles for RTL support

---------

Co-authored-by: William Bouchard <46496014+willbouch@users.noreply.github.com>

packages/admin/dashboard/src/providers/i18n-provider/i18n-provider.tsx

@@ -1,5 +1,5 @@
 import { I18nProvider as Provider } from "@medusajs/ui"
-import { PropsWithChildren } from "react"
+import { PropsWithChildren, useEffect } from "react"
 import { useTranslation } from "react-i18next"
 import { languages } from "../../i18n/languages"
 
@@ -12,9 +12,14 @@ const formatLocaleCode = (code: string) => {
 export const I18nProvider = ({ children }: I18nProviderProps) => {
   const { i18n } = useTranslation()
 
-  const locale =
-    languages.find((lan) => lan.code === i18n.language)?.code ||
-    languages[0].code
+  const currentLanguage =
+    languages.find((lan) => lan.code === i18n.language) || languages[0]
+  const locale = currentLanguage.code
+  const direction = currentLanguage.ltr ? "ltr" : "rtl"
+
+  useEffect(() => {
+    document.documentElement.setAttribute("dir", direction)
+  }, [direction])
 
   return <Provider locale={formatLocaleCode(locale)}>{children}</Provider>
 }