From a16d66b9e4e109e937ca81f711b059704529c8db Mon Sep 17 00:00:00 2001
From: Grady Ward <grady.b.ward@gmail.com>
Date: Wed, 24 Jan 2024 12:10:07 -0700
Subject: [PATCH] Removes User Profile Landing

---
 frontend/components/user/Toolbar.vue | 44 --------------
 frontend/pages/admin/merge.vue       |  4 +-
 frontend/pages/admin/users.vue       |  2 +-
 frontend/pages/user/[id].vue         |  1 -
 frontend/pages/user/[id]/edit.vue    | 76 ------------------------
 frontend/pages/user/[id]/index.vue   | 86 ++++++++++++++++++++++++++--
 6 files changed, 83 insertions(+), 130 deletions(-)
 delete mode 100644 frontend/components/user/Toolbar.vue
 delete mode 100644 frontend/pages/user/[id]/edit.vue

diff --git a/frontend/components/user/Toolbar.vue b/frontend/components/user/Toolbar.vue
deleted file mode 100644
index 6743117..0000000
--- a/frontend/components/user/Toolbar.vue
+++ /dev/null
@@ -1,44 +0,0 @@
-<script setup lang="ts">
-const { t } = useI18n()
-const localePath = useLocalePath()
-const { getMaybeMe } = useSession()
-const { isAdmin, maybeMe } = await getMaybeMe()
-
-interface Props {
-  userId: string
-}
-const props = defineProps<Props>()
-
-const prefix = 'components/user/Toolbar'
-const tt = (key: string) => t(`${prefix}.${key}`)
-
-const isMe = computed<boolean>(() => {
-  const mm = maybeMe.value
-  return !!mm && props.userId === mm.id
-})
-const canEdit = computed<boolean>(() => isMe.value || isAdmin.value)
-const showToolbar = computed<boolean>(() => canEdit.value)
-</script>
-
-<template>
-  <div
-    v-show="showToolbar"
-    class="p-buttonset"
-  >
-    <LinkButton
-      :to="localePath(`/user/${props.userId}`)"
-      :label="tt('Profile')"
-      icon="pi pi-home"
-      active-class="border-2"
-      inactive-class="p-button-outlined"
-    />
-    <LinkButton
-      v-if="canEdit"
-      :to="localePath(`/user/${props.userId}/edit`)"
-      :label="tt('Edit')"
-      icon="pi pi-pencil"
-      active-class="border-2"
-      inactive-class="p-button-outlined"
-    />
-  </div>
-</template>
diff --git a/frontend/pages/admin/merge.vue b/frontend/pages/admin/merge.vue
index 8a21107..1e8fe84 100644
--- a/frontend/pages/admin/merge.vue
+++ b/frontend/pages/admin/merge.vue
@@ -64,7 +64,7 @@ const reset = () => {
         <LinkButton
           class="p-button-secondary p-button-text"
           icon="pi pi-external-link"
-          :to="fromUserId ? localePath(`/user/${fromUserId}/edit`) : undefined"
+          :to="fromUserId ? localePath(`/user/${fromUserId}`) : undefined"
           new-tab
         />
       </div>
@@ -82,7 +82,7 @@ const reset = () => {
         <LinkButton
           class="p-button-secondary p-button-text"
           icon="pi pi-external-link"
-          :to="toUserId ? localePath(`/user/${toUserId}/edit`) : undefined"
+          :to="toUserId ? localePath(`/user/${toUserId}`) : undefined"
           new-tab
         />
       </div>
diff --git a/frontend/pages/admin/users.vue b/frontend/pages/admin/users.vue
index 16140e3..a7a3f0d 100644
--- a/frontend/pages/admin/users.vue
+++ b/frontend/pages/admin/users.vue
@@ -125,7 +125,7 @@ const reset = () => {
               always
             />
             <LinkButton
-              :to="localePath(`/user/${slotProps.data.id}/edit`)"
+              :to="localePath(`/user/${slotProps.data.id}`)"
               icon="pi pi-arrow-right"
               icon-pos="right"
               class="p-button-xs p-button-outlined"
diff --git a/frontend/pages/user/[id].vue b/frontend/pages/user/[id].vue
index 6a3e3ea..c02d160 100644
--- a/frontend/pages/user/[id].vue
+++ b/frontend/pages/user/[id].vue
@@ -14,7 +14,6 @@ const [
 <template>
   <StandardContent v-if="user">
     <TitleBar :title="`User: ${user.name || user.id}`" />
-    <UserToolbar :user-id="id" />
     <NuxtPage />
     <StandardDebug
       :value="user"
diff --git a/frontend/pages/user/[id]/edit.vue b/frontend/pages/user/[id]/edit.vue
deleted file mode 100644
index fdb87b3..0000000
--- a/frontend/pages/user/[id]/edit.vue
+++ /dev/null
@@ -1,76 +0,0 @@
-<script setup lang="ts">
-import { userEditor } from '@/lib/editor'
-
-const pactaClient = usePACTA()
-const { fromParams } = useURLParams()
-const { loading: { withLoading } } = useModal()
-const router = useRouter()
-const localePath = useLocalePath()
-const i18n = useI18n()
-
-const id = presentOrCheckURL(fromParams('id'))
-const prefix = `user/[${id}]`
-
-const { data } = await useSimpleAsyncData(`${prefix}.getUser`, () => pactaClient.findUserById(id))
-const {
-  editorValues,
-  editorFields,
-  changes,
-  saveTooltip,
-  canSave,
-} = userEditor(presentOrCheckURL(data.value, 'no user in response'), i18n)
-
-const deleteUser = () => withLoading(
-  () => pactaClient.deleteUser(id).then(() => router.push(localePath('/'))),
-  `${prefix}.deleteUser`,
-)
-const saveChanges = () => withLoading(
-  () => pactaClient.updateUser(id, changes.value)
-    .then(() => router.push(localePath(`/user/${id}`))),
-  `${prefix}.saveChanges`,
-)
-</script>
-
-<template>
-  <div class="flex flex-column gap-3">
-    <UserEditor
-      v-model:editorValues="editorValues"
-      :editor-fields="editorFields"
-    />
-    <div class="flex gap-3">
-      <PVButton
-        icon="pi pi-trash"
-        class="p-button-danger"
-        label="Delete"
-        @click="deleteUser"
-      />
-      <LinkButton
-        label="Discard Changes"
-        icon="pi pi-arrow-left"
-        class="p-button-secondary p-button-outlined"
-        :to="localePath(`/user/${id}`)"
-      />
-      <div v-tooltip.bottom="saveTooltip">
-        <PVButton
-          :disabled="!canSave"
-          label="Save Changes"
-          icon="pi pi-arrow-right"
-          icon-pos="right"
-          @click="saveChanges"
-        />
-      </div>
-    </div>
-    <StandardDebug
-      :value="editorFields"
-      label="Editor Fields"
-    />
-    <StandardDebug
-      :value="editorValues"
-      label="Editor Values"
-    />
-    <StandardDebug
-      :value="changes"
-      label="Changes"
-    />
-  </div>
-</template>
diff --git a/frontend/pages/user/[id]/index.vue b/frontend/pages/user/[id]/index.vue
index 5f11d1b..eda9159 100644
--- a/frontend/pages/user/[id]/index.vue
+++ b/frontend/pages/user/[id]/index.vue
@@ -1,12 +1,86 @@
 <script setup lang="ts">
-</script>
+import { userEditor } from '@/lib/editor'
 
-<template>
-  <div>
-    TODO(#58) implement some kind of user landing page.
+const pactaClient = usePACTA()
+const { fromParams } = useURLParams()
+const { loading: { withLoading }, permissionDenied: { setPermissionDenied } } = useModal()
+const router = useRouter()
+const localePath = useLocalePath()
+const i18n = useI18n()
+const { getMaybeMe } = useSession()
+
+const id = presentOrCheckURL(fromParams('id'))
+const prefix = `user/[${id}]`
 
-    For admins/the user themselves, this is where their portfolio library would go.
+const { isAdmin, maybeMe } = await getMaybeMe()
+const { data } = await useSimpleAsyncData(`${prefix}.getUser`, () => pactaClient.findUserById(id))
+const {
+  editorValues,
+  editorFields,
+  changes,
+  saveTooltip,
+  canSave,
+} = userEditor(presentOrCheckURL(data.value, 'no user in response'), i18n)
 
-    For other users looking at this it's probably a 404, or just very rudimentary data about a user
+const deleteUser = () => withLoading(
+  () => pactaClient.deleteUser(id).then(() => router.push(localePath('/'))),
+  `${prefix}.deleteUser`,
+)
+const saveChanges = () => withLoading(
+  () => pactaClient.updateUser(id, changes.value)
+    .then(() => router.push(localePath(`/user/${id}`))),
+  `${prefix}.saveChanges`,
+)
+const isMe = computed<boolean>(() => {
+  const mm = maybeMe.value
+  return !!mm && id === mm.id
+})
+if (!isMe.value && !isAdmin.value) {
+  setPermissionDenied(new Error(`permission denied for user ${id}`))
+}
+</script>
+
+<template>
+  <div class="flex flex-column gap-3">
+    <UserEditor
+      v-if="editorValues"
+      v-model:editorValues="editorValues"
+      :editor-fields="editorFields"
+    />
+    <div class="flex gap-3">
+      <PVButton
+        icon="pi pi-trash"
+        class="p-button-danger"
+        label="Delete"
+        @click="deleteUser"
+      />
+      <LinkButton
+        label="Discard Changes"
+        icon="pi pi-arrow-left"
+        class="p-button-secondary p-button-outlined"
+        :to="localePath(`/user/${id}`)"
+      />
+      <div v-tooltip.bottom="saveTooltip">
+        <PVButton
+          :disabled="!canSave"
+          label="Save Changes"
+          icon="pi pi-arrow-right"
+          icon-pos="right"
+          @click="saveChanges"
+        />
+      </div>
+    </div>
+    <StandardDebug
+      :value="editorFields"
+      label="Editor Fields"
+    />
+    <StandardDebug
+      :value="editorValues"
+      label="Editor Values"
+    />
+    <StandardDebug
+      :value="changes"
+      label="Changes"
+    />
   </div>
 </template>