feat: added functionality behind a feature flag to configure logo dimensions in Branding component

[tomjose92]

Description

Added functionality behind a feature flag to configure logo icon width and height in Branding component
The changes for this will be reflected in the NavigationLogo in the ee repo. On the CE repo it will just be shown as input fields in the Branding page, but a user will not be able to configure this until them move to EE editon.

Fixes 41448

Automation

/ok-to-test tags="@tag.All"

🔍 Cypress test results

Tip

🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉
Workflow run: https://github.com/appsmithorg/appsmith/actions/runs/20018874227
Commit: 2f64d0b
Cypress dashboard.
Tags: @tag.All
Spec:

---

Mon, 08 Dec 2025 07:35:49 UTC

Communication

Should the DevRel and Marketing teams inform users about this change?

• Yes
• No

Summary by CodeRabbit

• New Features
  • Branding settings now include controls to customize logo width and height
  • Default dimensions (160px width, 24px height) automatically apply when input fields are cleared
  • Logo dimension changes are tracked for analytics purposes

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai]

Walkthrough

These changes implement a feature-flagged logo resize capability in the branding settings. A new feature flag is introduced, the form interface is extended with width and height properties, and UI controls are added with validation, defaults, and analytics integration.

Changes

Cohort / File(s)	Summary
Feature Flag Definition app/client/src/ce/entities/FeatureFlag.ts	Added release_branding_logo_resize_enabled flag with default value false to enable conditional rendering of logo dimension controls.
Form Interface app/client/src/pages/AdminSettings/Branding/BrandingPage.tsx	Extended Inputs interface with optional logoWidth and logoHeight properties; propagated these values through form state and reset logic in useEffect.
UI Implementation app/client/src/pages/AdminSettings/Branding/SettingsForm.tsx	Added feature-flag gated "Logo Dimensions" section with NumberInput controls for width/height, onChange handlers with parsing and validation, default value fallbacks (160 for width, 24 for height), and analytics event tracking.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

• Verify feature flag naming consistency and default value alignment across files
• Confirm default width (160) and height (24) fallbacks are intentional and reasonable
• Validate analytics event logging is correctly triggered on dimension changes
• Check that form state propagation in useEffect properly handles organizationConfig updates

Poem

📏 A logo takes shape with grace,
Width and height find their place,
Behind a flag so carefully gated,
Resizing dreams, finally stated! ✨

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	You can run @coderabbitai generate docstrings to improve docstring coverage.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly describes the main change: adding feature-flag-gated functionality to configure logo dimensions in the Branding component.
Description check	✅ Passed	PR description includes issue reference, automation tags, cypress test results, and communication checkbox, following the template structure with comprehensive context.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch feat/issue-41448/branding-logo-dimensions

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[tomjose92]

/build-deploy-preview skip-tests=true

[github-actions]

Deploying Your Preview: https://github.com/appsmithorg/appsmith/actions/runs/19958681264.
Workflow: On demand build Docker image and deploy preview.
skip-tests: true.
env: ``.
PR: 41449.
recreate: .

[github-actions]

Deploy-Preview-URL: https://ce-41449.dp.appsmith.com

[ankitakinger]

/build-deploy-preview skip-tests=true

[github-actions]

Deploying Your Preview: https://github.com/appsmithorg/appsmith/actions/runs/19962396493.
Workflow: On demand build Docker image and deploy preview.
skip-tests: true.
env: ``.
PR: 41449.
recreate: .

[github-actions]

Deploy-Preview-URL: https://ce-41449.dp.appsmith.com

[tomjose92]

/build-deploy-preview skip-tests=true

[github-actions]

Deploying Your Preview: https://github.com/appsmithorg/appsmith/actions/runs/19971508735.
Workflow: On demand build Docker image and deploy preview.
skip-tests: true.
env: ``.
PR: 41449.
recreate: .

[github-actions]

Deploy-Preview-URL: https://ce-41449.dp.appsmith.com

[coderabbitai]

Actionable comments posted: 0

🧹 Nitpick comments (1)

app/client/src/pages/AdminSettings/Branding/SettingsForm.tsx (1)

108-180: Logo dimensions block works; consider tightening NumberInput handling and text

The section wiring and analytics look fine, but a few small improvements would make it more robust:

• In the onChange handlers, val ? parseInt(val, 10) : 160/24 treats falsy values (e.g. "0") as “reset to default”. If 0 (or similar) should be rejected rather than silently coerced, prefer an explicit empty‑string / isNaN check instead of generic truthiness.
• To prevent negative or nonsensical dimensions, consider setting a min on NumberInput (e.g. min={1}) so only positive pixel values are allowed.
• The helper text is hard‑coded; for consistency with other admin settings, you may want to move it into ee/constants/messages and use createMessage(...).

None of these are blockers, but they’ll make the UX and validation behavior more predictable.

📜 Review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 7046aeb and 2f64d0b.

📒 Files selected for processing (3)

• app/client/src/ce/entities/FeatureFlag.ts (2 hunks)
• app/client/src/pages/AdminSettings/Branding/BrandingPage.tsx (3 hunks)
• app/client/src/pages/AdminSettings/Branding/SettingsForm.tsx (4 hunks)

🧰 Additional context used

🧠 Learnings (4)

📓 Common learnings

Learnt from: ankitakinger
Repo: appsmithorg/appsmith PR: 37330
File: app/client/src/pages/common/SearchBar/HomepageHeaderAction.tsx:95-95
Timestamp: 2024-11-12T11:42:28.998Z
Learning: In icon provider components within the TypeScript/React codebase, old settings icons like `"settings-2-line"` and `"settings-control"` are intentionally provided alongside new icons. These references are acceptable and should not be flagged for updates.

📚 Learning: 2024-11-12T11:42:28.998Z

Learnt from: ankitakinger
Repo: appsmithorg/appsmith PR: 37330
File: app/client/src/pages/common/SearchBar/HomepageHeaderAction.tsx:95-95
Timestamp: 2024-11-12T11:42:28.998Z
Learning: In icon provider components within the TypeScript/React codebase, old settings icons like `"settings-2-line"` and `"settings-control"` are intentionally provided alongside new icons. These references are acceptable and should not be flagged for updates.

Applied to files:

• app/client/src/pages/AdminSettings/Branding/SettingsForm.tsx
• app/client/src/pages/AdminSettings/Branding/BrandingPage.tsx

📚 Learning: 2024-11-12T07:37:42.598Z

Learnt from: ankitakinger
Repo: appsmithorg/appsmith PR: 37330
File: app/client/src/pages/Editor/gitSync/components/GitChangesList/StaticChange.tsx:52-52
Timestamp: 2024-11-12T07:37:42.598Z
Learning: The icon provider components in `app/client/packages/design-system/widgets-old/src/Icon/index.tsx` and `app/client/packages/design-system/ads/src/Icon/Icon.provider.tsx` should provide both `settings-2-line` and `settings-v3` icons and should not be updated to remove the old icon.

Applied to files:

• app/client/src/pages/AdminSettings/Branding/SettingsForm.tsx

📚 Learning: 2024-12-15T17:45:48.303Z

Learnt from: brayn003
Repo: appsmithorg/appsmith PR: 38171
File: app/client/src/git/components/DefaultBranch/DefaultBranchCE.tsx:1-14
Timestamp: 2024-12-15T17:45:48.303Z
Learning: In `app/client/src/git/components/DefaultBranch/DefaultBranchCE.tsx`, the feature flag check is performed at a higher level, so it's acceptable to have `isGitProtectedFeatureLicensed={false}` in this component.

Applied to files:

• app/client/src/ce/entities/FeatureFlag.ts

🧬 Code graph analysis (1)

app/client/src/pages/AdminSettings/Branding/SettingsForm.tsx (1)

app/client/src/pages/AdminSettings/components.tsx (1)

• HelperText (63-66)

🔇 Additional comments (4)

app/client/src/pages/AdminSettings/Branding/BrandingPage.tsx (2)

21-27: Extend Inputs with optional logo dimensions (LGTM)

Optional logoWidth/logoHeight align with the new form fields and keep the type backward‑compatible; no issues here.

---

37-43: Form defaults and reset wiring for logo dimensions look correct

Sourcing logoWidth/logoHeight from organizationConfig in both defaultValues and the reset effect keeps the form state in sync with backend config, consistent with existing branding fields.

Also applies to: 62-69

app/client/src/ce/entities/FeatureFlag.ts (1)

69-70: New release_branding_logo_resize_enabled flag is defined consistently

The flag key and its default value are added in the right places and follow existing naming conventions; no further changes needed.

Also applies to: 124-125

app/client/src/pages/AdminSettings/Branding/SettingsForm.tsx (1)

11-11: Feature‑flagged enablement for logo dimensions looks good

Using useFeatureFlag(FEATURE_FLAG.release_branding_logo_resize_enabled) cleanly gates the new section and aligns with how other flags are wired in this codebase.

Also applies to: 32-33, 65-67

[ankitakinger]

/build-deploy-preview skip-tests=true

[github-actions]

Deploying Your Preview: https://github.com/appsmithorg/appsmith/actions/runs/20018482622.
Workflow: On demand build Docker image and deploy preview.
skip-tests: true.
env: ``.
PR: 41449.
recreate: .

[github-actions]

Deploy-Preview-URL: https://ce-41449.dp.appsmith.com