move components to root, remove analytics and speed insights, cleanup on manifesto, update music link text and tilde icon on header, minor home page improvements/tweaks

components/objects/BackButton.tsx

@@ -0,0 +1,24 @@
+import React from 'react';
+import Link from 'next/link';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { faArrowLeft } from '@fortawesome/free-solid-svg-icons';
+
+interface BackButtonProps {
+  href: string;
+  label?: string;
+}
+
+const BackButton: React.FC<BackButtonProps> = ({ href, label = 'Back' }) => {
+  return (
+    <Link 
+      href={href}
+      className="inline-flex items-center px-4 py-2 mt-4 text-white bg-gray-800 rounded shadow-md transition-all duration-300 ease-in-out hover:bg-gray-700 hover:shadow-lg hover:-translate-y-0.5 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500"
+      aria-label={`Go back to ${label}`}
+    >
+      <FontAwesomeIcon icon={faArrowLeft} className="mr-2" />
+      {label}
+    </Link>
+  );
+};
+
+export default BackButton;

components/objects/Button.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+import Link from 'next/link';
+
+interface MusicInfoButtonProps {
+  href: string;
+  label: string;
+}
+
+const MusicInfoButton: React.FC<MusicInfoButtonProps> = ({ href, label }) => {
+  return (
+    <Link 
+      href={href}
+      className="inline-block bg-gray-800 text-white font-bold py-2 px-4 rounded shadow-md transition-all duration-300 ease-in-out hover:bg-gray-700 hover:shadow-lg hover:-translate-y-0.5 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500"
+    >
+      {label}
+    </Link>
+  );
+};
+
+export default MusicInfoButton;

components/objects/ContactButton.tsx

@@ -0,0 +1,26 @@
+import { IconDefinition } from '@fortawesome/fontawesome-svg-core'
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+import Link from 'next/link';
+
+interface ContactButtonProps {
+  href: string;
+  icon: IconDefinition;
+  label: string;
+  className?: string;
+}
+  
+function ContactButton({ href, icon, label, className }: ContactButtonProps) {
+  return (
+    <Link
+      href={href}
+      target="_blank"
+      rel="noopener noreferrer"
+      className={`bg-gray-700 text-white px-4 py-2 rounded-full hover:bg-gray-600 transition-colors inline-flex items-center ${className}`}
+    >
+      <FontAwesomeIcon icon={icon} className="text-xl mr-2" />
+      {label}
+    </Link>
+  )
+}
+
+export default ContactButton;

components/objects/LoadingSpinner.tsx

@@ -0,0 +1,12 @@
+import { Loader2 } from 'lucide-react';
+
+const LoadingSpinner: React.FC = () => {
+  return (
+    <div className="fixed inset-0 flex items-center justify-center bg-black bg-opacity-50 z-50">
+      <Loader2 className="w-12 h-12 text-white animate-spin" />
+    </div>
+  );
+};
+
+export default LoadingSpinner;
+

components/objects/MusicInfo.tsx

@@ -0,0 +1,33 @@
+import React from 'react';
+import Button from './Button';
+
+interface TimePeriod {
+  title: string;
+  slug: string;
+}
+
+const timePeriods: TimePeriod[] = [
+  { title: 'Late Summer 2024', slug: 'late-summer-2024' },
+  { title: 'Early Summer 2024', slug: 'early-summer-2024' },
+];
+
+const MusicInfo: React.FC = () => {
+  return (
+    <div className="max-w-2xl mx-auto text-center text-gray-200">
+      {timePeriods.map((period) => (
+        <section key={period.slug} className="mb-12">
+          <h2 className="text-2xl font-semibold mb-4">{period.title}</h2>
+          <div className="flex justify-center">
+            <Button 
+              href={`/time-periods/${period.slug}/what-was-going-on`}
+              label="WHAT WAS GOING ON"
+            />
+          </div>
+        </section>
+      ))}
+    </div>
+  );
+};
+
+export default MusicInfo;
+