sam/pronounscc
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

feat: show prompt to fill profile/members if profile/member list is empty

Browse source
This commit is contained in:
Sam 2023-03-27 00:44:55 +02:00
parent 256a14a922
commit 6532393578
Signed by: sam
GPG key ID: B4EF20DDE721CAA1
2 changed files with 52 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

41
frontend/src/routes/@[username]/+page.svelte
View file

@ -83,6 +83,13 @@
const favNames = data.names.filter((entry) => entry.status === WordStatus.Favourite);
const favPronouns = data.pronouns.filter((entry) => entry.status === WordStatus.Favourite);
let profileEmpty = false;
$: profileEmpty =
data.names.length === 0 &&
data.pronouns.length === 0 &&
data.fields.length === 0 &&
(!data.bio || data.bio.length === 0);
</script>
<div class="container">
@ -106,7 +113,16 @@
{:else}
<h2>@{data.name}</h2>
{/if}
{#if bio}
{#if profileEmpty && $userStore?.id === data.id}
<hr />
<p>
<em>
Your profile is empty! You can customize it by going to the <a href="/edit/profile"
>edit profile</a
> page.</em
> <span class="text-muted">(only you can see this)</span>
</p>
{:else if bio}
<hr />
<p>{@html bio}</p>
{/if}
@ -183,11 +199,24 @@
</h2>
</div>
</div>
<div class="row row-cols-1 row-cols-sm-2 row-cols-md-4 text-center">
{#each memberSlice as member}
<PartialMemberCard user={data} {member} />
{/each}
</div>
{#if data.members.length > 0}
<div class="row row-cols-1 row-cols-sm-2 row-cols-md-4 text-center">
{#each memberSlice as member}
<PartialMemberCard user={data} {member} />
{/each}
</div>
{:else}
<div>
<p>
You don't have any members yet.
<br />
Members are sub-profiles that can have their own avatar,
names, pronouns, and preferred terms. <span class="text-muted"
>(only you can see this)</span
>
</p>
</div>
{/if}
{/if}
<Modal header="Create member" isOpen={modalOpen} toggle={toggleModal}>
<ModalBody>

18
frontend/src/routes/@[username]/[memberName]/+page.svelte
View file

@ -20,6 +20,13 @@
const favNames = data.names.filter((entry) => entry.status === WordStatus.Favourite);
const favPronouns = data.pronouns.filter((entry) => entry.status === WordStatus.Favourite);
let profileEmpty = false;
$: profileEmpty =
data.names.length === 0 &&
data.pronouns.length === 0 &&
data.fields.length === 0 &&
(!data.bio || data.bio.length === 0);
</script>
<div class="container">
@ -43,7 +50,16 @@
<div class="col-md">
<h2>{data.display_name ?? data.name}</h2>
<h5 class="text-body-secondary">{data.name} (@{data.user.name})</h5>
{#if bio}
{#if profileEmpty && $userStore?.id === data.user.id}
<hr />
<p>
<em>
This member's profile is empty! You can customize it by going to the <a
href="/edit/member/{data.id}">edit member</a
> page.</em
> <span class="text-muted">(only you can see this)</span>
</p>
{:else if bio}
<hr />
<p>{@html bio}</p>
{/if}