🧭 fix: Add Base Path Support for Login/Register and Image Paths (#10116)

* fix: add basePath pattern to support login/register and image paths

* Fix linter errors

* refactor: Update import statements for getBasePath and isEnabled, and add path utility functions with tests

- Refactored imports in addImages.js and StableDiffusion.js to use getBasePath from '@librechat/api'.
- Consolidated isEnabled and getBasePath imports in validateImageRequest.js.
- Introduced new path utility functions in path.ts and corresponding unit tests in path.spec.ts to validate base path extraction logic.

* fix: Update domain server base URL in MarkdownComponents and refactor authentication redirection logic

- Changed the domain server base URL in MarkdownComponents.tsx to use the API base URL.
- Refactored the useAuthRedirect hook to utilize React Router's navigate for redirection instead of window.location, ensuring a smoother SPA experience.
- Added unit tests for the useAuthRedirect hook to verify authentication redirection behavior.

* test: Mock isEnabled in validateImages.spec.js for improved test isolation

- Updated validateImages.spec.js to mock the isEnabled function from @librechat/api, ensuring that tests can run independently of the actual implementation.
- Cleared the DOMAIN_CLIENT environment variable before tests to avoid interference with basePath resolution.

---------

Co-authored-by: Danny Avila <danny@librechat.ai>

client/src/components/Chat/Messages/Content/MarkdownComponents.tsx

@@ -1,7 +1,7 @@
 import React, { memo, useMemo, useRef, useEffect } from 'react';
 import { useRecoilValue } from 'recoil';
 import { useToastContext } from '@librechat/client';
-import { PermissionTypes, Permissions, dataService } from 'librechat-data-provider';
+import { PermissionTypes, Permissions, apiBaseUrl } from 'librechat-data-provider';
 import CodeBlock from '~/components/Messages/Content/CodeBlock';
 import useHasAccess from '~/hooks/Roles/useHasAccess';
 import { useFileDownload } from '~/data-provider';
@@ -135,7 +135,7 @@ export const a: React.ElementType = memo(({ href, children }: TAnchorProps) => {
   props.onClick = handleDownload;
   props.target = '_blank';
 
-  const domainServerBaseUrl = dataService.getDomainServerBaseUrl();
+  const domainServerBaseUrl = `${apiBaseUrl()}/api`;
 
   return (
     <a
@@ -158,3 +158,31 @@ type TParagraphProps = {
 export const p: React.ElementType = memo(({ children }: TParagraphProps) => {
   return <p className="mb-2 whitespace-pre-wrap">{children}</p>;
 });
+
+type TImageProps = {
+  src?: string;
+  alt?: string;
+  title?: string;
+  className?: string;
+  style?: React.CSSProperties;
+};
+
+export const img: React.ElementType = memo(({ src, alt, title, className, style }: TImageProps) => {
+  // Get the base URL from the API endpoints
+  const baseURL = apiBaseUrl();
+
+  // If src starts with /images/, prepend the base URL
+  const fixedSrc = useMemo(() => {
+    if (!src) return src;
+
+    // If it's already an absolute URL or doesn't start with /images/, return as is
+    if (src.startsWith('http') || src.startsWith('data:') || !src.startsWith('/images/')) {
+      return src;
+    }
+
+    // Prepend base URL to the image path
+    return `${baseURL}${src}`;
+  }, [src, baseURL]);
+
+  return <img src={fixedSrc} alt={alt} title={title} className={className} style={style} />;
+});