Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 7 additions & 3 deletions apps/frontend/src/assets/styles/global.scss
Original file line number Diff line number Diff line change
Expand Up @@ -280,15 +280,19 @@ html {
}

.retro-mode {
--color-bg: #191917;
--color-raised-bg: #1d1e1b;
--surface-1: #191917;

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

retro in app 👀 ?

--surface-2: rgb(22, 22, 21);
--surface-3: #232421;
--surface-4: #3a3b38;
--surface-5: #5a5c58;
--color-button-bg: #3a3b38;
--color-base: #c3c4b3;
--color-secondary: #777a74;
--color-secondary: #9b9e98;
--color-contrast: #e6e2d1;

--color-brand: #4d9227;
--color-brand-highlight: #25421e;
--color-accent-contrast: #ffffff;
--color-ad: var(--color-brand-highlight);
--color-ad-raised: var(--color-brand);
--color-ad-contrast: black;
Expand Down
1 change: 1 addition & 0 deletions apps/frontend/src/components/ui/AdsConsentNotification.vue
Original file line number Diff line number Diff line change
Expand Up @@ -590,6 +590,7 @@ onBeforeUnmount(() => {
})
</script>

<template><div></div></template>
<style>
html.modrinth-cmp-summary-hidden .qc-cmp2-container,
html.modrinth-cmp-summary-hidden #qc-cmp2-container,
Expand Down
165 changes: 165 additions & 0 deletions apps/frontend/src/components/ui/AuthorizationCard.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,165 @@
<template>
<div class="rounded-2xl border border-solid border-surface-4 bg-surface-3">
<div class="flex flex-col gap-2 border-0 border-b border-solid border-surface-4 p-4">
<div class="flex flex-wrap justify-between gap-3">
<div class="flex items-center gap-3">
<Avatar :src="authorization.app.icon_url" size="48px" />
<div class="flex flex-col gap-0.5">
<h2 class="m-0 flex items-center gap-1 text-base font-semibold">
{{ authorization.app.name }}

<BadgeCheckIcon
v-if="isOfficial"
v-tooltip="formatMessage(messages.officialTooltip)"
class="size-5 text-green"
fill="currentColor"
fill-opacity="0.125"
/>
</h2>
<PageHeaderMetadata>
<PageHeaderMetadataItem>
<IntlFormatted :message-id="messages.byLabel">
<template #~user>
<nuxt-link
:to="'/user/' + authorization.owner.id"
class="flex items-center gap-1 hover:underline"
target="_blank"
>
<Avatar :src="authorization.owner.avatar_url" size="24px" circle />
{{ authorization.owner.username }}
</nuxt-link>
</template>
</IntlFormatted>
</PageHeaderMetadataItem>
<PageHeaderMetadataItem v-if="authorization.app.url">
<a class="text-link" :to="authorization.app.url" target="_blank">
{{ authorization.app.url }}
</a>
</PageHeaderMetadataItem>
</PageHeaderMetadata>
</div>
</div>
<div>
<ButtonStyled color="red">
<button @click="emit('revoke', authorization.app_id)">
<XCircleIcon />
{{ formatMessage(messages.revokeAction) }}
</button>
</ButtonStyled>
</div>
</div>
<div v-if="showUnofficialDisclosure" class="flex items-center gap-1 text-orange">
<IssuesIcon />
{{ formatMessage(messages.unofficialDisclosure) }}
</div>
</div>
<div class="rounded-b-2xl bg-surface-2 p-4">
<template v-if="authorization.app.description">
<label :for="descriptionId" class="mb-1 flex font-semibold text-contrast">
{{ formatMessage(messages.aboutThisAppLabel) }}
</label>
<div :id="descriptionId" class="mb-4">{{ authorization.app.description }}</div>
</template>

<label :for="scopeListId" class="mb-1 flex font-semibold text-contrast">
{{ formatMessage(commonMessages.permissionsLabel) }}
</label>
<div :id="scopeListId" class="grid gap-1 sm:grid-cols-2">
<div
v-for="scope in scopesToDefinitions(BigInt(authorization.scopes || 0))"
:key="scope"
class="flex items-center gap-1"
>
<CheckIcon class="size-5 shrink-0 text-green" />
{{ scope }}
</div>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import type { Labrinth } from '@modrinth/api-client'
import { BadgeCheckIcon, CheckIcon, IssuesIcon, XCircleIcon } from '@modrinth/assets'
import {
Avatar,
ButtonStyled,
commonMessages,
defineMessages,
IntlFormatted,
PageHeaderMetadata,
PageHeaderMetadataItem,
useVIntl,
} from '@modrinth/ui'
import { isOfficialAccount } from '@modrinth/utils'

import { useScopes } from '~/composables/auth/scopes.ts'

export type AuthorizationCardData = Labrinth.OAuth.Internal.OAuthClientAuthorization & {
app: Labrinth.OAuth.Internal.OAuthClient
owner: Labrinth.Users.v2.User
}

const props = defineProps<{
authorization: AuthorizationCardData
}>()

const emit = defineEmits<{
revoke: [appId: string]
}>()

const { formatMessage } = useVIntl()
const { scopesToDefinitions } = useScopes()

const descriptionId = computed(() => `app-description-${props.authorization.id}`)
const scopeListId = computed(() => `app-scope-list-${props.authorization.id}`)

const unofficialTriggerWords = [
'modrinth',
'mod rinth',
'rnodrinth',
'rinth',
'modrith',
'official',
'verified',
'verification',
]

const showUnofficialDisclosure = computed(() => {
return (
(unofficialTriggerWords.some((word) =>
props.authorization.app.name.toLowerCase().includes(word),
) ||
unofficialTriggerWords.some((word) =>
props.authorization.owner.username?.toLowerCase().includes(word),
)) &&
!isOfficial.value
)
})

const isOfficial = computed(() => {
return isOfficialAccount(props.authorization.owner.id)
})

const messages = defineMessages({
revokeAction: {
id: 'settings.authorizations.revoke.action',
defaultMessage: 'Revoke',
},
byLabel: {
id: 'settings.authorizations.created-by',
defaultMessage: 'Created by {user}',
},
aboutThisAppLabel: {
id: 'settings.authorizations.about-this-app',
defaultMessage: 'About this app',
},
unofficialDisclosure: {
id: 'settings.authorizations.unofficial-disclosure',
defaultMessage: 'This app is not affiliated with Modrinth in any way, despite its name.',
},
officialTooltip: {
id: 'settings.authorizations.official-tooltip',
defaultMessage: 'This app is created by an official Modrinth account.',
},
})
</script>
3 changes: 0 additions & 3 deletions apps/frontend/src/locales/cs-CZ/index.json
Original file line number Diff line number Diff line change
Expand Up @@ -2831,9 +2831,6 @@
"settings.authorizations.about-this-app": {
"message": "O této aplikaci"
},
"settings.authorizations.by": {
"message": "od"
},
"settings.authorizations.head-title": {
"message": "Autorizace"
},
Expand Down
3 changes: 0 additions & 3 deletions apps/frontend/src/locales/da-DK/index.json
Original file line number Diff line number Diff line change
Expand Up @@ -2999,9 +2999,6 @@
"settings.authorizations.about-this-app": {
"message": "Omkring denne app"
},
"settings.authorizations.by": {
"message": "af"
},
"settings.billing.charges.product.midas": {
"message": "Modrinth Plus"
},
Expand Down
6 changes: 0 additions & 6 deletions apps/frontend/src/locales/de-CH/index.json
Original file line number Diff line number Diff line change
Expand Up @@ -4772,15 +4772,9 @@
"settings.authorizations.about-this-app": {
"message": "Über diese Anwendung"
},
"settings.authorizations.by": {
"message": "von"
},
"settings.authorizations.description": {
"message": "Wenn du eine Anwendung mit deinem Modrinth-Konto autorisierst, gewährst du dieser Zugriff auf dein Konto. Du kannst den Zugriff auf dein Konto hier jederzeit verwalten und überprüfen."
},
"settings.authorizations.empty-state": {
"message": "Wir konnen aktuell deine autorisierten Anwendungen nicht anzeigen und arbeiten an einer lösung dafür. Bitte besuche diese Seite zu einem späteren Zeitpunkt erneut!"
},
"settings.authorizations.head-title": {
"message": "Autorisierungen"
},
Expand Down
6 changes: 0 additions & 6 deletions apps/frontend/src/locales/de-DE/index.json
Original file line number Diff line number Diff line change
Expand Up @@ -4772,15 +4772,9 @@
"settings.authorizations.about-this-app": {
"message": "Über diese Anwendung"
},
"settings.authorizations.by": {
"message": "von"
},
"settings.authorizations.description": {
"message": "Wenn du eine Anwendung mit deinem Modrinth-Konto autorisierst, gewährst du dieser Zugriff auf dein Konto. Du kannst den Zugriff auf dein Konto hier jederzeit verwalten und überprüfen."
},
"settings.authorizations.empty-state": {
"message": "Wir können deine autorisierten Apps derzeit nicht anzeigen, wir arbeiten daran, das zu beheben. Bitte besuche diese Seite zu einem späteren Zeitpunkt erneut!"
},
"settings.authorizations.head-title": {
"message": "Autorisierungen"
},
Expand Down
17 changes: 13 additions & 4 deletions apps/frontend/src/locales/en-US/index.json
Original file line number Diff line number Diff line change
Expand Up @@ -4802,18 +4802,24 @@
"settings.authorizations.about-this-app": {
"message": "About this app"
},
"settings.authorizations.by": {
"message": "by"
"settings.authorizations.created-by": {
"message": "Created by {user}"
},
"settings.authorizations.description": {
"message": "When you authorize an application with your Modrinth account, you grant it access to your account. You can manage and review access to your account here at any time."
},
"settings.authorizations.empty-state": {
"message": "We currently can't display your authorized apps, we're working to fix this. Please visit this page at a later date!"
"settings.authorizations.empty-state.description": {
"message": "Applications you authorize will appear here."
},
"settings.authorizations.empty-state.heading": {
"message": "No authorized apps"
},
"settings.authorizations.head-title": {
"message": "Authorizations"
},
"settings.authorizations.official-tooltip": {
"message": "This app is created by an official Modrinth account."
},
"settings.authorizations.revoke.action": {
"message": "Revoke"
},
Expand All @@ -4823,6 +4829,9 @@
"settings.authorizations.revoke.confirm.title": {
"message": "Are you sure you want to revoke this application?"
},
"settings.authorizations.unofficial-disclosure": {
"message": "This app is not affiliated with Modrinth in any way, despite its name."
},
"settings.billing.charges.description": {
"message": "All of your past charges to your Modrinth account will be listed here:"
},
Expand Down
6 changes: 0 additions & 6 deletions apps/frontend/src/locales/es-419/index.json
Original file line number Diff line number Diff line change
Expand Up @@ -4280,15 +4280,9 @@
"settings.authorizations.about-this-app": {
"message": "Acerca de esta aplicación"
},
"settings.authorizations.by": {
"message": "por"
},
"settings.authorizations.description": {
"message": "Cuando autorizas una aplicación con tu cuenta de Modrinth, le concedes acceso a tu cuenta. Puedes gestionar y revisar los accesos a tu cuenta aquí en cualquier momento."
},
"settings.authorizations.empty-state": {
"message": "Actualmente no podemos mostrar tus aplicaciones autorizadas. Estamos trabajando para solucionar esto. ¡Por favor, visita esta página más tarde!"
},
"settings.authorizations.head-title": {
"message": "Autorizaciones"
},
Expand Down
6 changes: 0 additions & 6 deletions apps/frontend/src/locales/es-ES/index.json
Original file line number Diff line number Diff line change
Expand Up @@ -3953,15 +3953,9 @@
"settings.authorizations.about-this-app": {
"message": "Acerca de esta aplicación"
},
"settings.authorizations.by": {
"message": "por"
},
"settings.authorizations.description": {
"message": "Cuando autorizas una aplicación con tu cuenta de Modrinth, le concedes acceso a tu cuenta. Puedes gestionar y revisar el acceso a tu cuenta aquí en cualquier momento."
},
"settings.authorizations.empty-state": {
"message": "Por el momento no podemos mostrar tus aplicaciones autorizadas, pero estamos trabajando para solucionar el problema. ¡Vuelve a visitar esta página más adelante!"
},
"settings.authorizations.head-title": {
"message": "Autorizaciones"
},
Expand Down
6 changes: 0 additions & 6 deletions apps/frontend/src/locales/fil-PH/index.json
Original file line number Diff line number Diff line change
Expand Up @@ -2933,12 +2933,6 @@
"settings.authorizations.about-this-app": {
"message": "Tungkol sa app"
},
"settings.authorizations.by": {
"message": "ni/ng"
},
"settings.authorizations.empty-state": {
"message": "Kasalukuyang hindi namin mapapakita ang mga pinahintulutang app, kinukumpuni pa namin ito. Mangyaring bisitahin ang pahinang ito sa ibang pagkataon!"
},
"settings.authorizations.head-title": {
"message": "Mga pagpapahintulot"
},
Expand Down
6 changes: 0 additions & 6 deletions apps/frontend/src/locales/fr-FR/index.json
Original file line number Diff line number Diff line change
Expand Up @@ -4760,15 +4760,9 @@
"settings.authorizations.about-this-app": {
"message": "À propos de cette application"
},
"settings.authorizations.by": {
"message": "par"
},
"settings.authorizations.description": {
"message": "Lorsque vous autorisez une application avec votre compte Modrinth, vous lui accordez l’accès à votre compte. Vous pouvez gérer et consulter les accès à votre compte ici à tout moment."
},
"settings.authorizations.empty-state": {
"message": "Nous ne pouvons pas afficher vos applications autorisées pour le moment, nous travaillons à résoudre ce problème. Veuillez revenir sur cette page ultérieurement !"
},
"settings.authorizations.head-title": {
"message": "Autorisations"
},
Expand Down
6 changes: 0 additions & 6 deletions apps/frontend/src/locales/hu-HU/index.json
Original file line number Diff line number Diff line change
Expand Up @@ -4223,15 +4223,9 @@
"settings.authorizations.about-this-app": {
"message": "Az alkalmazásról"
},
"settings.authorizations.by": {
"message": "által"
},
"settings.authorizations.description": {
"message": "Amikor engedélyezel egy alkalmazást a Modrinth fiókoddal, hozzáférést biztosítasz számára a fiókodhoz. A fiókodhoz való hozzáférést bármikor kezelheted és ellenőrizheted itt."
},
"settings.authorizations.empty-state": {
"message": "Jelenleg nem tudjuk megjeleníteni az azonosított alkalmazásokat, dolgozunk a probléma megoldásán. Kérlek látogasd meg ezt az oldalt később!"
},
"settings.authorizations.head-title": {
"message": "Engedélyek"
},
Expand Down
6 changes: 0 additions & 6 deletions apps/frontend/src/locales/it-IT/index.json
Original file line number Diff line number Diff line change
Expand Up @@ -4760,15 +4760,9 @@
"settings.authorizations.about-this-app": {
"message": "Info sull'app"
},
"settings.authorizations.by": {
"message": "da"
},
"settings.authorizations.description": {
"message": "Quando autorizzi un'applicazione, le concedi l'accesso al tuo account Modrinth. Qui puoi gestirne e controllarne l'accesso in qualsiasi momento."
},
"settings.authorizations.empty-state": {
"message": "Al momento non riusciamo a mostrare le tue app autorizzate, stiamo lavorando per risolvere il problema. Ritorna più tardi!"
},
"settings.authorizations.head-title": {
"message": "Autorizzazioni"
},
Expand Down
6 changes: 0 additions & 6 deletions apps/frontend/src/locales/ja-JP/index.json
Original file line number Diff line number Diff line change
Expand Up @@ -3713,15 +3713,9 @@
"settings.authorizations.about-this-app": {
"message": "このアプリについて"
},
"settings.authorizations.by": {
"message": "作成者"
},
"settings.authorizations.description": {
"message": "Modrinthアカウントでアプリケーションを承認することにより、アプリケーションがあなたのアカウントにアクセスできるようになります。 アクセス権はいつでも確認でき、変更可能です。"
},
"settings.authorizations.empty-state": {
"message": "現在承認済みアプリを表示することができません。現在修正中のため、また後ほど確認ください!"
},
"settings.authorizations.head-title": {
"message": "承認"
},
Expand Down
Loading
Loading