feat: migrate accounts from development to production

src/app/(main)/account/settings/page.tsx

@@ -39,81 +39,99 @@ import { DialogContent, DialogTrigger } from "@/components/ui/dialog";
 import CodeDialog from "@/components/misc/LinkDialog";
 
 export default function Settings() {
-  const clerk = useClerk();
+	const clerk = useClerk();
 
-  const { user, isSignedIn } = useUser();
+	const { user, isSignedIn } = useUser();
-  const [linked, setLinked] = useState(false);
+	const [linked, setLinked] = useState(false);
-  useEffect(() => {
+	useEffect(() => {
-    setLinked(user?.publicMetadata.player != undefined);
+		setLinked(user?.publicMetadata.player != undefined);
-  }, [user, isSignedIn]);
+	}, [user, isSignedIn]);
 
-  return (
+	const forceUnlink = async () => {
-    <main className="p-4">
+    if (!linked) await toast.promise(unlinkMCAccount(), {
-      <strong className="text-3xl">Linking</strong>
+      success: "Unlinked account!",
-      <br />
+      loading: "Unlinking...",
-      <br />
+      error: "Error while unlinking account.",
-      <strong className="font-bold">Link Account</strong>
+    });
-      <div className="flex items-center">
+    else
-        <p>
+      await toast.warning("Please use the normal unlink option before using the force unlink one.")
-          Link a Minecraft account to customize a server you own.
+  };
-          <br />{" "}
-          {user?.publicMetadata.player != undefined && linked && (
-            <>Currently linked to {user?.publicMetadata.player as string}</>
-          )}
-        </p>
 
-        <Dialog>
+	return (
-          <DialogTrigger>
+		<main className="p-4">
-            {!linked && <Button className="h-[30px] ml-2">Link Account</Button>}
+			<strong className="text-3xl">Linking</strong>
-          </DialogTrigger>
+			<br />
-          <DialogContent>
+			<br />
-            <CodeDialog
+			<strong className="font-bold">Link Account</strong>
-              linked={linked}
+			<div className="flex items-center">
-              setLinked={(c) => {
+				<p>
-                setLinked(c);
+					Link a Minecraft account to customize a server you own.
-              }}
+					<br />{" "}
-            />
+					{user?.publicMetadata.player != undefined && linked && (
-          </DialogContent>
+						<>Currently linked to {user?.publicMetadata.player as string}</>
-        </Dialog>
+					)}
+				</p>
 
-        {linked && (
+				<Dialog>
-          <Button className="h-[30px] ml-2" disabled>
+					<DialogTrigger>
-            Already linked
+						{!linked && <Button className="h-[30px] ml-2">Link Account</Button>}
-          </Button>
+					</DialogTrigger>
-        )}
+					<DialogContent>
-      </div>
+						<CodeDialog
-      <br />
+							linked={linked}
-      <strong className="font-bold">Unlink Account</strong>
+							setLinked={(c) => {
-      <div className="flex items-center">
+								setLinked(c);
-        <p>Unlink your Minecraft account if you have already linked one.</p>
+							}}
+						/>
+					</DialogContent>
+				</Dialog>
 
-        {!linked && (
+				{linked && (
-          <Button className="h-[30px] ml-2" disabled>
+					<Button className="h-[30px] ml-2" disabled>
-            No linked account
+						Already linked
-          </Button>
+					</Button>
-        )}
+				)}
+			</div>
+			<br />
+			<strong className="font-bold">Unlink Account</strong>
+			<div className="flex items-center">
+				<p>Unlink your Minecraft account if you have already linked one.</p>
 
-        {linked && (
+				{!linked && (
-          <Button
+					<Button className="h-[30px] ml-2" disabled>
-            className="h-[30px] ml-2"
+						No linked account
-            variant="destructive"
+					</Button>
-            onClick={async () => {
+				)}
-              await toast.promise(unlinkMCAccount(), {
+
-                success: "Unlinked account!",
+				{linked && (
-                loading: "Unlinking...",
+					<Button
-                error: "Error while unlinking account.",
+						className="h-[30px] ml-2"
-              });
+						variant="destructive"
-              setLinked(false);
+						onClick={async () => {
-            }}
+							await toast.promise(unlinkMCAccount(), {
-          >
+								success: "Unlinked account!",
-            Unlink account
+								loading: "Unlinking...",
-          </Button>
+								error: "Error while unlinking account.",
-        )}
+							});
-      </div>
+							setLinked(false);
-      <small className="mt-0">
+						}}
-        All of your customizations stay the same, and can be changed if another
+					>
-        account links your Minecraft account.
+						Unlink account
-      </small>
+					</Button>
-    </main>
+				)}
-  );
+			</div>
+			<small className="mt-0">
+				All of your customizations stay the same, and can be changed if another
+				account links your Minecraft account.{" "}
+				<div
+					className="cursor-pointer text-blue-600"
+					onClick={forceUnlink}
+					onKeyDown={forceUnlink}
+					onKeyUp={forceUnlink}
+				>
+					Still linked in-game? Force unlink your account.
+				</div>
+			</small>
+		</main>
+	);
 }

src/app/(main)/layout.tsx

@@ -37,13 +37,13 @@ import { ThemeProvider } from "@/components/ThemeProvider";
 import { ClerkThemeProvider } from "@/components/clerk/ClerkThemeProvider";
 import NewDomainDialog from "@/components/misc/NewDomainDialog";
 import ThemedToaster from "@/components/misc/ThemedToaster";
-import UnofficalDialog from "@/components/misc/UnofficalDialog";
 import { TooltipProvider } from "@/components/ui/tooltip";
 import type { Metadata, Viewport } from "next";
 import { Inter as interFont } from "next/font/google";
 import LayoutPart from "@/components/feat/LayoutPart";
 import AllBanners from "@/components/feat/AllBanners";
 import Footer from "@/components/misc/Footer";
+import { SwitchEnvPopup } from "@/components/misc/SwitchEnvPopup";
 
 export const extraMetadata = {
   twitter: {
@@ -84,7 +84,7 @@ export default async function RootLayout({
           <SpeedInsights />
           <Analytics />
           <NewDomainDialog />
-          <UnofficalDialog />
+          <SwitchEnvPopup />
           <Footer />
         </TooltipProvider>
       </ThemeProvider>

src/components/clerk/SignInPopoverButton.tsx

@@ -35,8 +35,9 @@ import {
   PopoverTrigger,
 } from "@/components/ui/popover";
 import { Button } from "../ui/button";
-import { AtSign, LogIn } from "lucide-react";
+import { AtSign, LogIn, Ship } from "lucide-react";
 import { useClerk } from "@clerk/nextjs";
+import { useRouter } from "@/lib/useRouter";
 
 export default function SignInPopoverButton({
   className,
@@ -67,11 +68,14 @@ export default function SignInPopoverButton({
 
 export function SignInPopover() {
   const clerk = useClerk();
+  const router = useRouter();
   return (
     <div className=" grid w-[200px]">
       <strong className="text-center">Login</strong>
-      <small className="text-center pb-6">
+      <small className="text-center pb-2">
-        Customize your own servers and favorite other servers. Secured by Clerk
+        Customize your own servers and favorite other servers. Secured by Clerk
+        <br className="py-2"/>
+        If you created your account before Jan. 29, 2025, use the legacy migration button.
       </small>
       <br />
       <Button variant={"ghost"} onClick={() => clerk.openSignIn()}>
@@ -82,6 +86,9 @@ export function SignInPopover() {
         <AtSign size={18} className="mr-2" />
         Sign-up
       </Button>
+      <Button variant="ghost" onClick={() => router.push(process.env.NEXT_PUBLIC_CLERK_SWITCH_DOMAIN as string)}>
+        <Ship size={18} className="mr-2"/>Legacy Migration
+      </Button>
     </div>
   );
 }

src/components/misc/Link.tsx

@@ -41,8 +41,8 @@ export default function A({
 }) {
   return (
     <NextLink
-      href={pageFind(children || "")}
+      href={pageFind(children || "") || "#"}
-      className="no-underline transition duration-300 hover:underline "
+      className="transition duration-300 underline"
       title={children}
     >
       {(children || "").startsWith("Docs:") && (
@@ -68,7 +68,7 @@ export function ALegacy({
 }) {
   return (
     <NextLink
-      href={pageFind(href || "")}
+      href={pageFind(href || "") || "#"}
       className="no-underline transition duration-300 hover:underline "
       title={href}
     >
@@ -95,6 +95,7 @@ export const pageFind = (text: string) => {
   if (text === "Special:AccountOptions") return "/account/settings/options";
   if (text.startsWith("Server:") && text.endsWith("/Customization"))
     return "/server/" + text.substring(7, text.length - 14) + "/customization";
+  if (text === "Special:ClerkConvertionPage") return process.env.NEXT_PUBLIC_CLERK_SWITCH_DOMAIN;
   if (text.startsWith("Server:")) return "/server/" + text.substring(7);
   if (text.startsWith("Wiki:"))
     return "https://minehut.wiki.gg/wiki/" + text.substring(5);

src/components/misc/SwitchEnvPopup.tsx

@@ -0,0 +1,58 @@
+"use client";
+
+import { useEffect, useState } from "react";
+import {
+    Dialog,
+    DialogContent,
+    DialogTitle,
+    DialogTrigger,
+} from "../ui/dialog";
+import { OctagonAlert } from "lucide-react";
+import A from "./Link";
+import { Button } from "../ui/button";
+import { useRouter } from "@/lib/useRouter";
+
+export function SwitchEnvPopup() {
+    const [open, setOpen] = useState(false);
+    const router = useRouter();
+
+    useEffect(() => {
+        if (localStorage.getItem("mhsf--switch-env-alert") !== "true") {
+            setOpen(true);
+        }
+    }, [])
+
+    const setDialogTrigger = (v: boolean) => {
+        setOpen(v)
+        if (!v) {
+            localStorage.setItem("mhsf--switch-env-alert", "true")
+        }
+    }
+
+    return (
+        <Dialog open={open} onOpenChange={setDialogTrigger}>
+            <DialogContent>
+                <OctagonAlert className="text-orange-300" />
+                <DialogTitle className="text-3xl">
+                    Wait! Did you have an old account?
+                </DialogTitle>
+                <p className="inline">
+                    <strong>If you had an account before Jan. 28th, 2025</strong>, you
+                    have a legacy account that <i>needs to be converted.</i>
+                </p>
+                <p className="inline">
+                    Legacy accounts can be converted by going to{" "}
+                    <A alt="this page">Special:ClerkConvertionPage</A> and logging in with
+                    your old account & creating a new account. Your old account settings &
+                    content will automatically be transferred to your new account.{" "}
+                </p>
+                <div className="flex items-center">
+                    <Button onClick={() => { router.push(process.env.NEXT_PUBLIC_CLERK_SWITCH_DOMAIN || "#") }}>Convert account</Button>{" "}
+                    <DialogTrigger>
+                        <Button className="ml-2" variant="outline">Close</Button>
+                    </DialogTrigger>
+                </div>
+            </DialogContent>
+        </Dialog>
+    );
+}

src/components/misc/UnofficalDialog.tsx

@@ -1,77 +0,0 @@
-/*
- * MHSF, Minehut Server List
- * All external content is rather licensed under the ECA Agreement
- * located here: https://list.mlnehut.com/docs/legal/external-content-agreement
- *
- * All code under MHSF is licensed under the MIT License
- * by open source contributors
- *
- * Copyright (c) 2024 dvelo
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy
- * of this software and associated documentation files (the "Software"), to
- * deal in the Software without restriction, including without limitation the
- * rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
- * sell copies of the Software, and to permit persons to whom the Software is
- * furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
- * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
- * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
- * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
- * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
- * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
- * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
- * OTHER DEALINGS IN THE SOFTWARE.
- */
-
-"use client";
-import { useEffect, useState } from "react";
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogHeader,
-  DialogTitle,
-} from "../ui/dialog";
-
-export default function UnofficalDialog() {
-  const [isOpen, setOpen] = useState(false);
-
-  useEffect(() => {
-    const dialog = localStorage.getItem("unoffical-dialog-open");
-
-    if (dialog == null) {
-      setOpen(true);
-    }
-  }, []);
-
-  const onChangeVal = (state: boolean) => {
-    if (state == false) {
-      setOpen(false);
-      localStorage.setItem("unoffical-dialog-open", "true");
-    } else setOpen(state);
-  };
-
-  return (
-    <Dialog open={isOpen} onOpenChange={onChangeVal}>
-      <DialogContent>
-        <DialogHeader>
-          <DialogTitle>Welcome to the Minehut Server List (MHSF)</DialogTitle>
-        </DialogHeader>
-        <DialogDescription>
-          MHSF is a Minehut server-list using the Minehut API to serve you
-          servers with filters, sorts and other helpful information when picking
-          a server to play.{" "}
-          <span className="font-bold">
-            Keep in mind that MHSF is not endorsed by Minehut or GamerSafer in
-            any way, as MHSF is a open-source unofficial project.
-          </span>
-        </DialogDescription>
-      </DialogContent>
-    </Dialog>
-  );
-}

src/config/version.tsx

@@ -67,8 +67,25 @@ const FeatureList = ({
   );
 };
 
-export const version = "1.7.0";
+export const version = "1.7.5";
 export const changelog: { name: string; id: string; changelog: ReactNode }[] = [
+  {
+    id: "tj4ijg09aern9eargjjuauerr",
+    name: "v1.7.5",
+    changelog: (
+      <FeatureList
+        github="https://github.com/DeveloLongScript/MHSF/releases/tag/1.7.5"
+        features={[
+          "Migrated accounts from development to production"
+        ]}
+        title={
+          <strong className="flex items-center">
+            Version 1.7.5 (January 29th 2025)
+          </strong>
+        }
+      />
+    ),
+  },
   {
     id: "38ufajf8efajwj3njdaisef",
     name: "v1.7",