Add banner and label outdated apps.

wso2 · Sep 26, 2024 · ac9b483 · ac9b483
1 parent a57d077
commit ac9b483
Show file tree

Hide file tree

Showing 5 changed files with 386 additions and 3 deletions.
diff --git a/features/admin.applications.v1/components/application-list.tsx b/features/admin.applications.v1/components/application-list.tsx
@@ -426,6 +426,23 @@ export const ApplicationList: FunctionComponent<ApplicationListPropsInterface> =
                                             ) }
                                         </div>
                                     </Grid>
+                                    <Grid alignItems="flex-end">
+                                        <div>
+                                            { ApplicationManagementUtils.getIfAppIsOutdated(app.applicationVersion) && (
+                                                <Label
+                                                    className="no-margin-left application-outdated-label"
+                                                    size="mini"
+                                                >
+                                                    <Trans
+                                                        i18nKey={
+                                                            t("applications:forms.inboundOIDC.sections"
+                                                                + ".outdatedApplications.label")
+                                                        }
+                                                    />
+                                                </Label>
+                                            ) }
+                                        </div>
+                                    </Grid>
                                     {
                                         ApplicationManagementUtils.isChoreoApplication(app)
                                             && (<Grid>

diff --git a/features/admin.applications.v1/pages/application-edit.scss b/features/admin.applications.v1/pages/application-edit.scss
@@ -19,3 +19,37 @@
 .application-branding-link {
     cursor: pointer;
 }
+
+.ignore-once-button {
+    color: #788997;
+}
+
+.banner-detail-card {
+    border: 0;
+    border-top-left-radius: 0;
+    border-top-right-radius: 0;
+    background: #fffaf3;
+    padding: 5px;
+    padding-left: 35px;
+}
+
+.banner-detail-content {
+    padding: 0;
+}
+
+.banner-grid {
+    padding-left: 30px;
+}
+
+.application-outdated-alert-expanded-view {
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+}
+
+.spaced-list li {
+    margin-bottom: 10px;
+}
+
+.banner-wrapper {
+    margin-bottom: 20px;
+}