further refinement

Author: brendan-kellam

packages/web/src/app/(app)/settings/components/settingsCard.tsx

@@ -29,7 +29,6 @@ interface BasicSettingsCardProps {
     name: string;
     description?: string;
     children: ReactNode;
-    /** Optional content rendered full-width below the name/description/control row (e.g. an info notice or an expandable section). */
     footer?: ReactNode;
     className?: string;
 }

packages/web/src/app/(app)/settings/security/actions.ts

@@ -15,6 +15,14 @@ import { StatusCodes } from "http-status-codes";
 export const setMemberApprovalRequired = async (required: boolean): Promise<{ success: boolean } | ServiceError> => sew(async () =>
     withAuth(async ({ org, role, prisma }) =>
         withMinimumOrgRole(role, OrgRole.OWNER, async () => {
+            if (env.REQUIRE_APPROVAL_NEW_MEMBERS !== undefined) {
+                return {
+                    statusCode: StatusCodes.BAD_REQUEST,
+                    errorCode: ErrorCode.MEMBER_APPROVAL_CONTROLLED_BY_ENV,
+                    message: "Member approval is controlled by the REQUIRE_APPROVAL_NEW_MEMBERS environment variable and cannot be changed from the UI.",
+                } satisfies ServiceError;
+            }
+
             await prisma.org.update({
                 where: { id: org.id },
                 data: { memberApprovalRequired: required },
@@ -66,13 +74,20 @@ export const setCredentialsLoginEnabled = async (enabled: boolean): Promise<{ su
 export const setAnonymousAccessStatus = async (enabled: boolean): Promise<ServiceError | boolean> => sew(async () =>
     withAuth(async ({ org, role, prisma }) =>
         withMinimumOrgRole(role, OrgRole.OWNER, async () => {
+            if (env.FORCE_ENABLE_ANONYMOUS_ACCESS !== undefined) {
+                return {
+                    statusCode: StatusCodes.BAD_REQUEST,
+                    errorCode: ErrorCode.ANONYMOUS_ACCESS_CONTROLLED_BY_ENV,
+                    message: "Anonymous access is controlled by the FORCE_ENABLE_ANONYMOUS_ACCESS environment variable and cannot be changed from the UI.",
+                } satisfies ServiceError;
+            }
+
             const anonymousAccessAvailable = await isAnonymousAccessAvailable();
             if (!anonymousAccessAvailable) {
-                console.error(`Anonymous access isn't supported in your current plan. For support, contact ${SOURCEBOT_SUPPORT_EMAIL}.`);
                 return {
                     statusCode: StatusCodes.FORBIDDEN,
                     errorCode: ErrorCode.INSUFFICIENT_PERMISSIONS,
-                    message: "Anonymous access is not supported in your current plan",
+                    message: `Anonymous access is not supported in your current plan. For support, contact ${SOURCEBOT_SUPPORT_EMAIL}.`,
                 } satisfies ServiceError;
             }
 

packages/web/src/app/(app)/settings/security/components/anonymousAccessEnabledSettingsCard.tsx

@@ -3,18 +3,15 @@
 import { useState } from "react"
 import { Switch } from "@/components/ui/switch"
 import { setAnonymousAccessStatus } from "@/app/(app)/settings/security/actions"
-import { cn, isServiceError } from "@/lib/utils"
+import { isServiceError } from "@/lib/utils"
 import { useToast } from "@/components/hooks/use-toast"
 import { BasicSettingsCard } from "@/app/(app)/settings/components/settingsCard"
-import { SettingNotice } from "./settingNotice"
 
 interface AnonymousAccessEnabledSettingsCardProps {
-    anonymousAccessAvailable: boolean;
     anonymousAccessEnabled: boolean
-    isControlledByEnvVar: boolean
 }
 
-export function AnonymousAccessEnabledSettingsCard({ anonymousAccessAvailable, anonymousAccessEnabled, isControlledByEnvVar }: AnonymousAccessEnabledSettingsCardProps) {
+export function AnonymousAccessEnabledSettingsCard({ anonymousAccessEnabled }: AnonymousAccessEnabledSettingsCardProps) {
     const [enabled, setEnabled] = useState(anonymousAccessEnabled)
     const [isLoading, setIsLoading] = useState(false)
     const { toast } = useToast()
@@ -27,7 +24,7 @@ export function AnonymousAccessEnabledSettingsCard({ anonymousAccessAvailable, a
             if (isServiceError(result)) {
                 toast({
                     title: "Error",
-                    description: result.message || "Failed to update anonymous access setting",
+                    description: result.message,
                     variant: "destructive",
                 })
                 return
@@ -45,43 +42,16 @@ export function AnonymousAccessEnabledSettingsCard({ anonymousAccessAvailable, a
             setIsLoading(false)
         }
     }
-    const isDisabled = isLoading || !anonymousAccessAvailable || isControlledByEnvVar;
-    const showPlanMessage = !anonymousAccessAvailable;
-    const showForceEnableMessage = !showPlanMessage && isControlledByEnvVar;
 
     return (
         <BasicSettingsCard
             name="Enable anonymous access"
             description="When enabled, users can access your deployment without logging in."
-            className={cn((!anonymousAccessAvailable || isControlledByEnvVar) && "opacity-60")}
-            footer={
-                <>
-                    {showPlanMessage && (
-                        <SettingNotice>
-                            Your current plan doesn&apos;t allow for anonymous access. Please{" "}
-                            <a
-                                href="https://www.sourcebot.dev/contact"
-                                target="_blank"
-                                rel="noopener"
-                                className="font-medium text-primary hover:text-primary/80 underline underline-offset-2 transition-colors"
-                            >
-                                reach out
-                            </a>
-                            {" "}for assistance.
-                        </SettingNotice>
-                    )}
-                    {showForceEnableMessage && (
-                        <SettingNotice>
-                            <code className="bg-secondary px-1 py-0.5 rounded text-xs font-mono">FORCE_ENABLE_ANONYMOUS_ACCESS</code> is set, so this cannot be changed from the UI.
-                        </SettingNotice>
-                    )}
-                </>
-            }
         >
             <Switch
                 checked={enabled}
                 onCheckedChange={handleToggle}
-                disabled={isDisabled}
+                disabled={isLoading}
             />
         </BasicSettingsCard>
     )

packages/web/src/app/(app)/settings/security/components/credentialsLoginEnabledSettingsCard.tsx

@@ -3,21 +3,16 @@
 import { useState } from "react"
 import { Switch } from "@/components/ui/switch"
 import { setCredentialsLoginEnabled } from "@/app/(app)/settings/security/actions"
-import { cn, isServiceError } from "@/lib/utils"
+import { isServiceError } from "@/lib/utils"
 import { useToast } from "@/components/hooks/use-toast"
 import { BasicSettingsCard } from "@/app/(app)/settings/components/settingsCard"
-import { SettingNotice } from "./settingNotice"
 
 interface CredentialsLoginEnabledSettingsCardProps {
     isCredentialsLoginEnabled: boolean
-    isControlledByEnvVar: boolean
-    hasAlternativeLoginMethod: boolean
 }
 
 export function CredentialsLoginEnabledSettingsCard({
     isCredentialsLoginEnabled,
-    isControlledByEnvVar,
-    hasAlternativeLoginMethod
 }: CredentialsLoginEnabledSettingsCardProps) {
     const [enabled, setEnabled] = useState(isCredentialsLoginEnabled)
     const [isLoading, setIsLoading] = useState(false)
@@ -31,7 +26,7 @@ export function CredentialsLoginEnabledSettingsCard({
             if (isServiceError(result)) {
                 toast({
                     title: "Error",
-                    description: result.message ?? "Failed to update email login setting",
+                    description: result.message,
                     variant: "destructive",
                 })
                 return
@@ -50,35 +45,15 @@ export function CredentialsLoginEnabledSettingsCard({
         }
     }
 
-    // The toggle can't be turned off when there's no other way to sign in, but it
-    // should still be possible to turn it back on in that situation.
-    const lockedOnForLoginMethod = enabled && !hasAlternativeLoginMethod;
-    const isDisabled = isLoading || isControlledByEnvVar || lockedOnForLoginMethod;
-
     return (
         <BasicSettingsCard
             name="Email & password login"
             description="When enabled, users can sign in with an email and password."
-            className={cn((isControlledByEnvVar || lockedOnForLoginMethod) && "opacity-60")}
-            footer={
-                <>
-                    {isControlledByEnvVar && (
-                        <SettingNotice>
-                            This setting is controlled by the <code className="bg-secondary px-1 py-0.5 rounded text-xs font-mono">AUTH_CREDENTIALS_LOGIN_ENABLED</code> environment variable.
-                        </SettingNotice>
-                    )}
-                    {!isControlledByEnvVar && lockedOnForLoginMethod && (
-                        <SettingNotice>
-                            Email login can&apos;t be disabled because no other login method is configured. Configure an identity provider (SSO) or magic-code email login first.
-                        </SettingNotice>
-                    )}
-                </>
-            }
         >
             <Switch
                 checked={enabled}
                 onCheckedChange={handleToggle}
-                disabled={isDisabled}
+                disabled={isLoading}
             />
         </BasicSettingsCard>
     )

packages/web/src/app/(app)/settings/security/components/memberApprovalRequiredSettingsCard.tsx

@@ -3,19 +3,16 @@
 import { useState } from "react"
 import { Switch } from "@/components/ui/switch"
 import { setMemberApprovalRequired } from "@/app/(app)/settings/security/actions"
-import { cn, isServiceError } from "@/lib/utils"
+import { isServiceError } from "@/lib/utils"
 import { useToast } from "@/components/hooks/use-toast"
 import { BasicSettingsCard } from "@/app/(app)/settings/components/settingsCard"
-import { SettingNotice } from "./settingNotice"
 
 interface MemberApprovalRequiredSettingsCardProps {
     memberApprovalRequired: boolean
-    isControlledByEnvVar: boolean
 }
 
 export const MemberApprovalRequiredSettingsCard = ({
     memberApprovalRequired,
-    isControlledByEnvVar
 }: MemberApprovalRequiredSettingsCardProps) => {
     const [enabled, setEnabled] = useState(memberApprovalRequired)
     const [isLoading, setIsLoading] = useState(false)
@@ -29,7 +26,7 @@ export const MemberApprovalRequiredSettingsCard = ({
             if (isServiceError(result)) {
                 toast({
                     title: "Error",
-                    description: "Failed to update member approval setting",
+                    description: result.message,
                     variant: "destructive",
                 })
                 return
@@ -48,23 +45,15 @@ export const MemberApprovalRequiredSettingsCard = ({
         }
     }
 
-    const isDisabled = isLoading || isControlledByEnvVar;
-
     return (
         <BasicSettingsCard
             name="Require approval for new members"
             description="When enabled, new users will need approval from an organization owner before they can access your deployment."
-            className={cn(isControlledByEnvVar && "opacity-60")}
-            footer={isControlledByEnvVar && (
-                <SettingNotice>
-                    This setting is controlled by the <code className="bg-secondary px-1 py-0.5 rounded text-xs font-mono">REQUIRE_APPROVAL_NEW_MEMBERS</code> environment variable.
-                </SettingNotice>
-            )}
         >
             <Switch
                 checked={enabled}
                 onCheckedChange={handleToggle}
-                disabled={isDisabled}
+                disabled={isLoading}
             />
         </BasicSettingsCard>
     )

packages/web/src/app/(app)/settings/security/components/settingNotice.tsx

@@ -2,8 +2,7 @@ import { AnonymousAccessEnabledSettingsCard } from "./components/anonymousAccess
 import { InviteLinkEnabledSettingsCard } from "./components/inviteLinkEnabledSettingsCard";
 import { MemberApprovalRequiredSettingsCard } from "./components/memberApprovalRequiredSettingsCard";
 import { CredentialsLoginEnabledSettingsCard } from "./components/credentialsLoginEnabledSettingsCard";
-import { getProviders } from "@/auth";
-import { isAnonymousAccessAvailable, isAnonymousAccessEnabled } from "@/lib/entitlements";
+import { isAnonymousAccessEnabled } from "@/lib/entitlements";
 import { createInviteLink } from "@/lib/utils";
 import { authenticatedPage } from "@/middleware/authenticatedPage";
 import { OrgRole } from "@sourcebot/db";
@@ -12,9 +11,7 @@ import { SettingsCardGroup } from "../components/settingsCard";
 
 export default authenticatedPage(async ({ org }) => {
     const anonymousAccessEnabled = await isAnonymousAccessEnabled();
-    const anonymousAccessAvailable = await isAnonymousAccessAvailable();
     const inviteLink = createInviteLink(env.AUTH_URL, org.inviteLinkId);
-    const providers = await getProviders();
 
     return (
         <div className="flex flex-col gap-6">
@@ -41,12 +38,9 @@ export default authenticatedPage(async ({ org }) => {
                     />
                     <MemberApprovalRequiredSettingsCard
                         memberApprovalRequired={isMemberApprovalRequired(org)}
-                        isControlledByEnvVar={env.REQUIRE_APPROVAL_NEW_MEMBERS !== undefined}
                     />
                     <AnonymousAccessEnabledSettingsCard
-                        anonymousAccessAvailable={anonymousAccessAvailable}
                         anonymousAccessEnabled={anonymousAccessEnabled}
-                        isControlledByEnvVar={env.FORCE_ENABLE_ANONYMOUS_ACCESS !== undefined}
                     />
                 </SettingsCardGroup>
 
@@ -55,8 +49,6 @@ export default authenticatedPage(async ({ org }) => {
                 <SettingsCardGroup>
                     <CredentialsLoginEnabledSettingsCard
                         isCredentialsLoginEnabled={isCredentialsLoginEnabled(org)}
-                        isControlledByEnvVar={env.AUTH_CREDENTIALS_LOGIN_ENABLED !== undefined}
-                        hasAlternativeLoginMethod={providers.some((provider) => provider.type !== "credentials")}
                     />
                 </SettingsCardGroup>
             </div>

packages/web/src/app/(app)/settings/security/page.tsx

@@ -40,4 +40,6 @@ export enum ErrorCode {
     LIGHTHOUSE_UNREACHABLE = 'LIGHTHOUSE_UNREACHABLE',
     EMAIL_LOGIN_CONTROLLED_BY_ENV = 'EMAIL_LOGIN_CONTROLLED_BY_ENV',
     EMAIL_LOGIN_CANNOT_BE_DISABLED = 'EMAIL_LOGIN_CANNOT_BE_DISABLED',
+    MEMBER_APPROVAL_CONTROLLED_BY_ENV = 'MEMBER_APPROVAL_CONTROLLED_BY_ENV',
+    ANONYMOUS_ACCESS_CONTROLLED_BY_ENV = 'ANONYMOUS_ACCESS_CONTROLLED_BY_ENV',
 }