Skip to content

App problems ripple #6363

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

Merged
lkostrowski merged 4 commits into from
Feb 24, 2026
+621 −1
Merged

App problems ripple #6363

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
1917914
storybook for ripple
lkostrowski Feb 24, 2026
0cc0d5f
add ripple
lkostrowski Feb 24, 2026
0b8b836
messages
lkostrowski Feb 24, 2026
9094c0a
Merge branch 'main' into app-problems-ripple
lkostrowski Feb 24, 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
5 changes: 5 additions & 0 deletions .changeset/long-fish-land.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"saleor-dashboard": patch
---

Added a hint (Ripple) on the installed extensions page to notify users about the new app problems feature, which shows issues with apps directly in the extensions list.
3 changes: 3 additions & 0 deletions locale/defaultMessages.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -943,6 +943,9 @@
"context": "ProductTypeDeleteWarningDialog with items multiple description",
"string": "You are about to delete multiple product types. Some of them are assigned to products. Deleting those product types will also delete those products"
},
"3eR8iC": {
"string": "Show me"
},
"3evXPj": {
"string": "Leave your note here..."
},
Expand Down
14 changes: 14 additions & 0 deletions src/extensions/ripples/appProblems.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
import { type Ripple } from "@dashboard/ripples/types";

export const rippleAppProblems: Ripple = {
type: "feature",
ID: "app-problems",
TTL_seconds: 60 * 60 * 24 * 2, // 2 days
content: {
oneLiner: "App problems visibility",
contextual: "You can now see issues with apps directly in the extensions list.",
global:
"App problems are now visible in the installed extensions page. When an app has issues, you will see a badge indicating the number of problems and their severity.",
},
dateAdded: new Date(2026, 1),
Copy link

Copilot AI Feb 24, 2026

Choose a reason for hiding this comment

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

The dateAdded field should include a day parameter for consistency and clarity. Most other ripples in the codebase specify the full date with year, month, and day (e.g., new Date(2026, 0, 29) or new Date("2026-01-27")). While new Date(2026, 1) is valid and defaults to the first day of the month, explicitly specifying the day makes the intended date clearer and follows the predominant pattern in the codebase.

Suggested change
dateAdded: new Date(2026, 1),
dateAdded: new Date(2026, 1, 1),

Copilot uses AI. Check for mistakes.
Copy link
Member

@witoszekdev witoszekdev Feb 24, 2026

Choose a reason for hiding this comment

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

looks like date is not correct

Copy link
Member Author

@lkostrowski lkostrowski Feb 24, 2026

Choose a reason for hiding this comment

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

how so?
CleanShot 2026-02-24 at 14 18 34

Copy link
Member

@witoszekdev witoszekdev Feb 24, 2026

Choose a reason for hiding this comment

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

I meant that today is Feb 24th 😄

Copy link
Member

@witoszekdev witoszekdev Feb 24, 2026

Choose a reason for hiding this comment

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

if we take just the month though from this date then it's fine 👌🏻

};
11 changes: 10 additions & 1 deletion src/extensions/views/InstalledExtensions/InstalledExtensions.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import SearchInput from "@dashboard/components/AppLayout/ListFilters/components/
import { DashboardCard } from "@dashboard/components/Card";
import { ListPageLayout } from "@dashboard/components/Layouts";
import { headerTitles, messages } from "@dashboard/extensions/messages";
import { rippleAppProblems } from "@dashboard/extensions/ripples/appProblems";
import {
type ExtensionsListUrlDialog,
type ExtensionsListUrlQueryParams,
Expand All @@ -14,6 +15,7 @@ import { useAppAllProblemsLazyQuery, useAppProblemDismissMutation } from "@dashb
import { useHasManagedAppsPermission } from "@dashboard/hooks/useHasManagedAppsPermission";
import useNavigator from "@dashboard/hooks/useNavigator";
import { useNotifier } from "@dashboard/hooks/useNotifier";
import { Ripple } from "@dashboard/ripples/components/Ripple";
import createDialogActionHandlers from "@dashboard/utils/handlers/dialogActionHandlers";
import { useOnboarding } from "@dashboard/welcomePage/WelcomePageOnboarding/onboardingContext";
import { Box, Text } from "@saleor/macaw-ui-next";
Expand Down Expand Up @@ -126,7 +128,14 @@ export const InstalledExtensions = ({ params }: InstalledExtensionsProps) => {
<Text size={6} fontWeight="regular">
{intl.formatMessage(headerTitles.installedExtensions)}
</Text>
<ProblemsHeaderBadge totalCount={totalCount} criticalCount={criticalCount} />
<Box position="relative">
<ProblemsHeaderBadge totalCount={totalCount} criticalCount={criticalCount} />
{totalCount > 0 && (
<Box position="absolute" __top="-4px" __right="-4px">
<Ripple model={rippleAppProblems} />
</Box>
)}
</Box>
</Box>
</Box>
<Box display="flex" gap={4} alignItems="center">
Expand Down
Loading
Loading