Merge pull request #117 from supertokens/fix-user-details

fix: Fix user details failing when user meta data is not enabled

CHANGELOG.md

@@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [unreleased]
 
+## [0.8.2] - 2023-09-20
+
+-   Fixes an issue where user details would not load if user meta data was not enabled in the backend
+
 ## [0.8.1] - 2023-09-18
 
 -   Updates the text for the popup that shows when deleting a user to explain that it will also delete all linked accounts

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "dashboard",
-	"version": "0.8.1",
+	"version": "0.8.2",
 	"private": true,
 	"dependencies": {
 		"@babel/core": "^7.16.0",

server/index.ts

@@ -26,7 +26,6 @@ import Passwordless from "supertokens-node/recipe/passwordless";
 import Session from "supertokens-node/recipe/session";
 import ThirdParty from "supertokens-node/recipe/thirdparty";
 import UserMetaData from "supertokens-node/recipe/usermetadata";
-import RecipeUserId from "../../supertokens-node/lib/build/recipeUserId";
 
 const websiteDomain = "http://localhost:3000";
 
@@ -108,25 +107,6 @@ app.get("/status", (req, res) => {
 	res.status(200).send("Started");
 });
 
-app.get("/link", async (req, res) => {
-	await AccountLinking.linkAccounts(
-		"public",
-		new RecipeUserId("6b763048-486f-4965-b2e0-2f7650efbdf5"),
-		"6f922cbf-99de-4078-a9d0-e67dff5df09d"
-	);
-	await AccountLinking.linkAccounts(
-		"public",
-		new RecipeUserId("9a8837c0-ee02-457b-93bd-61bf16a6c2f9"),
-		"6f922cbf-99de-4078-a9d0-e67dff5df09d"
-	);
-	await AccountLinking.linkAccounts(
-		"public",
-		new RecipeUserId("a31e669f-553a-40dc-9192-1b06c9d75d31"),
-		"6f922cbf-99de-4078-a9d0-e67dff5df09d"
-	);
-	return res.status(200).send("OK");
-});
-
 app.use((err: any, req: Request, res: Response, next: NextFunction) => {
 	// Leaving this in because it helps with debugging
 	console.log("Internal error", err);

src/ui/components/userDetail/userDetailInfoGrid.tsx

@@ -9,6 +9,7 @@ import TooltipContainer from "../tooltip/tooltip";
 import { UserDetailNameField } from "./components/nameField/nameField";
 import { useUserDetailContext } from "./context/UserDetailContext";
 import { UserDetailProps } from "./userDetail";
+import { METADATA_NOT_ENABLED_TEXT } from "./userMetaDataSection";
 
 type UserDetailInfoGridProps = Pick<
 	UserDetailProps,
@@ -194,9 +195,26 @@ export const UserDetailInfoGrid: FC<UserDetailInfoGridProps> = (props) => {
 	const { showLoadingOverlay, hideLoadingOverlay, userDetail } = useUserDetailContext();
 	const [emailErrorFromAPI, setEmailErrorFromAPI] = useState<string | undefined>(undefined);
 	const [phoneErrorFromAPI, setPhoneErrorFromAPI] = useState<string | undefined>(undefined);
+
+	let nameInfo = {};
+
+	if (userDetail.metaData !== undefined && userDetail.metaData !== METADATA_NOT_ENABLED_TEXT) {
+		const metaData = JSON.parse(userDetail.metaData);
+		const firstName = metaData.first_name;
+		const lastName = metaData.last_name;
+
+		if (firstName !== undefined) {
+			nameInfo = { ...nameInfo, firstName };
+		}
+
+		if (lastName !== undefined) {
+			nameInfo = { ...nameInfo, lastName };
+		}
+	}
+
 	const [userState, setUserState] = useState<User>({
 		...userDetail.details,
-		...JSON.parse(userDetail.metaData ?? "{}"),
+		...nameInfo,
 	});
 	const { showModal } = useContext(PopupContentContext);
 	const { firstName, lastName, timeJoined, emails, isPrimaryUser } = userState;

src/ui/components/userDetail/userMetaDataSection.tsx

@@ -22,6 +22,8 @@ import IconButton from "../common/iconButton";
 import { useUserDetailContext } from "./context/UserDetailContext";
 import "./userMetaDataSection.scss";
 
+export const METADATA_NOT_ENABLED_TEXT = "Feature Not Enabled";
+
 export const UserMetaDataSection: React.FC = () => {
 	const { hideLoadingOverlay, showLoadingOverlay, userDetail } = useUserDetailContext();
 	const [isEditing, setIsEditing] = useState<boolean>(false);
@@ -40,7 +42,7 @@ export const UserMetaDataSection: React.FC = () => {
 	}, [userDetail]);
 
 	const getFormattedMetaData = (_metadata: string): string => {
-		if (_metadata === "Feature Not Enabled") {
+		if (_metadata === METADATA_NOT_ENABLED_TEXT) {
 			return _metadata;
 		}
 

src/version.ts

@@ -13,4 +13,4 @@
  * under the License.
  */
 
-export const package_version = "0.8.1";
+export const package_version = "0.8.2";