[BUG] Arrows directions in RTL (Right to Left)

[youssefsiam38]

Describe the bug

Arrows used for navigation are always pointing to the same direction as LTR, regardless of the UI direction (LTR or RTL). This can be confusing for users navigating the UI in RTL mode, where the expectation is for the arrows to point to the different direction.

Steps To Reproduce

1. Set the UI direction to RTL (Right-to-Left) in your Refinejs project.
2. Navigate to any page containing one or more arrows used for navigation
3. Observe that the arrows are all pointing to the same direction as LTR.

Expected behavior

In RTL mode, the arrows used for navigation should be flipped so that they point to the opposite direction. This would be consistent with the user's expectation when navigating a right-to-left UI.

Packages

{
  "dependencies": {
    "@refinedev/antd": "^5.38.1",
    "@refinedev/cli": "^2.16.31",
    "@refinedev/core": "^4.49.2",
    "@refinedev/react-router-v6": "^4.5.9",
    "@refinedev/simple-rest": "^5.0.6",
    "@uiw/react-md-editor": "^3.19.5",
    "antd": "5.16.5",
    "react": "^18.0.0",
    "react-dom": "^18.0.0",
    "react-router-dom": "^6.8.1"
  },
  "devDependencies": {
    "@types/node": "^18.16.2",
    "@types/react": "^18.0.0",
    "@types/react-dom": "^18.0.0",
    "@vitejs/plugin-react": "^4.2.1",
    "typescript": "^5.4.2",
    "vite": "^5.1.6"
  }
}

Additional Context

No response

[ShatilKhan]

Can I take a look at it?
And if possible can you provide the files in the codebase I can look at to understand this problem better?

[youssefsiam38]

@ShatilKhan You just need to run the rtl example provided at
https://github.com/refinedev/refine/tree/master/examples/customization-rtl

npm create refine-app@latest -- --example customization-rtl

[ApsMJ23]

@alicanerdurmaz Can you please assign this issue to me, I think I can fix it!!

[BatuhanW]

@ApsMJ23 Assigned to you.

[ApsMJ23]

@BatuhanW I have raised a PR for this issue #5984 please review