refactor: eslint and prettier conflict will be resolved and formatted

components/error-boundary.tsx

@@ -1,8 +1,8 @@
-"use client";
+'use client';
 
-import React, { Component, ErrorInfo, ReactNode } from "react";
-import { Button } from "@/components/ui/button";
-import { AlertTriangle, Film } from "lucide-react";
+import React, { Component, ErrorInfo, ReactNode } from 'react';
+import { Button } from '@/components/ui/button';
+import { AlertTriangle, Film } from 'lucide-react';
 
 interface Props {
   children: ReactNode;
@@ -38,7 +38,11 @@ export class ErrorBoundary extends Component<Props, State> {
   }
 
   public componentDidCatch(error: Error, errorInfo: ErrorInfo) {
-    console.error(`ErrorBoundary${this.props.context ? ` [${this.props.context}]` : ""} caught an error:`, error, errorInfo);
+    console.error(
+      `ErrorBoundary${this.props.context ? ` [${this.props.context}]` : ''} caught an error:`,
+      error,
+      errorInfo
+    );
     this.props.onError?.(error, errorInfo);
   }
 
@@ -78,7 +82,7 @@ interface ErrorFallbackProps {
 }
 
 function ErrorFallback({ error, context, onReset, onReload }: ErrorFallbackProps) {
-  const isVideoContext = context?.toLowerCase().includes("video");
+  const isVideoContext = context?.toLowerCase().includes('video');
 
   return (
     <div className="flex min-h-[300px] flex-col items-center justify-center gap-4 rounded-lg border border-destructive/20 bg-destructive/5 p-6 text-center">
@@ -95,16 +99,16 @@ function ErrorFallback({ error, context, onReset, onReload }: ErrorFallbackProps
 
       <div className="space-y-1">
         <h3 className="text-lg font-semibold">
-          {context ? `${context} crashed` : "Something went wrong"}
+          {context ? `${context} crashed` : 'Something went wrong'}
         </h3>
         <p className="text-muted-foreground text-sm max-w-sm">
           {isVideoContext
-            ? "The video player encountered an error. Try reloading or go back to the project."
-            : "An unexpected error occurred. Try resetting the component or reload the page."}
+            ? 'The video player encountered an error. Try reloading or go back to the project.'
+            : 'An unexpected error occurred. Try resetting the component or reload the page.'}
         </p>
       </div>
 
-      {process.env.NODE_ENV === "development" && error?.message && (
+      {process.env.NODE_ENV === 'development' && error?.message && (
         <div className="rounded bg-destructive/10 px-3 py-2 text-xs text-destructive font-mono max-w-sm overflow-auto">
           {error.message}
         </div>
@@ -127,7 +131,7 @@ function ErrorFallback({ error, context, onReset, onReload }: ErrorFallbackProps
  */
 export function withErrorBoundary<P extends object>(
   Component: React.ComponentType<P>,
-  errorBoundaryProps?: Omit<Props, "children">
+  errorBoundaryProps?: Omit<Props, 'children'>
 ) {
   return function WithErrorBoundaryWrapper(props: P) {
     return (