Migrate /api/password_reset_token_valid to RTK (#40568)

frontend/src/metabase-types/api/mocks/session.ts

-import type { PasswordResetTokenInfo } from "metabase-types/api";
+import type { PasswordResetTokenStatus } from "metabase-types/api";
 
-export const createMockPasswordResetTokenInfo = (
-  opts?: Partial<PasswordResetTokenInfo>,
-): PasswordResetTokenInfo => ({
+export const createMockPasswordResetTokenStatus = (
+  opts?: Partial<PasswordResetTokenStatus>,
+): PasswordResetTokenStatus => ({
   valid: false,
   ...opts,
 });

frontend/src/metabase-types/api/session.ts

-export interface PasswordResetTokenInfo {
+export interface PasswordResetTokenStatus {
   valid: boolean;
 }

frontend/src/metabase/api/index.ts

@@ -4,4 +4,5 @@ export * from "./database";
 export * from "./dataset";
 export * from "./field";
 export * from "./login-history";
+export * from "./session";
 export * from "./table";

frontend/src/metabase/api/session.ts

+import type { PasswordResetTokenStatus } from "metabase-types/api";
+
+import { Api } from "./api";
+
+export const sessionApi = Api.injectEndpoints({
+  endpoints: builder => ({
+    getPasswordResetTokenStatus: builder.query<
+      PasswordResetTokenStatus,
+      string
+    >({
+      query: token => ({
+        method: "GET",
+        url: "/api/session/password_reset_token_valid",
+        body: { token },
+      }),
+    }),
+  }),
+});
+
+export const { useGetPasswordResetTokenStatusQuery } = sessionApi;

frontend/src/metabase/auth/actions.ts

@@ -2,7 +2,7 @@ import { getIn } from "icepick";
 import { push } from "react-router-redux";
 
 import { deleteSession, initiateSLO } from "metabase/lib/auth";
-import { reload, isSmallScreen } from "metabase/lib/dom";
+import { isSmallScreen, reload } from "metabase/lib/dom";
 import { loadLocalization } from "metabase/lib/i18n";
 import { createAsyncThunk } from "metabase/lib/redux";
 import MetabaseSettings from "metabase/lib/settings";
@@ -177,12 +177,3 @@ export const validatePassword = async (password: string) => {
     return getIn(error, ["data", "errors", "password"]);
   }
 };
-
-export const validatePasswordToken = async (token: string) => {
-  const result = await SessionApi.password_reset_token_valid({ token });
-  const valid = getIn(result, ["valid"]);
-
-  if (!valid) {
-    throw result;
-  }
-};

frontend/src/metabase/auth/components/ResetPassword/ResetPassword.tsx

-import { useCallback, useEffect, useState } from "react";
+import { useCallback } from "react";
 import { replace } from "react-router-redux";
 import { t } from "ttag";
 
+import { useGetPasswordResetTokenStatusQuery } from "metabase/api";
 import Button from "metabase/core/components/Button";
 import Link from "metabase/core/components/Link";
 import { useDispatch } from "metabase/lib/redux";
 import { addUndo } from "metabase/redux/undo";
 
-import {
-  resetPassword,
-  validatePassword,
-  validatePasswordToken,
-} from "../../actions";
+import { resetPassword, validatePassword } from "../../actions";
 import type { ResetPasswordData } from "../../types";
 import { AuthLayout } from "../AuthLayout";
 import { ResetPasswordForm } from "../ResetPasswordForm";
 
 import { InfoBody, InfoMessage, InfoTitle } from "./ResetPassword.styled";
 
-type ViewType = "none" | "form" | "expired";
-
 interface ResetPasswordQueryParams {
   token: string;
 }
@@ -32,17 +27,9 @@ export const ResetPassword = ({
   params,
 }: ResetPasswordProps): JSX.Element | null => {
   const { token } = params;
-  const [view, setView] = useState<ViewType>("none");
   const dispatch = useDispatch();
-
-  const handleLoad = useCallback(async () => {
-    try {
-      await validatePasswordToken(token);
-      setView("form");
-    } catch (error) {
-      setView("expired");
-    }
-  }, [token]);
+  const { data: status, isLoading } =
+    useGetPasswordResetTokenStatusQuery(token);
 
   const handlePasswordSubmit = useCallback(
     async ({ password }: ResetPasswordData) => {
@@ -53,19 +40,20 @@ export const ResetPassword = ({
     [token, dispatch],
   );
 
-  useEffect(() => {
-    handleLoad();
-  }, [handleLoad]);
+  if (isLoading) {
+    return <AuthLayout />;
+  }
 
   return (
     <AuthLayout>
-      {view === "form" && (
+      {status?.valid ? (
         <ResetPasswordForm
           onValidatePassword={validatePassword}
           onSubmit={handlePasswordSubmit}
         />
+      ) : (
+        <ResetPasswordExpired />
       )}
-      {view === "expired" && <ResetPasswordExpired />}
     </AuthLayout>
   );
 };

frontend/src/metabase/services.js

@@ -443,7 +443,6 @@ export const SessionApi = {
   properties: GET("/api/session/properties"),
   forgot_password: POST("/api/session/forgot_password"),
   reset_password: POST("/api/session/reset_password"),
-  password_reset_token_valid: GET("/api/session/password_reset_token_valid"),
   unsubscribe: POST("/api/session/pulse/unsubscribe"),
   undo_unsubscribe: POST("/api/session/pulse/unsubscribe/undo"),
 };

frontend/test/__support__/server-mocks/session.ts

 import fetchMock from "fetch-mock";
 
-import type { PasswordResetTokenInfo, Settings } from "metabase-types/api";
+import type { PasswordResetTokenStatus, Settings } from "metabase-types/api";
 
 export function setupPropertiesEndpoints(settings: Settings) {
   fetchMock.get("path:/api/session/properties", settings);
@@ -22,6 +22,8 @@ export function setupResetPasswordEndpoint() {
   fetchMock.post("path:/api/session/reset_password", 204);
 }
 
-export function setupPasswordResetTokenEndpoint(info: PasswordResetTokenInfo) {
-  fetchMock.get("path:/api/session/password_reset_token_valid", info);
+export function setupPasswordResetTokenEndpoint(
+  status: PasswordResetTokenStatus,
+) {
+  fetchMock.get("path:/api/session/password_reset_token_valid", status);
 }