erudit 4.0.0-dev.5 → 4.0.1

package/app/components/aside/minor/content/ButtonPaneContributions.vue

@@ -1,101 +1,101 @@
-<script lang="ts" setup>
-import type { ContentContribution } from '@erudit-js/core/content/contributions';
-
-import Contribution from './Contribution.vue';
-
-const withBaseUrl = useBaseUrl();
-
-const { contributions } = defineProps<{
-  contributions?: ContentContribution[];
-}>();
-
-const buttonContributors = computed(() => {
-  if (!contributions) {
-    return [];
-  }
-
-  return [...contributions]
-    .sort(() => Math.random() - 0.5)
-    .slice(0, Math.min(4, contributions.length));
-});
-
-const moreContributionsNumber = computed(() => {
-  if (!contributions) {
-    return 0;
-  }
-
-  return contributions.length - buttonContributors.value.length;
-});
-
-const contributionsOpened = ref(false);
-const phrase = await usePhrases('contribution');
-</script>
-
-<template>
-  <template v-if="contributions">
-    <TransitionFade>
-      <div
-        v-if="contributionsOpened"
-        class="absolute top-0 left-0 z-10 h-full w-full"
-      >
-        <div class="bg-bg-aside flex h-full w-full flex-col justify-end">
-          <div class="nice-scrollbars *:border-border overflow-auto *:border-t">
-            <Contribution
-              v-for="contribution of contributions.sort((a, b) =>
-                a.contributorId.localeCompare(b.contributorId),
-              )"
-              :contribution
-            />
-          </div>
-          <div class="border-border flex items-center border-t py-1 pr-0">
-            <div
-              class="pl-normal gap-small flex flex-1 items-center text-sm
-                font-semibold"
-            >
-              <span>{{ formatText(phrase.contribution) }}</span>
-              <span
-                class="text-invert rounded-full bg-neutral-600 px-[8px]
-                  py-[2.5px] text-xs font-semibold dark:bg-neutral-300"
-                >{{ contributions.length }}</span
-              >
-            </div>
-            <button
-              @click="contributionsOpened = false"
-              class="text-text-muted hocus:text-text p-normal cursor-pointer
-                transition-[color]"
-            >
-              <MyIcon name="plus" class="rotate-45 text-[24px] leading-none" />
-            </button>
-          </div>
-        </div>
-      </div>
-    </TransitionFade>
-    <AsideListItem
-      @click="contributionsOpened = true"
-      class="group border-t border-b-0 py-1"
-    >
-      <template #main>
-        <SmartMedia
-          v-for="buttonContributor of buttonContributors"
-          :url="
-            buttonContributor.avatarUrl
-              ? withBaseUrl(buttonContributor.avatarUrl)
-              : 'user'
-          "
-          :style="{
-            '--mediaColor': stringColor(buttonContributor.contributorId),
-          }"
-          class="size-[38px] rounded-full"
-        />
-        <div
-          v-if="moreContributionsNumber"
-          class="border-border group-hocus:border-text-dimmed grid size-[38px]
-            place-items-center rounded-full border-3 border-dashed text-xs
-            font-semibold transition-[border,color]"
-        >
-          +{{ moreContributionsNumber }}
-        </div>
-      </template>
-    </AsideListItem>
-  </template>
-</template>
+<script lang="ts" setup>
+import type { ContentContribution } from '@erudit-js/core/content/contributions';
+
+import Contribution from './Contribution.vue';
+
+const withBaseUrl = useBaseUrl();
+
+const { contributions } = defineProps<{
+  contributions?: ContentContribution[];
+}>();
+
+const buttonContributors = computed(() => {
+  if (!contributions) {
+    return [];
+  }
+
+  return [...contributions]
+    .sort(() => Math.random() - 0.5)
+    .slice(0, Math.min(4, contributions.length));
+});
+
+const moreContributionsNumber = computed(() => {
+  if (!contributions) {
+    return 0;
+  }
+
+  return contributions.length - buttonContributors.value.length;
+});
+
+const contributionsOpened = ref(false);
+const phrase = await usePhrases('contribution');
+</script>
+
+<template>
+  <template v-if="contributions">
+    <TransitionFade>
+      <div
+        v-if="contributionsOpened"
+        class="absolute top-0 left-0 z-10 h-full w-full"
+      >
+        <div class="bg-bg-aside flex h-full w-full flex-col justify-end">
+          <div class="nice-scrollbars *:border-border overflow-auto *:border-t">
+            <Contribution
+              v-for="contribution of contributions.sort((a, b) =>
+                a.contributorId.localeCompare(b.contributorId),
+              )"
+              :contribution
+            />
+          </div>
+          <div class="border-border flex items-center border-t py-1 pr-0">
+            <div
+              class="pl-normal gap-small flex flex-1 items-center text-sm
+                font-semibold"
+            >
+              <span>{{ formatText(phrase.contribution) }}</span>
+              <span
+                class="text-invert rounded-full bg-neutral-600 px-[8px]
+                  py-[2.5px] text-xs font-semibold dark:bg-neutral-300"
+                >{{ contributions.length }}</span
+              >
+            </div>
+            <button
+              @click="contributionsOpened = false"
+              class="text-text-muted hocus:text-text p-normal cursor-pointer
+                transition-[color]"
+            >
+              <MyIcon name="plus" class="rotate-45 text-[24px] leading-none" />
+            </button>
+          </div>
+        </div>
+      </div>
+    </TransitionFade>
+    <AsideListItem
+      @click="contributionsOpened = true"
+      class="group border-t border-b-0 py-1"
+    >
+      <template #main>
+        <SmartMedia
+          v-for="buttonContributor of buttonContributors"
+          :url="
+            buttonContributor.avatarUrl
+              ? withBaseUrl(buttonContributor.avatarUrl)
+              : 'user'
+          "
+          :style="{
+            '--mediaColor': stringColor(buttonContributor.contributorId),
+          }"
+          class="size-[38px] rounded-full"
+        />
+        <div
+          v-if="moreContributionsNumber"
+          class="border-border group-hocus:border-text-dimmed grid size-[38px]
+            place-items-center rounded-full border-3 border-dashed text-xs
+            font-semibold transition-[border,color]"
+        >
+          +{{ moreContributionsNumber }}
+        </div>
+      </template>
+    </AsideListItem>
+  </template>
+</template>

package/app/components/aside/minor/content/ButtonPaneImprove.vue

@@ -1,112 +1,112 @@
-<script lang="ts" setup>
-import type { TopicPart } from '@erudit-js/core/content/topic';
-import type { ContentType } from '@erudit-js/core/content/type';
-
-const { contentType, contentRelativePath, topicPart } = defineProps<{
-  contentRelativePath: string;
-  contentType: ContentType;
-  topicPart?: TopicPart;
-}>();
-
-const optionsOpened = ref(false);
-
-const howToImproveLink = ERUDIT.config.contributors?.howToImproveLink;
-const reportIssueLink = ERUDIT.config.contributors?.reportIssueLink;
-
-const editLink = computed(() => {
-  const prefix = ERUDIT.config.contributors?.editLinkPrefix;
-
-  if (prefix) {
-    const postfix = (() => {
-      switch (contentType) {
-        case 'book':
-          return '/book.ts';
-        case 'page':
-          return '/page.tsx';
-        case 'group':
-          return '/group.ts';
-        case 'topic':
-          return `/${topicPart!}.tsx`;
-      }
-    })();
-
-    return `${prefix}${contentRelativePath}${postfix}`;
-  }
-});
-
-const contributorsEnabled = ERUDIT.config.contributors?.enabled;
-const canImprove =
-  contributorsEnabled && (howToImproveLink || reportIssueLink || editLink);
-
-const phrase = await usePhrases(
-  'make_contribution',
-  'improve_material',
-  'how_to_improve',
-  'report_issue',
-  'edit_page',
-);
-</script>
-
-<template>
-  <template v-if="canImprove">
-    <TransitionFade>
-      <div
-        v-if="optionsOpened"
-        class="absolute top-0 left-0 z-10 h-full w-full"
-      >
-        <div class="bg-bg-aside flex h-full w-full flex-col justify-end">
-          <div class="nice-scrollbars overflow-auto *:border-t *:border-b-0">
-            <AsideListItem
-              v-if="howToImproveLink"
-              icon="question-circle"
-              :main="phrase.how_to_improve"
-              :to="howToImproveLink"
-              target="_blank"
-            />
-            <AsideListItem
-              v-if="reportIssueLink"
-              icon="bug"
-              :main="phrase.report_issue"
-              :to="reportIssueLink"
-              target="_blank"
-            />
-            <AsideListItem
-              v-if="editLink"
-              icon="draw"
-              :main="phrase.edit_page"
-              :to="editLink"
-              target="_blank"
-            />
-          </div>
-          <div class="border-border flex items-center border-t py-1 pr-0">
-            <div class="pl-normal flex-1 text-sm font-semibold">
-              {{ formatText(phrase.improve_material) }}
-            </div>
-            <button
-              @click="optionsOpened = false"
-              class="text-text-muted hocus:text-text p-normal cursor-pointer
-                transition-[color]"
-            >
-              <MyIcon name="plus" class="rotate-45 text-[24px] leading-none" />
-            </button>
-          </div>
-        </div>
-      </div>
-    </TransitionFade>
-    <AsideListItem
-      :main="formatText(phrase.make_contribution)"
-      @click="optionsOpened = true"
-      class="group border-t border-b-0 py-1"
-    >
-      <template #icon>
-        <div
-          class="border-border group-hocus:border-text-dimmed grid size-[40px]
-            place-items-center rounded-full border-3 border-dashed
-            transition-[border]"
-        >
-          <MyIcon name="draw" class="text-text-muted size-[56%]" />
-        </div>
-      </template>
-    </AsideListItem>
-  </template>
-</template>
+<script lang="ts" setup>
+import type { TopicPart } from '@erudit-js/core/content/topic';
+import type { ContentType } from '@erudit-js/core/content/type';
+
+const { contentType, contentRelativePath, topicPart } = defineProps<{
+  contentRelativePath: string;
+  contentType: ContentType;
+  topicPart?: TopicPart;
+}>();
+
+const optionsOpened = ref(false);
+
+const howToImproveLink = ERUDIT.config.contributors?.howToImproveLink;
+const reportIssueLink = ERUDIT.config.contributors?.reportIssueLink;
+
+const editLink = computed(() => {
+  const prefix = ERUDIT.config.contributors?.editLinkPrefix;
+
+  if (prefix) {
+    const postfix = (() => {
+      switch (contentType) {
+        case 'book':
+          return '/book.ts';
+        case 'page':
+          return '/page.tsx';
+        case 'group':
+          return '/group.ts';
+        case 'topic':
+          return `/${topicPart!}.tsx`;
+      }
+    })();
+
+    return `${prefix}${contentRelativePath}${postfix}`;
+  }
+});
+
+const contributorsEnabled = ERUDIT.config.contributors?.enabled;
+const canImprove =
+  contributorsEnabled && (howToImproveLink || reportIssueLink || editLink);
+
+const phrase = await usePhrases(
+  'make_contribution',
+  'improve_material',
+  'how_to_improve',
+  'report_issue',
+  'edit_page',
+);
+</script>
+
+<template>
+  <template v-if="canImprove">
+    <TransitionFade>
+      <div
+        v-if="optionsOpened"
+        class="absolute top-0 left-0 z-10 h-full w-full"
+      >
+        <div class="bg-bg-aside flex h-full w-full flex-col justify-end">
+          <div class="nice-scrollbars overflow-auto *:border-t *:border-b-0">
+            <AsideListItem
+              v-if="howToImproveLink"
+              icon="question-circle"
+              :main="phrase.how_to_improve"
+              :to="howToImproveLink"
+              target="_blank"
+            />
+            <AsideListItem
+              v-if="reportIssueLink"
+              icon="bug"
+              :main="phrase.report_issue"
+              :to="reportIssueLink"
+              target="_blank"
+            />
+            <AsideListItem
+              v-if="editLink"
+              icon="draw"
+              :main="phrase.edit_page"
+              :to="editLink"
+              target="_blank"
+            />
+          </div>
+          <div class="border-border flex items-center border-t py-1 pr-0">
+            <div class="pl-normal flex-1 text-sm font-semibold">
+              {{ formatText(phrase.improve_material) }}
+            </div>
+            <button
+              @click="optionsOpened = false"
+              class="text-text-muted hocus:text-text p-normal cursor-pointer
+                transition-[color]"
+            >
+              <MyIcon name="plus" class="rotate-45 text-[24px] leading-none" />
+            </button>
+          </div>
+        </div>
+      </div>
+    </TransitionFade>
+    <AsideListItem
+      :main="formatText(phrase.make_contribution)"
+      @click="optionsOpened = true"
+      class="group border-t border-b-0 py-1"
+    >
+      <template #icon>
+        <div
+          class="border-border group-hocus:border-text-dimmed grid size-[40px]
+            place-items-center rounded-full border-3 border-dashed
+            transition-[border]"
+        >
+          <MyIcon name="draw" class="text-text-muted size-[56%]" />
+        </div>
+      </template>
+    </AsideListItem>
+  </template>
+</template>

package/app/components/aside/minor/content/Contribution.vue

@@ -1,36 +1,36 @@
-<script lang="ts" setup>
-import type { ContentContribution } from '@erudit-js/core/content/contributions';
-
-defineProps<{ contribution: ContentContribution }>();
-
-const withBaseUrl = useBaseUrl();
-</script>
-
-<template>
-  <EruditLink
-    :to="PAGES.contributor(contribution.contributorId)"
-    class="p-normal hocus:bg-bg-accent block bg-transparent
-      transition-[background]"
-  >
-    <div class="gap-normal flex items-center">
-      <SmartMedia
-        class="micro:size-[40px] size-[30px] shrink-0 rounded-full"
-        :style="{
-          '--mediaColor': stringColor(contribution.contributorId),
-        }"
-        :url="
-          contribution.avatarUrl ? withBaseUrl(contribution.avatarUrl) : 'user'
-        "
-      />
-      <span class="text-[0.9em]">{{
-        contribution.name || contribution.contributorId
-      }}</span>
-    </div>
-    <div
-      v-if="contribution.description"
-      class="pt-small text-text-muted text-sm"
-    >
-      {{ formatText(contribution.description) }}
-    </div>
-  </EruditLink>
-</template>
+<script lang="ts" setup>
+import type { ContentContribution } from '@erudit-js/core/content/contributions';
+
+defineProps<{ contribution: ContentContribution }>();
+
+const withBaseUrl = useBaseUrl();
+</script>
+
+<template>
+  <EruditLink
+    :to="PAGES.contributor(contribution.contributorId)"
+    class="p-normal hocus:bg-bg-accent block bg-transparent
+      transition-[background]"
+  >
+    <div class="gap-normal flex items-center">
+      <SmartMedia
+        class="micro:size-[40px] size-[30px] shrink-0 rounded-full"
+        :style="{
+          '--mediaColor': stringColor(contribution.contributorId),
+        }"
+        :url="
+          contribution.avatarUrl ? withBaseUrl(contribution.avatarUrl) : 'user'
+        "
+      />
+      <span class="text-[0.9em]">{{
+        contribution.name || contribution.contributorId
+      }}</span>
+    </div>
+    <div
+      v-if="contribution.description"
+      class="pt-small text-text-muted text-sm"
+    >
+      {{ formatText(contribution.description) }}
+    </div>
+  </EruditLink>
+</template>