Compare commits

..

3 Commits

Author SHA1 Message Date
dvelo
c15a06567c fix: non-authenticated can't work 2024-12-22 15:17:25 -06:00
dvelo
ed03f8d7c5 fix: move embeds from root to embeds. 2024-12-22 15:10:52 -06:00
dvelo
fad6c6f70a fix: infinite loop redirect in embeds 2024-12-22 13:57:03 -06:00
5 changed files with 48 additions and 39 deletions

@ -34,7 +34,7 @@ Set the following variables in the .env.local file:
# Clerk # Clerk
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY="pk_..." NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY="pk_..."
CLERK_SECRET_KEY="sk_..." CLERK_SECRET_KEY="sk_..."
IS_AUTH="true" NEXT_PUBLIC_IS_AUTH="true"
``` ```
## MongoDB ## MongoDB

@ -29,7 +29,6 @@
*/ */
"use client"; "use client";
import { TooltipProvider } from "@/components/ui/tooltip"; import { TooltipProvider } from "@/components/ui/tooltip";
import "../globals.css"; import "../globals.css";
import { ThemeProvider } from "@/components/ThemeProvider"; import { ThemeProvider } from "@/components/ThemeProvider";

@ -36,44 +36,53 @@ import { type ReactNode, useEffect, useState } from "react";
import { ThemeProvider } from "../ThemeProvider"; import { ThemeProvider } from "../ThemeProvider";
export function ClerkThemeProvider({ export function ClerkThemeProvider({
children, children,
className, className,
}: { }: {
children: ReactNode | ReactNode[]; children?: ReactNode | ReactNode[];
className: string | undefined; className?: string | undefined;
}) { }) {
const [theme, setTheme] = useState<string | undefined>(""); const [theme, setTheme] = useState<string | undefined>("");
return ( if (process.env.NEXT_PUBLIC_IS_AUTH !== "true")
<ClerkProvider return (
appearance={{ baseTheme: theme == "dark" ? dark : undefined }} <html lang="en" className={className}>
> <body>
<html lang="en" className={className}> Non-authenticated environments are disallowed on this origin.
<body> </body>
<ThemeProvider </html>
attribute="class" );
defaultTheme="system"
enableSystem return (
disableTransitionOnChange <ClerkProvider
> appearance={{ baseTheme: theme == "dark" ? dark : undefined }}
{children} >
{/** This *has* to be implemented in component form for the `useTheme` to load at the appropriate time. */} <html lang="en" className={className}>
<ThemeElement setTheme={setTheme} /> <body>
</ThemeProvider> <ThemeProvider
</body> attribute="class"
</html> defaultTheme="system"
</ClerkProvider> enableSystem
); disableTransitionOnChange
>
{children}
{/** This *has* to be implemented in component form for the `useTheme` to load at the appropriate time. */}
<ThemeElement setTheme={setTheme} />
</ThemeProvider>
</body>
</html>
</ClerkProvider>
);
} }
function ThemeElement({ function ThemeElement({
setTheme, setTheme,
}: { }: {
setTheme: (update: string | undefined) => void; setTheme: (update: string | undefined) => void;
}) { }) {
const theme = useTheme(); const theme = useTheme();
useEffect(() => { useEffect(() => {
setTheme(theme.resolvedTheme); setTheme(theme.resolvedTheme);
}, [theme.resolvedTheme, setTheme]); }, [theme.resolvedTheme, setTheme]);
return <></>; return <></>;
} }

@ -59,7 +59,7 @@ export default function EmbedSelector({ server }: { server: string }) {
const [selectedCodeType, setSelectedCodeType] = useState("jsx"); const [selectedCodeType, setSelectedCodeType] = useState("jsx");
const [noMinehutBranding, setNoMinehutBranding] = useState(false); const [noMinehutBranding, setNoMinehutBranding] = useState(false);
const clipboard = useClipboard(); const clipboard = useClipboard();
const [url, setURL] = useState(`https://mhsf.app/embed/${server}?`); const [url, setURL] = useState(`https://embeds.mhsf.app/embed/${server}?`);
const [jsxCode, setJsxCode] = useState(`<iframe const [jsxCode, setJsxCode] = useState(`<iframe
src="${url}" src="${url}"
width={390} width={390}
@ -155,7 +155,7 @@ export default function EmbedSelector({ server }: { server: string }) {
onCheckedChange={(c) => { onCheckedChange={(c) => {
setEmbedStatic(c == "indeterminate" ? true : c); setEmbedStatic(c == "indeterminate" ? true : c);
setURL( setURL(
`https://mhsf.app/embed/${server}?${c ? "&static=true" : ""}${ `https://embeds.mhsf.app/embed/${server}?${c ? "&static=true" : ""}${
noMinehutBranding ? "&branding=false" : "" noMinehutBranding ? "&branding=false" : ""
}&theme=${embedTheme}` }&theme=${embedTheme}`
); );
@ -182,7 +182,7 @@ export default function EmbedSelector({ server }: { server: string }) {
onCheckedChange={(c) => { onCheckedChange={(c) => {
setNoMinehutBranding(c == "indeterminate" ? true : c); setNoMinehutBranding(c == "indeterminate" ? true : c);
setURL( setURL(
`https://mhsf.app/embed/${server}?${embedStatic ? "&static=true" : ""}${ `https://embeds.mhsf.app/embed/${server}?${embedStatic ? "&static=true" : ""}${
c ? "&branding=false" : "" c ? "&branding=false" : ""
}&theme=${embedTheme}` }&theme=${embedTheme}`
); );
@ -214,7 +214,7 @@ export default function EmbedSelector({ server }: { server: string }) {
onValueChange={(c) => { onValueChange={(c) => {
setEmbedTheme(c); setEmbedTheme(c);
setURL( setURL(
`https://mhsf.app/embed/${server}?${embedStatic ? "&static=true" : ""}${ `https://embeds.mhsf.app/embed/${server}?${embedStatic ? "&static=true" : ""}${
noMinehutBranding ? "&branding=false" : "" noMinehutBranding ? "&branding=false" : ""
}&theme=${c}` }&theme=${c}`
); );

@ -32,8 +32,9 @@ import { clerkMiddleware, createRouteMatcher } from "@clerk/nextjs/server";
import { NextRequest } from "next/server"; import { NextRequest } from "next/server";
const isProtectedRoute = createRouteMatcher(["/account(.*)"]); const isProtectedRoute = createRouteMatcher(["/account(.*)"]);
const isEmbed = createRouteMatcher(["/emebed(.*)"]);
export default process.env.IS_AUTH == "true" export default process.env.NEXT_PUBLIC_IS_AUTH === "true"
? clerkMiddleware((auth, req) => { ? clerkMiddleware((auth, req) => {
if (isProtectedRoute(req)) auth.protect(); if (isProtectedRoute(req)) auth.protect();
}) })