FediMovies/fedimovies-web
1
1
Fork 0
Code Pull requests Activity

Don't display more than 10 metadata fields on profile page

Browse source
This commit is contained in:
silverpill 2022-12-14 16:51:08 +00:00
parent c51d453ea4
commit 0156213889
3 changed files with 13 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/api/users.ts
View file

@ -4,6 +4,8 @@ import { BACKEND_URL } from "@/constants"
import { createDidFromEthereumAddress } from "@/utils/did"
import { PAGE_SIZE, http } from "./common"
export const EXTRA_FIELD_COUNT_MAX = 10
export interface ProfileField {
name: string;
value: string;

11
src/views/Profile.vue
View file

@ -143,10 +143,10 @@
<div
v-for="field in fields"
class="field"
:class="{'verified': field.verified_at}"
:class="{ verified: field.verified_at }"
:key="field.name"
>
<div class="name">{{ field.name }}</div>
<div class="name" :title="field.name">{{ field.name }}</div>
<div class="value" v-html="field.value"></div>
<div class="verified-icon" v-if="field.verified_at">
<img
@ -259,6 +259,7 @@ import {
Profile,
ProfileField,
ProfileWrapper,
EXTRA_FIELD_COUNT_MAX,
} from "@/api/users"
import Avatar from "@/components/Avatar.vue"
import Loader from "@/components/Loader.vue"
@ -372,7 +373,9 @@ const fields = $computed<ProfileField[]>(() => {
if (!profile) {
return []
}
return profile.identity_proofs.concat(profile.fields)
return profile.identity_proofs
.concat(profile.fields)
.slice(0, EXTRA_FIELD_COUNT_MAX)
})
function isCurrentUser(): boolean {
@ -734,6 +737,8 @@ $avatar-size: 170px;
.name {
font-weight: bold;
min-width: 120px;
overflow-x: hidden;
text-overflow: ellipsis;
width: 120px;
}

6
src/views/ProfileForm.vue
View file

@ -42,7 +42,7 @@
<div class="extra-fields input-group">
<label>
Additional info
<div class="sub-label">You can have up to {{ extraFieldMaxCount }} items displayed as a table on your profile</div>
<div class="sub-label">You can have up to {{ EXTRA_FIELD_COUNT_MAX }} items displayed as a table on your profile</div>
</label>
<div
v-for="(field, index) in form.fields_attributes"
@ -96,6 +96,7 @@ import {
ProfileFieldAttrs,
ProfileUpdateData,
updateProfile,
EXTRA_FIELD_COUNT_MAX,
} from "@/api/users"
import ProfileCard from "@/components/ProfileCard.vue"
import SidebarLayout from "@/components/SidebarLayout.vue"
@ -107,7 +108,6 @@ import { fileToDataUrl, dataUrlToBase64 } from "@/utils/upload"
const router = useRouter()
const { ensureCurrentUser, setCurrentUser, ensureAuthToken } = $(useCurrentUser())
const extraFieldMaxCount = 10
const profile = ensureCurrentUser()
let isLoading = $ref(false)
@ -192,7 +192,7 @@ function removeExtraField(index: number) {
}
function canAddExtraField(): boolean {
return form.fields_attributes.length <= extraFieldMaxCount
return form.fields_attributes.length <= EXTRA_FIELD_COUNT_MAX
}
function addExtraField() {