Merge branch 'develop'

Author: pablomendezroyo

packages/admin-ui/src/App.tsx

@@ -18,6 +18,7 @@ import { NoConnection } from "start-pages/NoConnection";
 import { AppContextIface, Theme } from "types";
 import Smooth from "components/Smooth";
 import { PwaPermissionsAlert, PwaPermissionsModal } from "components/PwaPermissions";
+import { LocalProxyBanner } from "pages/wifi/components/localProxying/LocalProxyBanner";
 
 export const AppContext = React.createContext<AppContextIface>({
   theme: "light",
@@ -89,6 +90,7 @@ function MainApp({ username }: { username: string }) {
         <TopBar username={username} appContext={appContext} />
         <div id="main">
           <ErrorBoundary>
+            <LocalProxyBanner />
             <NotificationsMain />
           </ErrorBoundary>
           <PwaPermissionsAlert />

packages/admin-ui/src/pages/notifications/tabs/Devices/DevicesSubs.tsx

@@ -11,8 +11,8 @@ import { usePwaSubtabUrl } from "hooks/PWA/usePwaSubtabUrl";
 import Loading from "components/Loading";
 import newTabProps from "utils/newTabProps";
 import { docsUrl } from "params";
-import "./devicesSubs.scss";
 import SubTitle from "components/SubTitle";
+import "./devicesSubs.scss";
 
 export function DevicesSubs() {
   const {
@@ -97,7 +97,7 @@ export function DevicesSubs() {
         <SubTitle>Subscribed Devices</SubTitle>
 
         {subscriptionsList && subscriptionsList.length > 0 ? (
-          <>
+          <div className="subscriptions-list">
             {subscriptionsList.map((sub, index) => (
               <SubscriptionCard
                 key={index}
@@ -107,7 +107,7 @@ export function DevicesSubs() {
                 revalidateSubs={revalidateSubs}
               />
             ))}
-          </>
+          </div>
         ) : (
           <Card>No subscriptions found</Card>
         )}

packages/admin-ui/src/pages/notifications/tabs/Devices/devicesSubs.scss

@@ -15,50 +15,55 @@
       padding: 10px;
     }
   }
-
-  .subscription-card {
+  .subscriptions-list {
     display: flex;
-    flex-direction: row;
-    justify-content: space-between;
-    align-items: center;
+    flex-direction: column;
+    gap: 10px;
 
-    @media (max-width: 40rem) {
-      flex-direction: column;
-      gap: 10px;
-      align-items: flex-end;
-    }
+    .subscription-card {
+      display: flex;
+      flex-direction: row;
+      justify-content: space-between;
+      align-items: center;
 
-    .alias-info {
-      font-size: 1.2rem;
-      input {
-        width: 30ch;
-        margin-right: 5px;
-        border-radius: 5px;
-      }
       @media (max-width: 40rem) {
-        width: 100%;
+        flex-direction: column;
+        gap: 10px;
+        align-items: flex-end;
+      }
+
+      .alias-info {
+        font-size: 1.2rem;
         input {
+          width: 30ch;
+          margin-right: 5px;
+          border-radius: 5px;
+        }
+        @media (max-width: 40rem) {
           width: 100%;
+          input {
+            width: 100%;
+          }
         }
-      }
 
-      .current-tag{
-        margin-left: 5px;
+        .current-tag {
+          margin-left: 5px;
+        }
       }
-    }
 
-    .btns-container {
-      display: flex;
-      flex-direction: row;
-      gap: 10px;
+      .btns-container {
+        display: flex;
+        flex-direction: row;
+        gap: 10px;
 
-      .icon-btns {
-        padding: 0px 10px;
-        font-size: 1.6rem;
-        opacity: 0.5;
-        cursor: pointer;
-        &:hover {
-          opacity: 0.8;
+        .icon-btns {
+          padding: 0px 10px;
+          font-size: 1.6rem;
+          opacity: 0.5;
+          cursor: pointer;
+          &:hover {
+            opacity: 0.8;
+          }
         }
       }
     }

packages/admin-ui/src/pages/notifications/tabs/Settings/settings.scss

@@ -1,4 +1,5 @@
 .notifications-settings {
+  margin-bottom: 10px;
   .title-switch-row {
     display: flex;
     flex-direction: row;

packages/admin-ui/src/pages/wifi/components/localProxying/LocalProxyBanner.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+import { Alert } from "react-bootstrap";
+import { adminUiLocalDomain } from "params";
+
+export function LocalProxyBanner() {
+  return (
+    window.location.origin === adminUiLocalDomain && (
+      <Alert variant="danger">
+        <Alert.Heading>Local Proxy Connection</Alert.Heading>
+        <div>
+          Local proxy is less reliable and only gives access to the Dappmanager UI. It won't load other Dappnode
+          services. Use it <b>only as a fallback</b> method.
+        </div>
+      </Alert>
+    )
+  );
+}

packages/admin-ui/src/pages/wifi/components/localProxying/LocalProxying.tsx

@@ -75,15 +75,14 @@ export function LocalProxying() {
     <>
       {localProxyingStatus.data ? (
         <>
-          {window.location.origin !== adminUiLocalDomain && (
-            <AlertDismissible variant="warning">
-              <p>
-                Note that connecting via local proxy is less reliable than using a VPN or Wi-fi hotspot. The local proxy
-                only provides access to the Dappmanager UI and does not grant access to other domains served through
-                your Dappnode, such as client interfaces or other package UIs.
-              </p>
-            </AlertDismissible>
-          )}
+          <AlertDismissible variant="warning">
+            <p>
+              Note that connecting via local proxy is less reliable than using a VPN or Wi-fi hotspot, and should be
+              used <b>only as a fallback</b> method. It only provides access to the Dappmanager UI and does not grant
+              access to other domains served through your Dappnode, such as client interfaces or other package UIs.
+            </p>
+          </AlertDismissible>
+
           <Card spacing>
             <p>
               If you are connected to the same router as your Dappnode you can use this page at{" "}

packages/utils/src/getIsCore.ts

@@ -15,5 +15,7 @@ const coreDnpNames = [
   params.wifiDnpName,
   params.bindDnpName,
   params.ipfsDnpName,
-  params.HTTPS_PORTAL_DNPNAME
+  params.HTTPS_PORTAL_DNPNAME,
+  params.notificationsDnpName,
+  params.PREMIUM_DNP_NAME
 ];