diff --git a/src/app/editArea/[slug]/Skeleton.tsx b/src/app/editArea/[slug]/Skeleton.tsx
deleted file mode 100644
index dd981d87a..000000000
--- a/src/app/editArea/[slug]/Skeleton.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import { PageContainer } from './page'
-
-export default function Loading (): JSX.Element {
-  return (
-    <>
-      <div className='card card-compact card-bordered border-base-300  w-full h-56 bg-base-300' />
-      <div className='card card-compact card-bordered border-base-300  w-full h-56 bg-base-300' />
-    </>
-  )
-}
diff --git a/src/app/editArea/[slug]/attributes/page.tsx b/src/app/editArea/[slug]/attributes/page.tsx
index 40df21977..a62390686 100644
--- a/src/app/editArea/[slug]/attributes/page.tsx
+++ b/src/app/editArea/[slug]/attributes/page.tsx
@@ -1,6 +1,12 @@
-import { DashboardPageProps, getPageDataForEdit } from '../page'
+import { AreaLatLngForm } from '../general/AreaLatLngForm'
+import { DashboardPageProps, getPageDataForEdit, PageContainer } from '../page'
 
 export default async function AreaEditPage ({ params }: DashboardPageProps): Promise<any> {
-  const { area } = await getPageDataForEdit(params.slug)
-  return (<div>Attributes {JSON.stringify(area, null, 2)}</div>)
+  const { area: { uuid, metadata: { lat, lng } } } = await getPageDataForEdit(params.slug)
+
+  return (
+    <PageContainer>
+      <AreaLatLngForm initLat={lat} initLng={lng} uuid={uuid} />
+    </PageContainer>
+  )
 }
diff --git a/src/app/editArea/[slug]/loading.tsx b/src/app/editArea/[slug]/loading.tsx
new file mode 100644
index 000000000..1ffe0ce3d
--- /dev/null
+++ b/src/app/editArea/[slug]/loading.tsx
@@ -0,0 +1,11 @@
+import { PageContainer } from './page'
+
+export default function Loading (): JSX.Element {
+  return (
+    <PageContainer>
+      <div className='card card-compact card-bordered w-full h-56 bg-base-300/60' />
+      <div className='card card-compact card-bordered w-full h-56 bg-base-300/60' />
+      <div className='card card-compact card-bordered w-full h-56 bg-base-300/60' />
+    </PageContainer>
+  )
+}
diff --git a/src/app/editArea/[slug]/page.tsx b/src/app/editArea/[slug]/page.tsx
index 8ad707510..37a41be25 100644
--- a/src/app/editArea/[slug]/page.tsx
+++ b/src/app/editArea/[slug]/page.tsx
@@ -1,12 +1,10 @@
 import { notFound } from 'next/navigation'
 import { validate } from 'uuid'
-import { Suspense, ReactNode } from 'react'
+import { ReactNode } from 'react'
 
 import { AreaPageDataProps, getArea } from '@/js/graphql/getArea'
 import { AreaNameForm } from './general/AreaNameForm'
 import { AreaDescriptionForm } from './general/AreaDescriptionForm'
-import { AreaLatLngForm } from './general/AreaLatLngForm'
-import Loading from './Skeleton'
 
 // Opt out of caching for all data requests in the route segment
 export const dynamic = 'force-dynamic'
@@ -18,18 +16,11 @@ export interface DashboardPageProps {
 }
 
 export default async function AreaEditPage ({ params }: DashboardPageProps): Promise<any> {
-  const areaUuid = params.slug
-  if (!validate(areaUuid)) {
-    notFound()
-  }
-  const { area: { areaName, uuid, content: { description }, metadata: { lat, lng } } } = await getPageDataForEdit(areaUuid)
+  const { area: { areaName, uuid, content: { description }, metadata: { lat, lng } } } = await getPageDataForEdit(params.slug)
   return (
     <PageContainer>
-      <Suspense fallback={<Loading />}>
-        <AreaNameForm initialValue={areaName} uuid={uuid} />
-        <AreaLatLngForm initLat={lat} initLng={lng} uuid={uuid} />
-        <AreaDescriptionForm initialValue={description} uuid={uuid} />
-      </Suspense>
+      <AreaNameForm initialValue={areaName} uuid={uuid} />
+      <AreaDescriptionForm initialValue={description} uuid={uuid} />
     </PageContainer>
   )
 }
@@ -40,10 +31,14 @@ export const PageContainer: React.FC<{ children: ReactNode } > = ({ children })
   </section>
 )
 
-export const getPageDataForEdit = async (uuid: string): Promise<AreaPageDataProps> => {
-  if (uuid == null) notFound()
+export const getPageDataForEdit = async (pageSlug: string): Promise<AreaPageDataProps> => {
+  if (pageSlug == null) notFound()
+
+  if (!validate(pageSlug)) {
+    notFound()
+  }
 
-  const pageData = await getArea(uuid)
+  const pageData = await getArea(pageSlug)
   if (pageData == null) {
     notFound()
   }
diff --git a/src/components/editor/plugins/PlainTextResetPlugin.ts b/src/components/editor/plugins/PlainTextResetPlugin.ts
index b4e7db527..9aadb9f5e 100644
--- a/src/components/editor/plugins/PlainTextResetPlugin.ts
+++ b/src/components/editor/plugins/PlainTextResetPlugin.ts
@@ -33,6 +33,7 @@ export function PlainTextResetPlugin ({ initialValue, resetSignal, editable = fa
 
 export const $createInitialPlainTextState = (plainText: string): void => {
   const root = $getRoot()
+
   const paragraph = $createParagraphNode()
   paragraph.append(
     $createTextNode(plainText)
diff --git a/src/components/ui/form/MDTextArea.tsx b/src/components/ui/form/MDTextArea.tsx
index cf5b4e461..3d2b03f95 100644
--- a/src/components/ui/form/MDTextArea.tsx
+++ b/src/components/ui/form/MDTextArea.tsx
@@ -61,5 +61,7 @@ export const MDTextArea: React.FC<EditorProps> = ({ initialValue = '', name, pla
 }
 
 export const MarkdownEditor = dynamic<MarkdownEditorProps>(async () => await import('@/components/editor/MarkdownEditor').then(
-  module => module.MarkdownEditor), { ssr: true }
+  module => module.MarkdownEditor), {
+  ssr: true
+}
 )
diff --git a/src/js/graphql/getArea.ts b/src/js/graphql/getArea.ts
index 3c514f6d9..f864a094b 100644
--- a/src/js/graphql/getArea.ts
+++ b/src/js/graphql/getArea.ts
@@ -20,5 +20,8 @@ export const getArea = async (uuid: string): Promise<AreaPageDataProps> => {
     fetchPolicy: 'no-cache'
   })
 
+  // eslint-disable-next-line
+  new Promise(resolve => setTimeout(resolve, 5000))
+
   return rs.data
 }