Merge pull request #7773 from logto-io/charles-log-12173-remove-dev-feature-guard

chore(console): remove dev feature guard for org-level branding

Author: charIeszhao

packages/console/src/pages/ApplicationDetails/components/Branding/NonThirdPartyBrandingForm.tsx

@@ -6,7 +6,6 @@ import { useTranslation } from 'react-i18next';
 
 import CustomCssEditorField from '@/components/CustomCssEditorField';
 import LogoAndFavicon from '@/components/ImageInputs/LogoAndFavicon';
-import { isDevFeaturesEnabled } from '@/consts/env';
 import Button from '@/ds-components/Button';
 import ColorPicker from '@/ds-components/ColorPicker';
 import FormField from '@/ds-components/FormField';
@@ -88,7 +87,7 @@ function NonThirdPartyBrandingForm() {
             />
           </div>
         )}
-        {isDevFeaturesEnabled && <CustomCssEditorField />}
+        <CustomCssEditorField />
       </div>
     </>
   );

packages/console/src/pages/OrganizationDetails/Settings/index.tsx

@@ -1,4 +1,4 @@
-import { Theme, type Organization, type SignInExperience } from '@logto/schemas';
+import { type Organization, type SignInExperience } from '@logto/schemas';
 import { Controller, useForm } from 'react-hook-form';
 import { toast } from 'react-hot-toast';
 import { Trans, useTranslation } from 'react-i18next';
@@ -7,10 +7,8 @@ import useSWR from 'swr';
 
 import DetailsForm from '@/components/DetailsForm';
 import FormCard from '@/components/FormCard';
-import ImageInputs, { themeToLogoName } from '@/components/ImageInputs';
 import UnsavedChangesAlertModal from '@/components/UnsavedChangesAlertModal';
-import { organizationLogosForExperienceLink, organizationsFeatureLink } from '@/consts';
-import { isDevFeaturesEnabled } from '@/consts/env';
+import { organizationsFeatureLink } from '@/consts';
 import CodeEditor from '@/ds-components/CodeEditor';
 import FormField from '@/ds-components/FormField';
 import InlineNotification from '@/ds-components/InlineNotification';
@@ -110,32 +108,6 @@ function Settings() {
             {...register('description')}
           />
         </FormField>
-        {!isDevFeaturesEnabled && (
-          <ImageInputs
-            uploadTitle="organization_details.branding.logo"
-            tip={
-              <Trans
-                i18nKey="admin_console.organization_details.branding.logo_tooltip"
-                components={{
-                  a: (
-                    <TextLink
-                      targetBlank="noopener"
-                      href={getDocumentationUrl(organizationLogosForExperienceLink)}
-                    />
-                  ),
-                }}
-              />
-            }
-            control={control}
-            register={register}
-            fields={Object.values(Theme).map((theme) => ({
-              name: `branding.${themeToLogoName[theme]}`,
-              error: errors.branding?.[themeToLogoName[theme]],
-              type: 'organization_logo',
-              theme,
-            }))}
-          />
-        )}
         <FormField
           title="organization_details.custom_data"
           tip={t('organization_details.custom_data_tip')}

packages/console/src/pages/OrganizationDetails/index.tsx

@@ -17,7 +17,6 @@ import DetailsPageHeader from '@/components/DetailsPage/DetailsPageHeader';
 import Drawer from '@/components/Drawer';
 import PageMeta from '@/components/PageMeta';
 import ThemedIcon from '@/components/ThemedIcon';
-import { isDevFeaturesEnabled } from '@/consts/env';
 import DeleteConfirmModal from '@/ds-components/DeleteConfirmModal';
 import TabNav, { TabNavItem } from '@/ds-components/TabNav';
 import useApi, { type RequestError } from '@/hooks/use-api';
@@ -139,11 +138,9 @@ function OrganizationDetails() {
               <TabNavItem href={`${pathname}/${id}/${OrganizationDetailsTabs.MachineToMachine}`}>
                 {t('organizations.machine_to_machine')}
               </TabNavItem>
-              {isDevFeaturesEnabled && (
-                <TabNavItem href={`${pathname}/${id}/${OrganizationDetailsTabs.Branding}`}>
-                  {t('organizations.branding')}
-                </TabNavItem>
-              )}
+              <TabNavItem href={`${pathname}/${id}/${OrganizationDetailsTabs.Branding}`}>
+                {t('organizations.branding')}
+              </TabNavItem>
             </TabNav>
             <Outlet
               context={

packages/console/src/pages/OrganizationDetails/utils.ts

@@ -1,7 +1,6 @@
 import { generateDarkColor } from '@logto/core-kit';
 import { defaultPrimaryColor, type Organization } from '@logto/schemas';
 
-import { isDevFeaturesEnabled } from '@/consts/env';
 import { type Option } from '@/ds-components/Select/MultiSelect';
 import { emptyBranding } from '@/types/sign-in-experience';
 import { removeFalsyValues } from '@/utils/object';
@@ -48,12 +47,9 @@ export const assembleData = ({
   ...data
 }: Partial<FormData>): Partial<Organization> => ({
   ...data,
-  // @charles TODO: Remove the dev features guard later
-  ...(!isDevFeaturesEnabled && { branding: branding && removeFalsyValues(branding) }),
-  ...(isDevFeaturesEnabled &&
-    (isBrandingEnabled
-      ? { color, branding: branding && removeFalsyValues(branding), customCss }
-      : { color: {}, branding: {}, customCss: '' })),
+  ...(isBrandingEnabled
+    ? { color, branding: branding && removeFalsyValues(branding), customCss }
+    : { color: {}, branding: {}, customCss: '' }),
   // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
   customData: JSON.parse(customData ?? '{}'),
 });