diff --git a/app/javascript/dashboard/components/table/Table.vue b/app/javascript/dashboard/components/table/Table.vue
index 81edc4840..3e274f683 100644
--- a/app/javascript/dashboard/components/table/Table.vue
+++ b/app/javascript/dashboard/components/table/Table.vue
@@ -21,7 +21,7 @@ const props = defineProps({
 const isRelaxed = computed(() => props.type === 'relaxed');
 const headerClass = computed(() =>
   isRelaxed.value
-    ? 'first:rounded-bl-lg first:rounded-tl-lg last:rounded-br-lg last:rounded-tr-lg'
+    ? 'ltr:first:rounded-bl-lg ltr:first:rounded-tl-lg ltr:last:rounded-br-lg ltr:last:rounded-tr-lg rtl:first:rounded-br-lg rtl:first:rounded-tr-lg rtl:last:rounded-bl-lg rtl:last:rounded-tl-lg'
     : ''
 );
 </script>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/SummaryReports.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/SummaryReports.vue
index 7e0b9be8f..9b966c8fe 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/SummaryReports.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/SummaryReports.vue
@@ -59,7 +59,7 @@ const defaulSpanRender = cellProps =>
     cellProps.getValue()
   );
 
-const columns = [
+const columns = computed(() => [
   columnHelper.accessor('name', {
     header: t(`SUMMARY_REPORTS.${props.type.toUpperCase()}`),
     width: 300,
@@ -90,7 +90,7 @@ const columns = [
     width: 200,
     cell: defaulSpanRender,
   }),
-];
+]);
 
 const renderAvgTime = value => (value ? formatTime(value) : '--');
 
@@ -142,7 +142,9 @@ const table = useVueTable({
   get data() {
     return tableData.value;
   },
-  columns,
+  get columns() {
+    return columns.value;
+  },
   enableSorting: false,
   getCoreRowModel: getCoreRowModel(),
 });