App redesign (#2946)

* Start of app redesign * format * continue progress * Content page nearly done * Fix recursion issues with content page * Fix update all alignment * Discover page progress * Settings progress * Removed unlocked-size hack that breaks web * Revamp project page, refactor web project page to share code with app, fixed loading bar, misc UI/UX enhancements, update ko-fi logo, update arrow icons, fix web issues caused by floating-vue migration, fix tooltip issues, update web tooltips, clean up web hydration issues * Ads + run prettier * Begin auth refactor, move common messages to ui lib, add i18n extraction to all apps, begin Library refactor * fix ads not hiding when plus log in * rev lockfile changes/conflicts * Fix sign in page * Add generated * (mostly) Data driven search * Fix search mobile issue * profile fixes * Project versions page, fix typescript on UI lib and misc fixes * Remove unused gallery component * Fix linkfunction err * Search filter controls at top, localization for locked filters * Fix provided filter names * Fix navigating from instance browse to main browse * Friends frontend (#2995) * Friends system frontend * (almost) finish frontend * finish friends, fix lint * Fix lint --------- Signed-off-by: Geometrically <18202329+Geometrically@users.noreply.github.com> * Refresh macOS app icon * Update web search UI more * Fix link opens * Fix frontend build --------- Signed-off-by: Geometrically <18202329+Geometrically@users.noreply.github.com> Co-authored-by: Jai A <jaiagr+gpg@pm.me> Co-authored-by: Geometrically <18202329+Geometrically@users.noreply.github.com>
2024-12-11 19:54:18 -08:00
parent 6ec1dcf088
commit c39bb78e38
257 changed files with 15713 additions and 9475 deletions
--- a/packages/ui/src/components/project/ProjectStatusBadge.vue
+++ b/packages/ui/src/components/project/ProjectStatusBadge.vue
@@ -0,0 +1,105 @@
+<template>
+  <Badge :icon="metadata.icon" :formatted-name="metadata.formattedName" />
+</template>
+
+<script setup lang="ts">
+import {
+  FileTextIcon,
+  ArchiveIcon,
+  UpdatedIcon,
+  LockIcon,
+  CalendarIcon,
+  GlobeIcon,
+  LinkIcon,
+  UnknownIcon, XIcon
+} from '@modrinth/assets'
+import { useVIntl, defineMessage, type MessageDescriptor } from '@vintl/vintl'
+import type { Component } from 'vue'
+import { computed } from 'vue'
+import Badge from '../base/SimpleBadge.vue'
+import type { ProjectStatus } from '@modrinth/utils'
+
+const props = defineProps<{
+  status: ProjectStatus
+}>()
+
+const { formatMessage } = useVIntl()
+
+const metadata = computed(() => ({
+  icon: statusMetadata[props.status]?.icon ?? statusMetadata.unknown.icon,
+  formattedName: formatMessage(statusMetadata[props.status]?.message ?? props.status),
+}))
+
+const statusMetadata: Record<ProjectStatus, { icon?: Component, message: MessageDescriptor }> = {
+  approved: {
+    icon: GlobeIcon,
+    message: defineMessage({
+      id: 'project.visibility.public',
+      defaultMessage: 'Public',
+    }),
+  },
+  unlisted: {
+    icon: LinkIcon,
+    message: defineMessage({
+      id: 'project.visibility.unlisted',
+      defaultMessage: 'Unlisted',
+    }),
+  },
+  withheld: {
+    icon: LinkIcon,
+    message: defineMessage({
+      id: 'project.visibility.unlisted-by-staff',
+      defaultMessage: 'Unlisted by staff',
+    }),
+  },
+  private: {
+    icon: LockIcon,
+    message: defineMessage({
+      id: 'project.visibility.private',
+      defaultMessage: 'Private',
+    }),
+  },
+  scheduled: {
+    icon: CalendarIcon,
+    message: defineMessage({
+      id: 'project.visibility.scheduled',
+      defaultMessage: 'Scheduled',
+    }),
+  },
+  draft: {
+    icon: FileTextIcon,
+    message: defineMessage({
+      id: 'project.visibility.draft',
+      defaultMessage: 'Draft',
+    }),
+  },
+  archived: {
+    icon: ArchiveIcon,
+    message: defineMessage({
+      id: 'project.visibility.archived',
+      defaultMessage: 'Archived',
+    }),
+  },
+  rejected: {
+    icon: XIcon,
+    message: defineMessage({
+      id: 'project.visibility.rejected',
+      defaultMessage: 'Rejected',
+    }),
+  },
+  processing: {
+    icon: UpdatedIcon,
+    message: defineMessage({
+      id: 'project.visibility.under-review',
+      defaultMessage: 'Under review',
+    }),
+  },
+  unknown: {
+    icon: UnknownIcon,
+    message: defineMessage({
+      id: 'project.visibility.unknown',
+      defaultMessage: 'Unknown',
+    }),
+  },
+}
+</script>