You've already forked AstralRinth
forked from didirus/AstralRinth
Add TailwindCSS (#1252)
* Setup TailwindCSS * Fully setup configuration * Refactor some tailwind variables
This commit is contained in:
Evan Song
@@ -80,159 +80,161 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { Button, Avatar } from '@modrinth/ui'
|
||||
import { XIcon, CheckIcon } from '@modrinth/assets'
|
||||
import { useBaseFetch } from '@/composables/fetch.js'
|
||||
import { useAuth } from '@/composables/auth.js'
|
||||
import { Button, Avatar } from "@modrinth/ui";
|
||||
import { XIcon, CheckIcon } from "@modrinth/assets";
|
||||
import { useBaseFetch } from "@/composables/fetch.js";
|
||||
import { useAuth } from "@/composables/auth.js";
|
||||
|
||||
import { useScopes } from '@/composables/auth/scopes.ts'
|
||||
import { useScopes } from "@/composables/auth/scopes.ts";
|
||||
|
||||
const { formatMessage } = useVIntl()
|
||||
const { formatMessage } = useVIntl();
|
||||
|
||||
const messages = defineMessages({
|
||||
appInfo: {
|
||||
id: 'auth.authorize.app-info',
|
||||
id: "auth.authorize.app-info",
|
||||
defaultMessage:
|
||||
'<strong>{appName}</strong> by <creator-link>{creator}</creator-link> will be able to:',
|
||||
"<strong>{appName}</strong> by <creator-link>{creator}</creator-link> will be able to:",
|
||||
},
|
||||
authorize: {
|
||||
id: 'auth.authorize.action.authorize',
|
||||
defaultMessage: 'Authorize',
|
||||
id: "auth.authorize.action.authorize",
|
||||
defaultMessage: "Authorize",
|
||||
},
|
||||
decline: {
|
||||
id: 'auth.authorize.action.decline',
|
||||
defaultMessage: 'Decline',
|
||||
id: "auth.authorize.action.decline",
|
||||
defaultMessage: "Decline",
|
||||
},
|
||||
noRedirectUrlError: {
|
||||
id: 'auth.authorize.error.no-redirect-url',
|
||||
defaultMessage: 'No redirect location found in response',
|
||||
id: "auth.authorize.error.no-redirect-url",
|
||||
defaultMessage: "No redirect location found in response",
|
||||
},
|
||||
redirectUrl: {
|
||||
id: 'auth.authorize.redirect-url',
|
||||
defaultMessage: 'You will be redirected to <redirect-url>{url}</redirect-url>',
|
||||
id: "auth.authorize.redirect-url",
|
||||
defaultMessage: "You will be redirected to <redirect-url>{url}</redirect-url>",
|
||||
},
|
||||
title: {
|
||||
id: 'auth.authorize.authorize-app-name',
|
||||
defaultMessage: 'Authorize {appName}',
|
||||
id: "auth.authorize.authorize-app-name",
|
||||
defaultMessage: "Authorize {appName}",
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
const data = useNuxtApp()
|
||||
const data = useNuxtApp();
|
||||
|
||||
const router = useNativeRoute()
|
||||
const auth = await useAuth()
|
||||
const { scopesToDefinitions } = useScopes()
|
||||
const router = useNativeRoute();
|
||||
const auth = await useAuth();
|
||||
const { scopesToDefinitions } = useScopes();
|
||||
|
||||
const clientId = router.query?.client_id || false
|
||||
const redirectUri = router.query?.redirect_uri || false
|
||||
const scope = router.query?.scope || false
|
||||
const state = router.query?.state || false
|
||||
const clientId = router.query?.client_id || false;
|
||||
const redirectUri = router.query?.redirect_uri || false;
|
||||
const scope = router.query?.scope || false;
|
||||
const state = router.query?.state || false;
|
||||
|
||||
const getFlowIdAuthorization = async () => {
|
||||
const query = {
|
||||
client_id: clientId,
|
||||
redirect_uri: redirectUri,
|
||||
scope,
|
||||
}
|
||||
};
|
||||
if (state) {
|
||||
query.state = state
|
||||
query.state = state;
|
||||
}
|
||||
|
||||
const authorization = await useBaseFetch('oauth/authorize', {
|
||||
method: 'GET',
|
||||
const authorization = await useBaseFetch("oauth/authorize", {
|
||||
method: "GET",
|
||||
internal: true,
|
||||
query,
|
||||
}) // This will contain the flow_id and oauth_client_id for accepting the oauth on behalf of the user
|
||||
}); // This will contain the flow_id and oauth_client_id for accepting the oauth on behalf of the user
|
||||
|
||||
if (typeof authorization === 'string') {
|
||||
if (typeof authorization === "string") {
|
||||
await navigateTo(authorization, {
|
||||
external: true,
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
return authorization
|
||||
}
|
||||
return authorization;
|
||||
};
|
||||
|
||||
const {
|
||||
data: authorizationData,
|
||||
pending,
|
||||
error,
|
||||
} = await useAsyncData('authorization', getFlowIdAuthorization)
|
||||
} = await useAsyncData("authorization", getFlowIdAuthorization);
|
||||
|
||||
const { data: app } = await useAsyncData('oauth/app/' + clientId, () =>
|
||||
useBaseFetch('oauth/app/' + clientId, {
|
||||
method: 'GET',
|
||||
const { data: app } = await useAsyncData("oauth/app/" + clientId, () =>
|
||||
useBaseFetch("oauth/app/" + clientId, {
|
||||
method: "GET",
|
||||
internal: true,
|
||||
})
|
||||
)
|
||||
}),
|
||||
);
|
||||
|
||||
const scopeDefinitions = scopesToDefinitions(BigInt(authorizationData.value?.requested_scopes || 0))
|
||||
const scopeDefinitions = scopesToDefinitions(
|
||||
BigInt(authorizationData.value?.requested_scopes || 0),
|
||||
);
|
||||
|
||||
const { data: createdBy } = await useAsyncData('user/' + app.value.created_by, () =>
|
||||
useBaseFetch('user/' + app.value.created_by, {
|
||||
method: 'GET',
|
||||
const { data: createdBy } = await useAsyncData("user/" + app.value.created_by, () =>
|
||||
useBaseFetch("user/" + app.value.created_by, {
|
||||
method: "GET",
|
||||
apiVersion: 3,
|
||||
})
|
||||
)
|
||||
}),
|
||||
);
|
||||
|
||||
const onAuthorize = async () => {
|
||||
try {
|
||||
const res = await useBaseFetch('oauth/accept', {
|
||||
method: 'POST',
|
||||
const res = await useBaseFetch("oauth/accept", {
|
||||
method: "POST",
|
||||
internal: true,
|
||||
body: {
|
||||
flow: authorizationData.value.flow_id,
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
if (typeof res === 'string') {
|
||||
if (typeof res === "string") {
|
||||
navigateTo(res, {
|
||||
external: true,
|
||||
})
|
||||
return
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
throw new Error(formatMessage(messages.noRedirectUrlError))
|
||||
throw new Error(formatMessage(messages.noRedirectUrlError));
|
||||
} catch (error) {
|
||||
data.$notify({
|
||||
group: 'main',
|
||||
group: "main",
|
||||
title: formatMessage(commonMessages.errorNotificationTitle),
|
||||
text: err.data ? err.data.description : err,
|
||||
type: 'error',
|
||||
})
|
||||
type: "error",
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const onReject = async () => {
|
||||
try {
|
||||
const res = await useBaseFetch('oauth/reject', {
|
||||
method: 'POST',
|
||||
const res = await useBaseFetch("oauth/reject", {
|
||||
method: "POST",
|
||||
body: {
|
||||
flow: authorizationData.value.flow_id,
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
if (typeof res === 'string') {
|
||||
if (typeof res === "string") {
|
||||
navigateTo(res, {
|
||||
external: true,
|
||||
})
|
||||
return
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
throw new Error(formatMessage(messages.noRedirectUrlError))
|
||||
throw new Error(formatMessage(messages.noRedirectUrlError));
|
||||
} catch (error) {
|
||||
data.$notify({
|
||||
group: 'main',
|
||||
group: "main",
|
||||
title: formatMessage(commonMessages.errorNotificationTitle),
|
||||
text: err.data ? err.data.description : err,
|
||||
type: 'error',
|
||||
})
|
||||
type: "error",
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
definePageMeta({
|
||||
middleware: 'auth',
|
||||
})
|
||||
middleware: "auth",
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
@@ -72,163 +72,163 @@
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { SendIcon, MailIcon, KeyIcon } from '@modrinth/assets'
|
||||
import { SendIcon, MailIcon, KeyIcon } from "@modrinth/assets";
|
||||
|
||||
const { formatMessage } = useVIntl()
|
||||
const { formatMessage } = useVIntl();
|
||||
|
||||
const methodChoiceMessages = defineMessages({
|
||||
description: {
|
||||
id: 'auth.reset-password.method-choice.description',
|
||||
id: "auth.reset-password.method-choice.description",
|
||||
defaultMessage:
|
||||
"Enter your email below and we'll send a recovery link to allow you to recover your account.",
|
||||
},
|
||||
emailUsernameLabel: {
|
||||
id: 'auth.reset-password.method-choice.email-username.label',
|
||||
defaultMessage: 'Email or username',
|
||||
id: "auth.reset-password.method-choice.email-username.label",
|
||||
defaultMessage: "Email or username",
|
||||
},
|
||||
emailUsernamePlaceholder: {
|
||||
id: 'auth.reset-password.method-choice.email-username.placeholder',
|
||||
defaultMessage: 'Email',
|
||||
id: "auth.reset-password.method-choice.email-username.placeholder",
|
||||
defaultMessage: "Email",
|
||||
},
|
||||
action: {
|
||||
id: 'auth.reset-password.method-choice.action',
|
||||
defaultMessage: 'Send recovery email',
|
||||
id: "auth.reset-password.method-choice.action",
|
||||
defaultMessage: "Send recovery email",
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
const postChallengeMessages = defineMessages({
|
||||
description: {
|
||||
id: 'auth.reset-password.post-challenge.description',
|
||||
defaultMessage: 'Enter your new password below to gain access to your account.',
|
||||
id: "auth.reset-password.post-challenge.description",
|
||||
defaultMessage: "Enter your new password below to gain access to your account.",
|
||||
},
|
||||
confirmPasswordLabel: {
|
||||
id: 'auth.reset-password.post-challenge.confirm-password.label',
|
||||
defaultMessage: 'Confirm password',
|
||||
id: "auth.reset-password.post-challenge.confirm-password.label",
|
||||
defaultMessage: "Confirm password",
|
||||
},
|
||||
action: {
|
||||
id: 'auth.reset-password.post-challenge.action',
|
||||
defaultMessage: 'Reset password',
|
||||
id: "auth.reset-password.post-challenge.action",
|
||||
defaultMessage: "Reset password",
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
// NOTE(Brawaru): Vite uses esbuild for minification so can't combine these
|
||||
// because it'll keep the original prop names compared to consts, which names
|
||||
// will be mangled.
|
||||
const emailSentNotificationMessages = defineMessages({
|
||||
title: {
|
||||
id: 'auth.reset-password.notification.email-sent.title',
|
||||
defaultMessage: 'Email sent',
|
||||
id: "auth.reset-password.notification.email-sent.title",
|
||||
defaultMessage: "Email sent",
|
||||
},
|
||||
text: {
|
||||
id: 'auth.reset-password.notification.email-sent.text',
|
||||
id: "auth.reset-password.notification.email-sent.text",
|
||||
defaultMessage:
|
||||
'An email with instructions has been sent to you if the email was previously saved on your account.',
|
||||
"An email with instructions has been sent to you if the email was previously saved on your account.",
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
const passwordResetNotificationMessages = defineMessages({
|
||||
title: {
|
||||
id: 'auth.reset-password.notification.password-reset.title',
|
||||
defaultMessage: 'Password successfully reset',
|
||||
id: "auth.reset-password.notification.password-reset.title",
|
||||
defaultMessage: "Password successfully reset",
|
||||
},
|
||||
text: {
|
||||
id: 'auth.reset-password.notification.password-reset.text',
|
||||
defaultMessage: 'You can now log-in into your account with your new password.',
|
||||
id: "auth.reset-password.notification.password-reset.text",
|
||||
defaultMessage: "You can now log-in into your account with your new password.",
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
const messages = defineMessages({
|
||||
title: {
|
||||
id: 'auth.reset-password.title',
|
||||
defaultMessage: 'Reset Password',
|
||||
id: "auth.reset-password.title",
|
||||
defaultMessage: "Reset Password",
|
||||
},
|
||||
longTitle: {
|
||||
id: 'auth.reset-password.title.long',
|
||||
defaultMessage: 'Reset your password',
|
||||
id: "auth.reset-password.title.long",
|
||||
defaultMessage: "Reset your password",
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
useHead({
|
||||
title: () => `${formatMessage(messages.title)} - Modrinth`,
|
||||
})
|
||||
});
|
||||
|
||||
const auth = await useAuth()
|
||||
const auth = await useAuth();
|
||||
if (auth.value.user) {
|
||||
await navigateTo('/dashboard')
|
||||
await navigateTo("/dashboard");
|
||||
}
|
||||
|
||||
const route = useNativeRoute()
|
||||
const route = useNativeRoute();
|
||||
|
||||
const step = ref('choose_method')
|
||||
const step = ref("choose_method");
|
||||
|
||||
if (route.query.flow) {
|
||||
step.value = 'passed_challenge'
|
||||
step.value = "passed_challenge";
|
||||
}
|
||||
|
||||
const turnstile = ref()
|
||||
const turnstile = ref();
|
||||
|
||||
const email = ref('')
|
||||
const token = ref('')
|
||||
const email = ref("");
|
||||
const token = ref("");
|
||||
|
||||
async function recovery() {
|
||||
startLoading()
|
||||
startLoading();
|
||||
try {
|
||||
await useBaseFetch('auth/password/reset', {
|
||||
method: 'POST',
|
||||
await useBaseFetch("auth/password/reset", {
|
||||
method: "POST",
|
||||
body: {
|
||||
username: email.value,
|
||||
challenge: token.value,
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
addNotification({
|
||||
group: 'main',
|
||||
group: "main",
|
||||
title: formatMessage(emailSentNotificationMessages.title),
|
||||
text: formatMessage(emailSentNotificationMessages.text),
|
||||
type: 'success',
|
||||
})
|
||||
type: "success",
|
||||
});
|
||||
} catch (err) {
|
||||
addNotification({
|
||||
group: 'main',
|
||||
group: "main",
|
||||
title: formatMessage(commonMessages.errorNotificationTitle),
|
||||
text: err.data ? err.data.description : err,
|
||||
type: 'error',
|
||||
})
|
||||
turnstile.value?.reset()
|
||||
type: "error",
|
||||
});
|
||||
turnstile.value?.reset();
|
||||
}
|
||||
stopLoading()
|
||||
stopLoading();
|
||||
}
|
||||
|
||||
const newPassword = ref('')
|
||||
const confirmNewPassword = ref('')
|
||||
const newPassword = ref("");
|
||||
const confirmNewPassword = ref("");
|
||||
|
||||
async function changePassword() {
|
||||
startLoading()
|
||||
startLoading();
|
||||
try {
|
||||
await useBaseFetch('auth/password', {
|
||||
method: 'PATCH',
|
||||
await useBaseFetch("auth/password", {
|
||||
method: "PATCH",
|
||||
body: {
|
||||
new_password: newPassword.value,
|
||||
flow: route.query.flow,
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
addNotification({
|
||||
group: 'main',
|
||||
group: "main",
|
||||
title: formatMessage(passwordResetNotificationMessages.title),
|
||||
text: formatMessage(passwordResetNotificationMessages.text),
|
||||
type: 'success',
|
||||
})
|
||||
await navigateTo('/auth/sign-in')
|
||||
type: "success",
|
||||
});
|
||||
await navigateTo("/auth/sign-in");
|
||||
} catch (err) {
|
||||
addNotification({
|
||||
group: 'main',
|
||||
group: "main",
|
||||
title: formatMessage(commonMessages.errorNotificationTitle),
|
||||
text: err.data ? err.data.description : err,
|
||||
type: 'error',
|
||||
})
|
||||
turnstile.value?.reset()
|
||||
type: "error",
|
||||
});
|
||||
turnstile.value?.reset();
|
||||
}
|
||||
stopLoading()
|
||||
stopLoading();
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -126,154 +126,154 @@ import {
|
||||
SSOGitLabIcon,
|
||||
KeyIcon,
|
||||
MailIcon,
|
||||
} from '@modrinth/assets'
|
||||
} from "@modrinth/assets";
|
||||
|
||||
const { formatMessage } = useVIntl()
|
||||
const { formatMessage } = useVIntl();
|
||||
|
||||
const messages = defineMessages({
|
||||
additionalOptionsLabel: {
|
||||
id: 'auth.sign-in.additional-options',
|
||||
id: "auth.sign-in.additional-options",
|
||||
defaultMessage:
|
||||
'<forgot-password-link>Forgot password?</forgot-password-link> • <create-account-link>Create an account</create-account-link>',
|
||||
"<forgot-password-link>Forgot password?</forgot-password-link> • <create-account-link>Create an account</create-account-link>",
|
||||
},
|
||||
emailUsernameLabel: {
|
||||
id: 'auth.sign-in.email-username.label',
|
||||
defaultMessage: 'Email or username',
|
||||
id: "auth.sign-in.email-username.label",
|
||||
defaultMessage: "Email or username",
|
||||
},
|
||||
passwordLabel: {
|
||||
id: 'auth.sign-in.password.label',
|
||||
defaultMessage: 'Password',
|
||||
id: "auth.sign-in.password.label",
|
||||
defaultMessage: "Password",
|
||||
},
|
||||
signInWithLabel: {
|
||||
id: 'auth.sign-in.sign-in-with',
|
||||
defaultMessage: 'Sign in with',
|
||||
id: "auth.sign-in.sign-in-with",
|
||||
defaultMessage: "Sign in with",
|
||||
},
|
||||
signInTitle: {
|
||||
id: 'auth.sign-in.title',
|
||||
defaultMessage: 'Sign In',
|
||||
id: "auth.sign-in.title",
|
||||
defaultMessage: "Sign In",
|
||||
},
|
||||
twoFactorCodeInputPlaceholder: {
|
||||
id: 'auth.sign-in.2fa.placeholder',
|
||||
defaultMessage: 'Enter code...',
|
||||
id: "auth.sign-in.2fa.placeholder",
|
||||
defaultMessage: "Enter code...",
|
||||
},
|
||||
twoFactorCodeLabel: {
|
||||
id: 'auth.sign-in.2fa.label',
|
||||
defaultMessage: 'Enter two-factor code',
|
||||
id: "auth.sign-in.2fa.label",
|
||||
defaultMessage: "Enter two-factor code",
|
||||
},
|
||||
twoFactorCodeLabelDescription: {
|
||||
id: 'auth.sign-in.2fa.description',
|
||||
defaultMessage: 'Please enter a two-factor code to proceed.',
|
||||
id: "auth.sign-in.2fa.description",
|
||||
defaultMessage: "Please enter a two-factor code to proceed.",
|
||||
},
|
||||
usePasswordLabel: {
|
||||
id: 'auth.sign-in.use-password',
|
||||
defaultMessage: 'Or use a password',
|
||||
id: "auth.sign-in.use-password",
|
||||
defaultMessage: "Or use a password",
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
useHead({
|
||||
title() {
|
||||
return `${formatMessage(messages.signInTitle)} - Modrinth`
|
||||
return `${formatMessage(messages.signInTitle)} - Modrinth`;
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
const auth = await useAuth()
|
||||
const route = useNativeRoute()
|
||||
const auth = await useAuth();
|
||||
const route = useNativeRoute();
|
||||
|
||||
const redirectTarget = route.query.redirect || ''
|
||||
const redirectTarget = route.query.redirect || "";
|
||||
|
||||
if (route.fullPath.includes('new_account=true')) {
|
||||
if (route.fullPath.includes("new_account=true")) {
|
||||
await navigateTo(
|
||||
`/auth/welcome?authToken=${route.query.code}${
|
||||
route.query.redirect ? `&redirect=${encodeURIComponent(route.query.redirect)}` : ''
|
||||
}`
|
||||
)
|
||||
route.query.redirect ? `&redirect=${encodeURIComponent(route.query.redirect)}` : ""
|
||||
}`,
|
||||
);
|
||||
} else if (route.query.code) {
|
||||
await finishSignIn()
|
||||
await finishSignIn();
|
||||
}
|
||||
|
||||
if (auth.value.user) {
|
||||
await finishSignIn()
|
||||
await finishSignIn();
|
||||
}
|
||||
|
||||
const turnstile = ref()
|
||||
const turnstile = ref();
|
||||
|
||||
const email = ref('')
|
||||
const password = ref('')
|
||||
const token = ref('')
|
||||
const email = ref("");
|
||||
const password = ref("");
|
||||
const token = ref("");
|
||||
|
||||
const flow = ref(route.query.flow)
|
||||
const flow = ref(route.query.flow);
|
||||
|
||||
const signUpLink = computed(
|
||||
() => `/auth/sign-up${route.query.redirect ? `?redirect=${route.query.redirect}` : ''}`
|
||||
)
|
||||
() => `/auth/sign-up${route.query.redirect ? `?redirect=${route.query.redirect}` : ""}`,
|
||||
);
|
||||
|
||||
async function beginPasswordSignIn() {
|
||||
startLoading()
|
||||
startLoading();
|
||||
try {
|
||||
const res = await useBaseFetch('auth/login', {
|
||||
method: 'POST',
|
||||
const res = await useBaseFetch("auth/login", {
|
||||
method: "POST",
|
||||
body: {
|
||||
username: email.value,
|
||||
password: password.value,
|
||||
challenge: token.value,
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
if (res.flow) {
|
||||
flow.value = res.flow
|
||||
flow.value = res.flow;
|
||||
} else {
|
||||
await finishSignIn(res.session)
|
||||
await finishSignIn(res.session);
|
||||
}
|
||||
} catch (err) {
|
||||
addNotification({
|
||||
group: 'main',
|
||||
group: "main",
|
||||
title: formatMessage(commonMessages.errorNotificationTitle),
|
||||
text: err.data ? err.data.description : err,
|
||||
type: 'error',
|
||||
})
|
||||
turnstile.value?.reset()
|
||||
type: "error",
|
||||
});
|
||||
turnstile.value?.reset();
|
||||
}
|
||||
stopLoading()
|
||||
stopLoading();
|
||||
}
|
||||
|
||||
const twoFactorCode = ref(null)
|
||||
const twoFactorCode = ref(null);
|
||||
async function begin2FASignIn() {
|
||||
startLoading()
|
||||
startLoading();
|
||||
try {
|
||||
const res = await useBaseFetch('auth/login/2fa', {
|
||||
method: 'POST',
|
||||
const res = await useBaseFetch("auth/login/2fa", {
|
||||
method: "POST",
|
||||
body: {
|
||||
flow: flow.value,
|
||||
code: twoFactorCode.value ? twoFactorCode.value.toString() : twoFactorCode.value,
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
await finishSignIn(res.session)
|
||||
await finishSignIn(res.session);
|
||||
} catch (err) {
|
||||
addNotification({
|
||||
group: 'main',
|
||||
group: "main",
|
||||
title: formatMessage(commonMessages.errorNotificationTitle),
|
||||
text: err.data ? err.data.description : err,
|
||||
type: 'error',
|
||||
})
|
||||
turnstile.value?.reset()
|
||||
type: "error",
|
||||
});
|
||||
turnstile.value?.reset();
|
||||
}
|
||||
stopLoading()
|
||||
stopLoading();
|
||||
}
|
||||
|
||||
async function finishSignIn(token) {
|
||||
if (token) {
|
||||
await useAuth(token)
|
||||
await useUser()
|
||||
await useAuth(token);
|
||||
await useUser();
|
||||
}
|
||||
|
||||
if (route.query.redirect) {
|
||||
const redirect = decodeURIComponent(route.query.redirect)
|
||||
const redirect = decodeURIComponent(route.query.redirect);
|
||||
await navigateTo(redirect, {
|
||||
replace: true,
|
||||
})
|
||||
});
|
||||
} else {
|
||||
await navigateTo('/dashboard')
|
||||
await navigateTo("/dashboard");
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -143,111 +143,111 @@ import {
|
||||
KeyIcon,
|
||||
MailIcon,
|
||||
SSOGitLabIcon,
|
||||
} from '@modrinth/assets'
|
||||
import { Checkbox } from '@modrinth/ui'
|
||||
} from "@modrinth/assets";
|
||||
import { Checkbox } from "@modrinth/ui";
|
||||
|
||||
const { formatMessage } = useVIntl()
|
||||
const { formatMessage } = useVIntl();
|
||||
|
||||
const messages = defineMessages({
|
||||
title: {
|
||||
id: 'auth.sign-up.title',
|
||||
defaultMessage: 'Sign Up',
|
||||
id: "auth.sign-up.title",
|
||||
defaultMessage: "Sign Up",
|
||||
},
|
||||
signUpWithTitle: {
|
||||
id: 'auth.sign-up.title.sign-up-with',
|
||||
defaultMessage: 'Sign up with',
|
||||
id: "auth.sign-up.title.sign-up-with",
|
||||
defaultMessage: "Sign up with",
|
||||
},
|
||||
createAccountTitle: {
|
||||
id: 'auth.sign-up.title.create-account',
|
||||
defaultMessage: 'Or create an account yourself',
|
||||
id: "auth.sign-up.title.create-account",
|
||||
defaultMessage: "Or create an account yourself",
|
||||
},
|
||||
emailLabel: {
|
||||
id: 'auth.sign-up.email.label',
|
||||
defaultMessage: 'Email',
|
||||
id: "auth.sign-up.email.label",
|
||||
defaultMessage: "Email",
|
||||
},
|
||||
usernameLabel: {
|
||||
id: 'auth.sign-up.label.username',
|
||||
defaultMessage: 'Username',
|
||||
id: "auth.sign-up.label.username",
|
||||
defaultMessage: "Username",
|
||||
},
|
||||
passwordLabel: {
|
||||
id: 'auth.sign-up.password.label',
|
||||
defaultMessage: 'Password',
|
||||
id: "auth.sign-up.password.label",
|
||||
defaultMessage: "Password",
|
||||
},
|
||||
confirmPasswordLabel: {
|
||||
id: 'auth.sign-up.confirm-password.label',
|
||||
defaultMessage: 'Confirm password',
|
||||
id: "auth.sign-up.confirm-password.label",
|
||||
defaultMessage: "Confirm password",
|
||||
},
|
||||
subscribeLabel: {
|
||||
id: 'auth.sign-up.subscribe.label',
|
||||
defaultMessage: 'Subscribe to updates about Modrinth',
|
||||
id: "auth.sign-up.subscribe.label",
|
||||
defaultMessage: "Subscribe to updates about Modrinth",
|
||||
},
|
||||
legalDisclaimer: {
|
||||
id: 'auth.sign-up.legal-dislaimer',
|
||||
id: "auth.sign-up.legal-dislaimer",
|
||||
defaultMessage:
|
||||
"By creating an account, you agree to Modrinth's <terms-link>Terms</terms-link> and <privacy-policy-link>Privacy Policy</privacy-policy-link>.",
|
||||
},
|
||||
createAccountButton: {
|
||||
id: 'auth.sign-up.action.create-account',
|
||||
defaultMessage: 'Create account',
|
||||
id: "auth.sign-up.action.create-account",
|
||||
defaultMessage: "Create account",
|
||||
},
|
||||
alreadyHaveAccountLabel: {
|
||||
id: 'auth.sign-up.sign-in-option.title',
|
||||
defaultMessage: 'Already have an account?',
|
||||
id: "auth.sign-up.sign-in-option.title",
|
||||
defaultMessage: "Already have an account?",
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
useHead({
|
||||
title: () => `${formatMessage(messages.title)} - Modrinth`,
|
||||
})
|
||||
});
|
||||
|
||||
const auth = await useAuth()
|
||||
const route = useNativeRoute()
|
||||
const auth = await useAuth();
|
||||
const route = useNativeRoute();
|
||||
|
||||
const redirectTarget = route.query.redirect
|
||||
const redirectTarget = route.query.redirect;
|
||||
|
||||
if (route.fullPath.includes('new_account=true')) {
|
||||
if (route.fullPath.includes("new_account=true")) {
|
||||
await navigateTo(
|
||||
`/auth/welcome?authToken=${route.query.code}${
|
||||
route.query.redirect ? `&redirect=${encodeURIComponent(route.query.redirect)}` : ''
|
||||
}`
|
||||
)
|
||||
route.query.redirect ? `&redirect=${encodeURIComponent(route.query.redirect)}` : ""
|
||||
}`,
|
||||
);
|
||||
}
|
||||
|
||||
if (auth.value.user) {
|
||||
await navigateTo('/dashboard')
|
||||
await navigateTo("/dashboard");
|
||||
}
|
||||
|
||||
const turnstile = ref()
|
||||
const turnstile = ref();
|
||||
|
||||
const email = ref('')
|
||||
const username = ref('')
|
||||
const password = ref('')
|
||||
const confirmPassword = ref('')
|
||||
const token = ref('')
|
||||
const subscribe = ref(true)
|
||||
const email = ref("");
|
||||
const username = ref("");
|
||||
const password = ref("");
|
||||
const confirmPassword = ref("");
|
||||
const token = ref("");
|
||||
const subscribe = ref(true);
|
||||
|
||||
const signInLink = computed(
|
||||
() => `/auth/sign-in${route.query.redirect ? `?redirect=${route.query.redirect}` : ''}`
|
||||
)
|
||||
() => `/auth/sign-in${route.query.redirect ? `?redirect=${route.query.redirect}` : ""}`,
|
||||
);
|
||||
|
||||
async function createAccount() {
|
||||
startLoading()
|
||||
startLoading();
|
||||
try {
|
||||
if (confirmPassword.value !== password.value) {
|
||||
addNotification({
|
||||
group: 'main',
|
||||
group: "main",
|
||||
title: formatMessage(commonMessages.errorNotificationTitle),
|
||||
text: formatMessage({
|
||||
id: 'auth.sign-up.notification.password-mismatch.text',
|
||||
defaultMessage: 'Passwords do not match!',
|
||||
id: "auth.sign-up.notification.password-mismatch.text",
|
||||
defaultMessage: "Passwords do not match!",
|
||||
}),
|
||||
type: 'error',
|
||||
})
|
||||
turnstile.value?.reset()
|
||||
type: "error",
|
||||
});
|
||||
turnstile.value?.reset();
|
||||
}
|
||||
|
||||
const res = await useBaseFetch('auth/create', {
|
||||
method: 'POST',
|
||||
const res = await useBaseFetch("auth/create", {
|
||||
method: "POST",
|
||||
body: {
|
||||
username: username.value,
|
||||
password: password.value,
|
||||
@@ -255,25 +255,25 @@ async function createAccount() {
|
||||
challenge: token.value,
|
||||
sign_up_newsletter: subscribe.value,
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
await useAuth(res.session)
|
||||
await useUser()
|
||||
await useAuth(res.session);
|
||||
await useUser();
|
||||
|
||||
if (route.query.redirect) {
|
||||
await navigateTo(route.query.redirect)
|
||||
await navigateTo(route.query.redirect);
|
||||
} else {
|
||||
await navigateTo('/dashboard')
|
||||
await navigateTo("/dashboard");
|
||||
}
|
||||
} catch (err) {
|
||||
addNotification({
|
||||
group: 'main',
|
||||
group: "main",
|
||||
title: formatMessage(commonMessages.errorNotificationTitle),
|
||||
text: err.data ? err.data.description : err,
|
||||
type: 'error',
|
||||
})
|
||||
turnstile.value?.reset()
|
||||
type: "error",
|
||||
});
|
||||
turnstile.value?.reset();
|
||||
}
|
||||
stopLoading()
|
||||
stopLoading();
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -52,101 +52,101 @@
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { SettingsIcon, RightArrowIcon } from '@modrinth/assets'
|
||||
import { SettingsIcon, RightArrowIcon } from "@modrinth/assets";
|
||||
|
||||
const { formatMessage } = useVIntl()
|
||||
const { formatMessage } = useVIntl();
|
||||
|
||||
const messages = defineMessages({
|
||||
title: {
|
||||
id: 'auth.verify-email.title',
|
||||
defaultMessage: 'Verify Email',
|
||||
id: "auth.verify-email.title",
|
||||
defaultMessage: "Verify Email",
|
||||
},
|
||||
accountSettings: {
|
||||
id: 'auth.verify-email.action.account-settings',
|
||||
defaultMessage: 'Account settings',
|
||||
id: "auth.verify-email.action.account-settings",
|
||||
defaultMessage: "Account settings",
|
||||
},
|
||||
signIn: {
|
||||
id: 'auth.verify-email.action.sign-in',
|
||||
defaultMessage: 'Sign in',
|
||||
id: "auth.verify-email.action.sign-in",
|
||||
defaultMessage: "Sign in",
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
const alreadyVerifiedMessages = defineMessages({
|
||||
title: {
|
||||
id: 'auth.verify-email.already-verified.title',
|
||||
defaultMessage: 'Email already verified',
|
||||
id: "auth.verify-email.already-verified.title",
|
||||
defaultMessage: "Email already verified",
|
||||
},
|
||||
description: {
|
||||
id: 'auth.verify-email.already-verified.description',
|
||||
defaultMessage: 'Your email is already verified!',
|
||||
id: "auth.verify-email.already-verified.description",
|
||||
defaultMessage: "Your email is already verified!",
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
const postVerificationMessages = defineMessages({
|
||||
title: {
|
||||
id: 'auth.verify-email.post-verification.title',
|
||||
defaultMessage: 'Email verification',
|
||||
id: "auth.verify-email.post-verification.title",
|
||||
defaultMessage: "Email verification",
|
||||
},
|
||||
description: {
|
||||
id: 'auth.verify-email.post-verification.description',
|
||||
defaultMessage: 'Your email address has been successfully verified!',
|
||||
id: "auth.verify-email.post-verification.description",
|
||||
defaultMessage: "Your email address has been successfully verified!",
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
const failedVerificationMessages = defineMessages({
|
||||
title: {
|
||||
id: 'auth.verify-email.failed-verification.title',
|
||||
defaultMessage: 'Email verification failed',
|
||||
id: "auth.verify-email.failed-verification.title",
|
||||
defaultMessage: "Email verification failed",
|
||||
},
|
||||
description: {
|
||||
id: 'auth.verify-email.failed-verification.description',
|
||||
id: "auth.verify-email.failed-verification.description",
|
||||
defaultMessage:
|
||||
'We were unable to verify your email. Try re-sending the verification email through your dashboard by signing in.',
|
||||
"We were unable to verify your email. Try re-sending the verification email through your dashboard by signing in.",
|
||||
},
|
||||
loggedInDescription: {
|
||||
id: 'auth.verify-email.failed-verification.description.logged-in',
|
||||
id: "auth.verify-email.failed-verification.description.logged-in",
|
||||
defaultMessage:
|
||||
'We were unable to verify your email. Try re-sending the verification email through the button below.',
|
||||
"We were unable to verify your email. Try re-sending the verification email through the button below.",
|
||||
},
|
||||
action: {
|
||||
id: 'auth.verify-email.failed-verification.action',
|
||||
defaultMessage: 'Resend verification email',
|
||||
id: "auth.verify-email.failed-verification.action",
|
||||
defaultMessage: "Resend verification email",
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
useHead({
|
||||
title: () => `${formatMessage(messages.title)} - Modrinth`,
|
||||
})
|
||||
});
|
||||
|
||||
const auth = await useAuth()
|
||||
const auth = await useAuth();
|
||||
|
||||
const success = ref(false)
|
||||
const route = useNativeRoute()
|
||||
const success = ref(false);
|
||||
const route = useNativeRoute();
|
||||
|
||||
if (route.query.flow) {
|
||||
try {
|
||||
const emailVerified = useState('emailVerified', () => null)
|
||||
const emailVerified = useState("emailVerified", () => null);
|
||||
|
||||
if (emailVerified.value === null) {
|
||||
await useBaseFetch('auth/email/verify', {
|
||||
method: 'POST',
|
||||
await useBaseFetch("auth/email/verify", {
|
||||
method: "POST",
|
||||
body: {
|
||||
flow: route.query.flow,
|
||||
},
|
||||
})
|
||||
emailVerified.value = true
|
||||
success.value = true
|
||||
});
|
||||
emailVerified.value = true;
|
||||
success.value = true;
|
||||
}
|
||||
|
||||
if (emailVerified.value) {
|
||||
success.value = true
|
||||
success.value = true;
|
||||
|
||||
if (auth.value.token) {
|
||||
await useAuth(auth.value.token)
|
||||
await useAuth(auth.value.token);
|
||||
}
|
||||
}
|
||||
} catch (err) {
|
||||
success.value = false
|
||||
success.value = false;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -36,60 +36,62 @@
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { Checkbox } from '@modrinth/ui'
|
||||
import { RightArrowIcon } from '@modrinth/assets'
|
||||
import { Checkbox } from "@modrinth/ui";
|
||||
import { RightArrowIcon } from "@modrinth/assets";
|
||||
|
||||
const { formatMessage } = useVIntl()
|
||||
const { formatMessage } = useVIntl();
|
||||
|
||||
const messages = defineMessages({
|
||||
subscribeCheckbox: {
|
||||
id: 'auth.welcome.checkbox.subscribe',
|
||||
defaultMessage: 'Subscribe to updates about Modrinth',
|
||||
id: "auth.welcome.checkbox.subscribe",
|
||||
defaultMessage: "Subscribe to updates about Modrinth",
|
||||
},
|
||||
tosLabel: {
|
||||
id: 'auth.welcome.label.tos',
|
||||
id: "auth.welcome.label.tos",
|
||||
defaultMessage:
|
||||
"By creating an account, you have agreed to Modrinth's <terms-link>Terms</terms-link> and <privacy-policy-link>Privacy Policy</privacy-policy-link>.",
|
||||
},
|
||||
welcomeDescription: {
|
||||
id: 'auth.welcome.description',
|
||||
id: "auth.welcome.description",
|
||||
defaultMessage:
|
||||
'Thank you for creating an account. You can now follow and create projects, receive updates about your favorite projects, and more!',
|
||||
"Thank you for creating an account. You can now follow and create projects, receive updates about your favorite projects, and more!",
|
||||
},
|
||||
welcomeLongTitle: {
|
||||
id: 'auth.welcome.long-title',
|
||||
defaultMessage: 'Welcome to Modrinth!',
|
||||
id: "auth.welcome.long-title",
|
||||
defaultMessage: "Welcome to Modrinth!",
|
||||
},
|
||||
welcomeTitle: {
|
||||
id: 'auth.welcome.title',
|
||||
defaultMessage: 'Welcome',
|
||||
id: "auth.welcome.title",
|
||||
defaultMessage: "Welcome",
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
useHead({
|
||||
title: () => `${formatMessage(messages.welcomeTitle)} - Modrinth`,
|
||||
})
|
||||
});
|
||||
|
||||
const subscribe = ref(true)
|
||||
const subscribe = ref(true);
|
||||
|
||||
async function continueSignUp() {
|
||||
const route = useNativeRoute()
|
||||
const route = useNativeRoute();
|
||||
|
||||
await useAuth(route.query.authToken)
|
||||
await useUser()
|
||||
await useAuth(route.query.authToken);
|
||||
await useUser();
|
||||
|
||||
if (subscribe.value) {
|
||||
try {
|
||||
await useBaseFetch('auth/email/subscribe', {
|
||||
method: 'POST',
|
||||
})
|
||||
} catch {}
|
||||
await useBaseFetch("auth/email/subscribe", {
|
||||
method: "POST",
|
||||
});
|
||||
} catch {
|
||||
/* empty */
|
||||
}
|
||||
}
|
||||
|
||||
if (route.query.redirect) {
|
||||
await navigateTo(route.query.redirect)
|
||||
await navigateTo(route.query.redirect);
|
||||
} else {
|
||||
await navigateTo('/dashboard')
|
||||
await navigateTo("/dashboard");
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user