feat(frontend): hide everything email related if it's disabled on the backend

This commit is contained in:
sam 2024-10-02 21:05:52 +02:00
parent 40da4865bc
commit 567e794154
Signed by: sam
GPG key ID: B4EF20DDE721CAA1
5 changed files with 48 additions and 38 deletions

View file

@ -39,10 +39,10 @@ public class AuthController(
+ $"&prompt=none&state={state}"
+ $"&redirect_uri={HttpUtility.UrlEncode($"{config.BaseUrl}/auth/callback/discord")}";
return Ok(new UrlsResponse(discord, null, null));
return Ok(new UrlsResponse(config.EmailAuth.Enabled, discord, null, null));
}
private record UrlsResponse(string? Discord, string? Google, string? Tumblr);
private record UrlsResponse(bool EmailEnabled, string? Discord, string? Google, string? Tumblr);
public record AuthResponse(
UserRendererService.UserResponse User,

View file

@ -100,6 +100,8 @@ public class EmailAuthController(
[FromBody] CompleteRegistrationRequest req
)
{
CheckRequirements();
var email = await keyCacheService.GetKeyAsync($"email:{req.Ticket}");
if (email == null)
throw new ApiError.BadRequest("Unknown ticket", "ticket", req.Ticket);
@ -185,6 +187,8 @@ public class EmailAuthController(
[Authorize("*")]
public async Task<IActionResult> AddEmailAddressAsync([FromBody] AddEmailAddressRequest req)
{
CheckRequirements();
var emails = await db
.AuthMethods.Where(m => m.UserId == CurrentUser!.Id && m.AuthType == AuthType.Email)
.ToListAsync();

View file

@ -16,6 +16,7 @@ export type CallbackResponse = {
};
export type AuthUrls = {
email_enabled: boolean;
discord?: string;
google?: string;
tumblr?: string;

View file

@ -11,7 +11,7 @@ import {
useActionData,
useLoaderData,
} from "@remix-run/react";
import { Form, Button, ButtonGroup, ListGroup, Row, Col } from "react-bootstrap";
import { Form, Button, ButtonGroup, ListGroup } from "react-bootstrap";
import { useTranslation } from "react-i18next";
import i18n from "~/i18next.server";
import serverRequest, { getToken, writeCookie } from "~/lib/request.server";
@ -78,8 +78,10 @@ export default function LoginPage() {
return (
<>
<Row>
<Col md className="mb-4">
<div className="row">
{!urls.email_enabled && <div className="col-lg-3"></div>}
{urls.email_enabled && (
<div className="col col-md mb-4">
<h2>{t("log-in.form-title")}</h2>
{actionData?.error && <LoginError error={actionData.error} />}
<RemixForm action="/auth/log-in" method="POST">
@ -103,8 +105,9 @@ export default function LoginPage() {
</ButtonGroup>
</Form>
</RemixForm>
</Col>
<Col md>
</div>
)}
<div className="col col-md">
<h2>{t("log-in.3rd-party.title")}</h2>
<p>{t("log-in.3rd-party.desc")}</p>
<ListGroup>
@ -124,8 +127,9 @@ export default function LoginPage() {
</ListGroup.Item>
)}
</ListGroup>
</Col>
</Row>
</div>
{!urls.email_enabled && <div className="col-lg-3"></div>}
</div>
</>
);
}

View file

@ -1,10 +1,12 @@
import i18n from "~/i18next.server";
import { LoaderFunctionArgs, MetaFunction } from "@remix-run/node";
import { Link, useRouteLoaderData } from "@remix-run/react";
import { Link, useLoaderData, useRouteLoaderData } from "@remix-run/react";
import { Button, ListGroup } from "react-bootstrap";
import { loader as settingsLoader } from "~/routes/settings/route";
import { useTranslation } from "react-i18next";
import { AuthMethod, MeUser } from "~/lib/api/user";
import serverRequest from "~/lib/request.server";
import { AuthUrls } from "~/lib/api/auth";
export const meta: MetaFunction<typeof loader> = ({ data }) => {
return [{ title: `${data?.meta.title || "Authentication"} • pronouns.cc` }];
@ -12,17 +14,16 @@ export const meta: MetaFunction<typeof loader> = ({ data }) => {
export const loader = async ({ request }: LoaderFunctionArgs) => {
const t = await i18n.getFixedT(request);
return { meta: { title: t("settings.auth.title") } };
const urls = await serverRequest<AuthUrls>("POST", "/auth/urls", { isInternal: true });
return { urls, meta: { title: t("settings.auth.title") } };
};
export default function AuthSettings() {
const { urls } = useLoaderData<typeof loader>();
const { user } = useRouteLoaderData<typeof settingsLoader>("routes/settings")!;
return (
<div className="px-md-5">
<EmailSettings user={user} />
</div>
);
return <div className="px-md-5">{urls.email_enabled && <EmailSettings user={user} />}</div>;
}
function EmailSettings({ user }: { user: MeUser }) {