Added loading animation to dashboard

app/dashboard/loading.tsx

@@ -1,12 +1,13 @@
 import {metadata} from './page'
 import {SimpleLayout} from '@/components/layouts/SimpleLayout'
+import {SpinnerIcon} from '@/components/icons/SpinnerIcon'
 
 export default function LoadingSkeleton() {
     return (
         <SimpleLayout heading="Dashboard."
                       description={metadata.description}
                       gradient="bg-gradient-to-r from-orange-300 to-rose-300">
-
+            <SpinnerIcon className="animate-spin w-8 h-8 text-indigo-400"/>
         </SimpleLayout>
     )
 }

components/icons/SpinnerIcon.tsx

@@ -0,0 +1,12 @@
+import {Props} from '@/types'
+
+export function SpinnerIcon(props: Props) {
+    return (
+        <svg xmlns="http://www.w3.org/2000/svg" fill="none"
+             viewBox="0 0 24 24" {...props}>
+            <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4"></circle>
+            <path className="opacity-75" fill="currentColor"
+                  d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
+        </svg>
+    )
+}