TheCloud/PronounsPage
1
0
Fork 0
mirror of https://gitlab.com/PronounsPage/PronounsPage.git synced 2025-09-08 06:51:43 -04:00
Code Issues Packages Projects Releases Wiki Activity

(refactor) accept pronoun usages by string in <PronounGroup>

Browse Source
This commit is contained in:
Valentyne Stigloher 2024-10-16 11:06:46 +02:00
parent 517f01c22e
commit 75b18759d6
5 changed files with 38 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
components/PronounGroup.vue
View File

@ -1,32 +1,24 @@
<script setup lang="ts">
import type { PronounGroup, Pronoun } from '~/src/classes.ts';
const props = defineProps<{
pronounGroup: { group: PronounGroup, groupPronouns: Record<string, Pronoun> | Pronoun[] };
defineProps<{
pronounGroup?: PronounGroup;
pronouns: Record<string, Pronoun> | Pronoun[] | string[];
}>();
const pronouns = computed(() => {
if (Array.isArray(props.pronounGroup.groupPronouns)) {
return props.pronounGroup.groupPronouns;
}
return Object.values(props.pronounGroup.groupPronouns);
});
</script>
<template>
<section v-if="pronounGroup && pronounGroup.group.name">
<section>
<ul class="list-group mt-4">
<li class="list-group-item">
<p class="h5">
<Spelling :text="pronounGroup.group.name" />
<p v-if="pronounGroup?.name" class="h5">
<Spelling :text="pronounGroup.name" />
</p>
<p v-if="pronounGroup.group.description" class="small my-1">
<p v-if="pronounGroup?.description" class="small my-1">
<Icon v="info-circle" />
<LinkedText :text="pronounGroup.group.description" />
<LinkedText :text="pronounGroup.description" />
</p>
<ul class="list-unstyled">
<SimplePronounList :pronouns="pronouns" />
</ul>
<SimplePronounList :pronouns="Array.isArray(pronouns) ? pronouns : Object.values(pronouns)" />
</li>
<nuxt-link :to="{ name: 'pronouns' }" class="list-group-item list-group-item-action text-center">
<Icon v="ellipsis-h-alt" />

35
components/SimplePronounList.vue
View File

@ -1,7 +1,7 @@
<script setup lang="ts">
import { buildPronoun } from '~/src/buildPronoun.ts';
import { buildPronounUsage } from '~/src/buildPronoun.ts';
import type { Pronoun } from '~/src/classes.ts';
import { pronouns as pronounsData } from '~/src/data.ts';
import { pronounLibrary } from '~/src/data.ts';
const props = defineProps<{
pronouns: Pronoun[] | string[];
@ -10,25 +10,32 @@ const props = defineProps<{
const { $translator: translator } = useNuxtApp();
const config = useConfig();
const glue = ` ${translator.translate('pronouns.or')} `;
const visiblePronouns = computed(() => {
return props.pronouns
.map((pronoun): Pronoun | undefined => {
.map((pronoun) => {
if (typeof pronoun === 'string') {
const parsed = buildPronoun(pronounsData, pronoun, config, translator);
if (parsed) {
parsed.canonicalName = pronoun;
parsed.description = '';
return parsed;
const usage = buildPronounUsage(pronounLibrary, pronoun, config, translator);
if (usage) {
return {
path: pronoun,
short: usage.short.options.join(usage.short.glue),
};
}
} else if (!pronoun.hidden) {
return pronoun;
return {
path: pronoun.canonicalName,
short: pronoun.name(glue),
description: pronoun.description,
normative: pronoun.normative,
smallForm: pronoun.smallForm ? pronoun.morphemes[pronoun.smallForm] : undefined,
};
}
})
.filter((entry) => entry !== undefined);
});
const glue = ` ${translator.translate('pronouns.or')} `;
const addSlash = (link: string): string => {
return link + (['*', '\''].includes(link.substring(link.length - 1)) ? '/' : '');
};
@ -36,9 +43,9 @@ const addSlash = (link: string): string => {
<template>
<ul>
<li v-for="pronoun in visiblePronouns" :key="pronoun.canonicalName">
<nuxt-link :to="addSlash(`${config.pronouns.prefix || ''}/${pronoun.canonicalName}`)">
<strong><Spelling :text="pronoun.name(glue)" /></strong><small v-if="pronoun.smallForm">/<Spelling :text="pronoun.morphemes[pronoun.smallForm] ?? undefined" /></small>
<li v-for="pronoun in visiblePronouns" :key="pronoun.path">
<nuxt-link :to="addSlash(`${config.pronouns.prefix || ''}/${pronoun.path}`)">
<strong><Spelling :text="pronoun.short" /></strong><small v-if="pronoun.smallForm">/<Spelling :text="pronoun.smallForm" /></small>
<template v-if="pronoun.description">
–
<small><Spelling :text="pronoun.description as string" /></small>

3
pages/pronouns/any.vue
View File

@ -127,7 +127,8 @@ const pronounsChoice = computed(() => {
<PronounGroup
v-for="pronounGroup in pronounGroups"
:key="pronounGroup.group.name"
:pronoun-group="pronounGroup"
:pronoun-group="pronounGroup.group"
:pronouns="pronounGroup.groupPronouns"
/>
<AdPlaceholder :phkey="['content-0', 'content-mobile-0']" />

17
pages/pronouns/ask.vue
View File

@ -57,22 +57,7 @@ useSimpleHead({
<AdPlaceholder :phkey="['content-0', 'content-mobile-0']" />
<section>
<ul class="list-group mt-4">
<li class="list-group-item">
<ul>
<li v-for="otherVariant in config.pronouns.ask.routes" :key="otherVariant">
<nuxt-link :to="{ name: `pronouns-${otherVariant}` }">
<strong><T>pronouns.ask.short.{{ otherVariant }}</T></strong>
</nuxt-link>
</li>
</ul>
</li>
<nuxt-link :to="{ name: 'pronouns' }" class="list-group-item list-group-item-action text-center">
<Icon v="ellipsis-h-alt" />
</nuxt-link>
</ul>
</section>
<PronounGroup :pronouns="config.pronouns.ask.routes" />
<section>
<Share :title="`${$t('pronouns.intro')}: ${$t('pronouns.ask.description')}`" />

6
pages/pronouns/pronoun.vue
View File

@ -97,7 +97,11 @@
<AdPlaceholder :phkey="['content-1', 'content-mobile-1']" />
<PronounGroup :pronoun-group="pronounGroup" />
<PronounGroup
v-if="pronounGroup"
:pronoun-group="pronounGroup.group"
:pronouns="pronounGroup.groupPronouns"
/>
<Avoiding v-if="isNull" />