Skip to content

connections: mobile tune-up + unified Add menu, support chat in account menu #1794

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
karinakharchenko wants to merge 5 commits into
base: main
Choose a base branch
from
Open

connections: mobile tune-up + unified Add menu, support chat in account menu #1794

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
c8b35d7
feat(connections): compact mobile layout for headings, hosted, and DB…
karinakharchenko May 20, 2026
6e540e1
fix(connections): scope desktop layout changes to mobile only
karinakharchenko May 20, 2026
3ab5af2
chore(demo-connections): tablet-friendly demo grid layout
karinakharchenko May 20, 2026
60cb632
feat(connections, intercom): unified Add menu + support chat in accou…
karinakharchenko May 20, 2026
0fd0a0a
chore(connections): remove "Create hosted PostgreSQL" from Add menu
karinakharchenko May 21, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,12 @@
# dependencies
/node_modules

# yarn berry cache (not tracked at repo root)
/.yarn/cache
/.yarn/install-state.gz
/.yarn/unplugged
/.yarn/build-state.yml

# profiling files
chrome-profiler-events*.json
speed-measure-plugin*.json
Expand Down
5 changes: 5 additions & 0 deletions frontend/src/app/app.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -195,6 +195,11 @@
</mat-icon>
<span>Zapier</span>
</a>
<button type="button" mat-menu-item (click)="openSupportChat()"
data-testid="support-chat-button-account-menu">
<mat-icon fontSet="material-symbols-outlined">chat_bubble</mat-icon>
<span>Chat with support</span>
</button>
<a mat-menu-item href="https://docs.rocketadmin.com/" target="_blank">
<mat-icon fontSet="material-symbols-outlined">help</mat-icon>
<span>Help center</span>
Expand Down
7 changes: 7 additions & 0 deletions frontend/src/app/app.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -302,6 +302,7 @@ export class AppComponent {
user_hash: res.intercom_hash,
user_id: res.id,
email: res.email,
hide_default_launcher: true,
});

if (this.isDemo)
Expand Down Expand Up @@ -343,6 +344,12 @@ export class AppComponent {
this.isFeatureNotificationShown = false;
}

openSupportChat() {
if (typeof window.Intercom !== 'undefined') {
window.Intercom('show');
}
}
Comment on lines +347 to +351
Copy link
Copy Markdown

@coderabbitai coderabbitai Bot May 20, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟠 Major | ⚡ Quick win

🧩 Analysis chain

🏁 Script executed:

# First, verify the file exists and read the method in question
if [ -f "frontend/src/app/app.component.ts" ]; then
  echo "File exists. Reading lines 345-355:"
  sed -n '345,355p' "frontend/src/app/app.component.ts" | cat -n
else
  echo "File not found at expected path"
  # Search for the file
  find . -name "app.component.ts" -type f 2>/dev/null | head -5
fi

Repository: rocket-admin/rocketadmin

Length of output: 384

🏁 Script executed:

# Search for other uses of Intercom in the codebase to understand the pattern
rg "Intercom" --type ts --type tsx -B 2 -A 2

Repository: rocket-admin/rocketadmin

Length of output: 96

🏁 Script executed:

# Check the full method to understand context better
sed -n '340,360p' "frontend/src/app/app.component.ts" | cat -n

Repository: rocket-admin/rocketadmin

Length of output: 718

🏁 Script executed:

# Check if there are other methods in the same class to understand pattern consistency
rg "^\s*[a-zA-Z_].*\(\)" "frontend/src/app/app.component.ts" -A 1 | head -20

Repository: rocket-admin/rocketadmin

Length of output: 667

🏁 Script executed:

# Check method signatures in the app.component.ts file to understand the pattern
rg "^\s*(private|protected|public)?\s*[a-zA-Z_][a-zA-Z0-9_]*\s*\(" "frontend/src/app/app.component.ts" -A 0 | head -30

Repository: rocket-admin/rocketadmin

Length of output: 930

Add explicit return type and error handling to openSupportChat()

The method lacks an explicit return type annotation and the external window.Intercom('show') call is not wrapped in error handling. The Intercom widget may not be fully initialized, causing the call to fail silently.

Proposed fix 
-openSupportChat() {
-	if (typeof window.Intercom !== 'undefined') {
-		window.Intercom('show');
-	}
-}
+openSupportChat(): void {
+	try {
+		if (typeof window.Intercom !== 'undefined') {
+			window.Intercom('show');
+		}
+	} catch (error) {
+		console.error('Failed to open Intercom chat', error);
+	}
+}

Per coding guidelines: "Always add type annotations to function parameters and return types in TypeScript" and "Ensure all error handling is explicit - use try/catch blocks appropriately".

🤖 Prompt for AI Agents 
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@frontend/src/app/app.component.ts` around lines 347 - 351, The
openSupportChat function should declare an explicit return type (void) and wrap
the external call to window.Intercom('show') in a try/catch to surface
initialization errors; update the openSupportChat method to check for window and
window.Intercom, call Intercom inside a try block and handle/log any thrown
error in the catch (e.g., via console.error or the app logger) so failures don't
fail silently while preserving the original behavior.


setUserLoggedIn(state) {
this.userLoggedIn = state;
this.changeDetector.detectChanges();
Expand Down
7 changes: 7 additions & 0 deletions frontend/src/app/components/connections-list/connections-list.component.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,6 +56,13 @@
margin-bottom: 0;
}

@media (width <= 600px) {
.pageTitleHeader .pageTitle__name {
font-size: 20px !important;
line-height: 1.2 !important;
}
}

.companyEditLink {
position: absolute;
top: 50%;
Expand Down
24 changes: 23 additions & 1 deletion frontend/src/app/components/connections-list/demo-connections/demo-connections.component.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,14 @@
width: 100%;
}

@media (width <= 600px) {
:host h1.mat-display-1 {
font-size: 22px !important;
line-height: 1.2 !important;
margin-bottom: 20px;
}
}

.section__label {
display: block;
font-size: 11px;
Expand All @@ -17,11 +25,18 @@
.demoGrid {
list-style: none;
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 12px;
width: 100%;
padding: 0;
margin: 0;
align-items: stretch;
}

@media (601px <= width <= 1024px) {
.demoGrid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}

@media (width <= 600px) {
Expand All @@ -36,6 +51,7 @@
gap: 12px;
border-radius: 8px;
padding: 12px 16px;
height: 100%;
text-decoration: none;
color: inherit;
transition: box-shadow 200ms, background 200ms, border 200ms;
Expand Down Expand Up @@ -102,6 +118,12 @@
min-width: 0;
}

.demoCard__info strong {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
Comment on lines +121 to +125
Copy link
Copy Markdown

@coderabbitai coderabbitai Bot May 20, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor | ⚡ Quick win

text-overflow: ellipsis may not apply on inline strong

Line 121-125 likely won’t consistently truncate because strong is inline by default. Make it block-level so the ellipsis behavior is reliable.

Suggested fix 
 .demoCard__info strong {
+	display: block;
 	overflow: hidden;
 	text-overflow: ellipsis;
 	white-space: nowrap;
 }
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
.demoCard__info strong {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.demoCard__info strong {
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
🤖 Prompt for AI Agents 
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In
`@frontend/src/app/components/connections-list/demo-connections/demo-connections.component.css`
around lines 121 - 125, The CSS rule targeting ".demoCard__info strong" uses
text-overflow: ellipsis but strong is inline by default so truncation won't work
reliably; change the display of the selector (e.g., set display: inline-block or
block) and ensure a width or max-width is applied to the ".demoCard__info
strong" rule so text-overflow can take effect, keeping the existing overflow and
white-space properties intact.


.demoCard__type {
font-size: 12px;
margin-top: -2px;
Expand Down
Loading
Loading