feat: add BlogBodySanitizer for HTML sanitization on article save

- Implemented BlogBodySanitizer to clean HTML content before saving articles, ensuring security against XSS attacks.
- Added tests for BlogBodySanitizer to verify that unsafe tags and attributes are stripped from the content.
- Introduced ApiLeastPrivilegeTest to ensure that unauthorized users cannot access sensitive API routes, maintaining strict access control.

assets/admin/components/layout/AdminLayout.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from 'react';
-import { Outlet } from 'react-router-dom';
+import { Outlet } from 'react-router';
 import Sidebar from './Sidebar';
 import Topbar from './Topbar';
 import { useUiStore, applyBrand } from '../../stores/uiStore';

assets/admin/components/layout/ProfileMenu.test.tsx

@@ -3,8 +3,8 @@ import { screen, fireEvent } from '@testing-library/react';
 import { renderWithProviders } from '../../test/utils';
 
 const navigateMock = vi.fn();
-vi.mock('react-router-dom', async () => {
-  const actual = await vi.importActual<typeof import('react-router-dom')>('react-router-dom');
+vi.mock('react-router', async () => {
+  const actual = await vi.importActual<typeof import('react-router')>('react-router');
   return { ...actual, useNavigate: () => navigateMock };
 });
 

assets/admin/components/layout/ProfileMenu.tsx

@@ -1,6 +1,6 @@
 import React, { useEffect, useRef, useState } from 'react';
 import ReactDOM from 'react-dom';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 import {
   ChevronDownIcon,
   UserCircleIcon,

assets/admin/components/layout/PurchaseSubscriptionSidebar.tsx

@@ -1,5 +1,5 @@
 import React, { useMemo, useState } from 'react';
-import { Link } from 'react-router-dom';
+import { Link } from 'react-router';
 import { SearchHeaderP } from '../../pages/subscriptionIcons';
 import { useAuthStore } from '../../stores/authStore';
 import { usePermissions } from '../../hooks/usePermissions';

assets/admin/components/layout/Sidebar.tsx

@@ -31,7 +31,7 @@ import {
     WrenchScrewdriverIcon,
 } from "@heroicons/react/24/outline";
 import { useState } from "react";
-import { NavLink, useLocation, useNavigate } from "react-router-dom";
+import { NavLink, useLocation, useNavigate } from "react-router";
 import { usePermissions } from "../../hooks/usePermissions";
 import { useSecretaryEarnings } from "../../hooks/useSecretaryEarnings";
 import { useSubscription } from "../../hooks/useSubscription";

assets/admin/components/layout/Topbar.test.tsx

@@ -3,8 +3,8 @@ import { screen, fireEvent } from '@testing-library/react';
 import { renderWithProviders } from '../../test/utils';
 
 const navigateMock = vi.fn();
-vi.mock('react-router-dom', async () => {
-  const actual = await vi.importActual<typeof import('react-router-dom')>('react-router-dom');
+vi.mock('react-router', async () => {
+  const actual = await vi.importActual<typeof import('react-router')>('react-router');
   return { ...actual, useNavigate: () => navigateMock };
 });
 

assets/admin/components/layout/Topbar.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 import {
   BellIcon, SunIcon, MoonIcon, Bars3Icon, Cog6ToothIcon,
   MagnifyingGlassIcon, XMarkIcon, CheckIcon,