fix(branding): refresh Google branding - #6786
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
PR SummaryLow Risk Overview
Auth surfaces use "Continue with Google" and a 20px logo on social login chips, the landing auth modal, and related flows; the Google chip switches from Google Vault OAuth now uses Tests pin the embedded PNG (dimensions, SHA-256), assert no fragile SVG paint stack, cover social button CTA/loading behavior, and OAuth provider branding for Vault. Reviewed by Cursor Bugbot for commit 705ecd7. Bugbot is set up for automated code reviews on this repo. Configure here. |
Greptile SummaryThis PR refreshes the shared Google branding artwork, assigns the dedicated Vault product icon to Google Vault OAuth, and aligns Google authentication CTA wording and sizing.
Confidence Score: 4/5The PR appears safe to merge, with a non-blocking gap in browser-level visual coverage for the new SVG rendering technique. The authentication and OAuth configuration changes remain consistent with existing behavior, but the new Google artwork relies on browser-rendered foreignObject and CSS effects that are only tested as serialized markup. Files Needing Attention: apps/sim/components/icons.test.tsx, apps/sim/components/icons.tsx
|
| Filename | Overview |
|---|---|
| apps/sim/components/icons.tsx | Replaces the shared Google icon with namespaced mask, filter, and foreignObject-based gradient artwork; browser-rendered output is not covered. |
| apps/docs/components/icons.tsx | Mirrors the updated Google icon implementation for the documentation icon projection. |
| apps/sim/components/icons.test.tsx | Verifies serialized artwork structure and unique SVG references, but does not validate visual rendering in a browser. |
| apps/sim/app/(auth)/components/social-login-buttons.tsx | Updates the Google CTA text and uses an explicitly sized left adornment while preserving sign-in behavior. |
| apps/sim/app/(landing)/components/auth-modal/auth-modal.tsx | Increases the Google logo from 18px to the intended 20px size. |
| apps/sim/lib/oauth/oauth.ts | Correctly assigns the existing GoogleVaultIcon to the Vault service while retaining Google family branding. |
Reviews (1): Last reviewed commit: "fix(branding): refresh Google logo" | Re-trigger Greptile
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
| const markup = renderToStaticMarkup( | ||
| <GoogleIcon className='google-icon' data-testid='google-icon' aria-label='Google' /> | ||
| ) | ||
|
|
||
| expect(markup).toContain('viewBox="10 10 20 20"') | ||
| expect(markup).toContain('width="24"') | ||
| expect(markup).toContain('height="24"') | ||
| expect(markup).toContain('class="google-icon"') | ||
| expect(markup).toContain('data-testid="google-icon"') | ||
| expect(markup).toContain('aria-label="Google"') | ||
| expect(markup).toContain('conic-gradient(from 90deg') | ||
| expect(markup.match(/<filter\b/g)).toHaveLength(7) | ||
| expect(markup.match(/<ellipse\b/g)).toHaveLength(6) | ||
| expect(markup).not.toContain('data-figma') | ||
| }) | ||
|
|
||
| it('namespaces every definition and resolves every URL reference', () => { |
There was a problem hiding this comment.
This Node-based test only inspects serialized markup, so it does not exercise the new foreignObject, CSS conic gradient, mask, and filter combination in a browser. A browser-level visual assertion would prevent blank or partial Google artwork from passing this regression suite.
Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!
There was a problem hiding this comment.
Addressed in 705ecd7. GoogleIcon no longer relies on browser-painted foreignObject, conic-gradient, masks, filters, clip paths, or SVG IDs. It now embeds Google's exact official transparent 200x204 PNG in the existing SVG wrapper. The regression test pins the byte length, dimensions, and SHA-256 and explicitly guards against reintroducing the fragile primitives. No browser session was available, so I am not claiming a Safari screenshot check.
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes using high effort and found 1 potential issue.
❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.
Reviewed by Cursor Bugbot for commit 8328c9b. Configure here.
8328c9b to
7ee278c
Compare
7ee278c to
705ecd7
Compare
|
How it looks now: 
|
1 participant
Summary
foreignObject/CSS gradient/mask/filter stack that could render blank in WebKit.Type of Change
Testing
bun run test: 17/17 Turbo tasks; 29,390 tests passed, 47 skipped, 0 failedbun run lint:check: 24/24 tasks passedbun run type-check: 24/24 tasks passedbun run check:icon-pathsbun run check:bare-iconsbun run docs:checkbunx turbo run build --filter=@sim/app: 1,293/1,293 static pages generatedgit diff --checkReviewer focus:
GoogleIconno longer usesforeignObject, CSS gradients, masks, filters, clip paths, IDs, orurl(#...)references.GoogleIcon(props: SVGProps<SVGSVGElement>)API and all callsites remain intact.Checklist
Screenshots/Videos
Browser screenshots are not attached because no in-app browser session was available during automation. The implementation removes the WebKit-fragile rendering primitives identified in review, pins the exact official raster bytes in tests, and passes the complete production build.