Merge pull request #70 from AndyOooh/ED1-56-crate-error-pages

Ed1 56 crate error pages

apps/app/src/app/(combo)/(legal)/privacy-policy/page.tsx

@@ -1,9 +1,9 @@
 import React from 'react';
 import { privacyPolicy } from './privacyPolicy';
-import { Metadata } from 'next';
+import type { Metadata } from 'next';
 
 export const metadata: Metadata = {
-  title: 'Event Dee - Privacy Policy',
+  title: 'Privacy Policy',
 };
 
 export default function PrivacyPolicy() {

apps/app/src/app/(combo)/(legal)/terms-and-conditions/page.tsx

@@ -1,9 +1,9 @@
 import React from 'react';
 import { termsAndConditions } from './termsAndConditions';
-import { Metadata } from 'next';
+import type { Metadata } from 'next';
 
 export const metadata: Metadata = {
-  title: 'Event Dee - terms and conditions',
+  title: 'Terms & Conditions',
 };
 
 export default function TermsAndCoonditions() {

apps/app/src/app/(protected)/events/create/page.tsx

@@ -1,8 +1,8 @@
-import { Metadata } from 'next';
+import type { Metadata } from 'next';
 import { CreateEventForm } from './form';
 
 export const metadata: Metadata = {
-  title: 'Event Dee - Create Event',
+  title: 'Create Event',
 };
 
 export default function CreateEvent() {

apps/app/src/app/(protected)/events/layout.tsx

@@ -1,7 +1,7 @@
-import { Metadata } from 'next';
+import type { Metadata } from 'next';
 
 export const metadata: Metadata = {
-  title: 'Event Dee - Events',
+  title: 'Events',
 };
 
 export default function EventsLayout({ children }: { children: React.ReactNode }) {

apps/app/src/app/(protected)/profile/page.tsx

@@ -1,9 +1,9 @@
 import { PhotoForm } from './components/photo-form';
 import { EditProfileForm } from './components/form';
-import { Metadata } from 'next';
+import type { Metadata } from 'next';
 
 export const metadata: Metadata = {
-  title: 'Event Dee - Profile',
+  title: 'Profile',
 };
 
 /*

apps/app/src/app/(protected)/search/page.tsx

@@ -1,8 +1,8 @@
-import { Metadata } from 'next';
+import type { Metadata } from 'next';
 import React from 'react';
 
 export const metadata: Metadata = {
-  title: 'Event Dee - Search',
+  title: 'Search',
 };
 
 export default function SearchPage() {

apps/app/src/app/(protected)/settings/page.tsx

@@ -1,10 +1,10 @@
 import React from 'react';
 import { ChangePasswordForm } from './components/change-pw-form';
 import { DeleteAccountForm } from './components/delete-acc-form';
-import { Metadata } from 'next';
+import type { Metadata } from 'next';
 
 export const metadata: Metadata = {
-  title: 'Event Dee - Settings',
+  title: 'Settings',
 };
 
 export default function SettingsPage() {

apps/app/src/app/(protected)/test-emulator/page.tsx

@@ -1,3 +1,4 @@
+/* Might have to make this a client comp */
 import { createDocument } from '__firebase/utilities';
 
 export default function TestEmulatorPage() {
@@ -11,11 +12,12 @@ export default function TestEmulatorPage() {
   return (
     <div className='flex flex-col gap-4 w-full'>
       <h1 className='text-3xl'>Test Emulator Page</h1>
-      {process.env.NEXT_PUBLIC_EMULATORS_ON === 'true' && (
-        <button className='btn' onClick={submitHandler}>
-          Test Emulator
-        </button>
-      )}
+      {process.env.NEXT_PUBLIC_EMULATORS_ON === 'true' &&
+        process.env.NODE_ENV === 'development' && (
+          <button className='btn' onClick={submitHandler}>
+            Test Emulator
+          </button>
+        )}
     </div>
   );
 }

apps/app/src/app/(public)/(auth)/login/page.tsx

@@ -1,10 +1,10 @@
 import LoginLeft from './left/LoginLeft';
 import LoginRight from './LoginRight';
 import { DividedPage } from '../components/DividedPage';
-import { Metadata } from 'next';
+import type { Metadata } from 'next';
 
 export const metadata: Metadata = {
-  title: 'Event Dee - Login',
+  title: 'Login',
 };
 
 function Login() {

apps/app/src/app/(public)/(auth)/signup/business/page.tsx

@@ -1,7 +1,11 @@
-import { Metadata } from 'next';
+import type { Metadata } from 'next';
 import { SignupBusinessLeft } from './SignupBusinessLeft/SignupBusinessLeft';
 import { SignupBusinessRight } from './SignupBusinessRight/SignupBusinessRight';
 
+export const metadata: Metadata = {
+  title: 'Sign-up - Business',
+};
+
 function SignupBusiness() {
   return (
     // <DividedPage left={<SignupMemberLeft />} right={<SignupMemberRight />} leftColor='secondary' />

apps/app/src/app/(public)/(auth)/signup/freelancer/page.tsx

@@ -1,6 +1,11 @@
 import { SignupMemberLeft } from './signup-member-left/SignupMemberLeft';
 import { SignupMemberRight } from './signup-member-right/SignupMemberRight';
 import { DividedPage } from '../../components/DividedPage';
+import type { Metadata } from 'next';
+
+export const metadata: Metadata = {
+  title: 'Sign-up - Freelancer',
+};
 
 function SignupFreelancer() {
   return (

apps/app/src/app/(public)/(auth)/signup/layout.tsx

@@ -0,0 +1,9 @@
+import type { Metadata } from 'next';
+
+export const metadata: Metadata = {
+  title: 'Sign-up',
+};
+
+export default function SignupLayout({ children }: { children: React.ReactNode }) {
+  return <>{children}</>;
+}

apps/app/src/app/(public)/(auth)/signup/page.tsx

@@ -1,11 +1,6 @@
-import { Metadata } from 'next';
 import Link from 'next/link';
 import React from 'react';
 
-export const metadata: Metadata = {
-  title: 'Event Dee - Signup',
-};
-
 // Th9is page could ask if user wants to signuo as freelancer or company and procide links. Or it ciuld be deleted.
 
 function Signup() {

apps/app/src/app/error.tsx

@@ -0,0 +1,29 @@
+'use client'; // Error components must be Client Components
+
+import { useEffect } from 'react';
+
+export default function Error({
+  error,
+  reset,
+}: {
+  error: Error & { digest?: string };
+  reset: () => void;
+}) {
+  useEffect(() => {
+    // Log the error to an error reporting service
+    console.error(error);
+  }, [error]);
+
+  return (
+    <div>
+      <h2>Something went wrong - Andy - check error.tsx file!</h2>
+      <button
+        onClick={
+          // Attempt to recover by trying to re-render the segment
+          () => reset()
+        }>
+        Try again
+      </button>
+    </div>
+  );
+}

apps/app/src/app/layout.tsx

@@ -2,7 +2,7 @@ import { Varela } from 'next/font/google';
 
 import { RecoilProvider } from '../components/RecoilProvider';
 import '../styles/globals.scss';
-import { Metadata } from 'next';
+import type { Metadata } from 'next';
 
 const varela = Varela({
   weight: ['400'],

apps/app/src/app/not-found.tsx

@@ -0,0 +1,51 @@
+import type { Metadata } from 'next';
+import Link from 'next/link';
+import { ColoredDiv } from 'ui';
+
+export const metadata: Metadata = {
+  title: '404 - Not Found',
+};
+
+export default function NotFound() {
+  return (
+    <div className='flex-center min-h-screen w-full bg-base-300 absolute z-10 top-0'>
+      <div className='flex flex-col gap-6 items-center justify-center'>
+        <h2 className='text-4xl'>404 Not Found</h2>
+        <p className='text-xl'>We are sorry but the requested page could not be found.</p>
+        <Link href='/' className='btn btn-neutral'>
+          Return Home
+        </Link>
+      </div>
+      <ColoredDiv
+        color='pink'
+        direction='top'
+        height={12}
+        width={28}
+        rotateZ={45}
+        className='absolute z-20 right-[5%] top-1/4'
+      />
+      <ColoredDiv
+        color='blue'
+        direction='bottom'
+        height={15}
+        width={15}
+        className='absolute z-20 left-12 top-[20%] rounded-full'
+      />
+      <ColoredDiv
+        color='purple'
+        direction='bottom'
+        height={10}
+        width={16}
+        className='absolute z-20 bottom-1/4 left-1/4'
+      />
+      <ColoredDiv
+        color='orange'
+        direction='top'
+        height={32}
+        width={10}
+        rotateZ={15}
+        className='absolute z-20 bottom-8 right-1/4'
+      />
+    </div>
+  );
+}

apps/app/src/components/Sidebar/Sidebar.tsx

@@ -24,17 +24,18 @@ export const Sidebar = () => {
               <span className='title'>{item.title}</span>
             </a>
           ))}
-          {process.env.NEXT_PUBLIC_EMULATORS_ON === 'true' && (
-            <a
-              key={'emulator-test'}
-              href={'/emulator-test'}
-              className='text-xs pl-2 mb-2 hover:scale-110 hover:font-semibold'>
-              <span className=''>
-                <BiTestTube size={iconSize} />
-              </span>
-              <span className='title'>Emulator Test</span>
-            </a>
-          )}
+          {process.env.NEXT_PUBLIC_EMULATORS_ON === 'true' &&
+            process.env.NODE_ENV === 'development' && (
+              <a
+                key={'emulator-test'}
+                href={'/emulator-test'}
+                className='text-xs pl-2 mb-2 hover:scale-110 hover:font-semibold'>
+                <span className=''>
+                  <BiTestTube size={iconSize} />
+                </span>
+                <span className='title'>Emulator Test</span>
+              </a>
+            )}
         </li>
       </ul>
     </aside>

apps/app/src/firebase/clientApp.ts

@@ -41,7 +41,7 @@ const getCloudFunction = (functionName: string) => {
   return returnedFunction;
 };
 
-if (process.env.NEXT_PUBLIC_EMULATORS_ON === 'true') {
+if (process.env.NEXT_PUBLIC_EMULATORS_ON === 'true' && process.env.NODE_ENV === 'development') {
   connectAuthEmulator(auth, 'http://localhost:9099');
   connectFirestoreEmulator(db, 'localhost', 8080);
   connectStorageEmulator(storage, 'localhost', 9199);