diff --git a/packages/app-client/src/app.css b/packages/app-client/src/app.css index b570a7f1..74a6e6f9 100644 --- a/packages/app-client/src/app.css +++ b/packages/app-client/src/app.css @@ -23,6 +23,9 @@ --destructive: 0 84.2% 60.2%; --destructive-foreground: 0 0% 98%; + --warning: 31 98% 50%; + --warning-foreground: 0 0% 98%; + --border: 0 0% 89.8%; --input: 0 0% 89.8%; --ring: 0 0% 3.9%; @@ -55,6 +58,9 @@ --destructive: 0 62.8% 30.6%; --destructive-foreground: 0 0% 98%; + --warning: 31 98% 50%; + --warning-foreground: 0 0% 98%; + --border: 0 0% 14.9%; --input: 0 0% 14.9%; --ring: 0 0% 83.1%; diff --git a/packages/app-client/src/locales/en.json b/packages/app-client/src/locales/en.json index cab8afee..07a8ac53 100644 --- a/packages/app-client/src/locales/en.json +++ b/packages/app-client/src/locales/en.json @@ -3,6 +3,10 @@ "title": "Enclosed", "description": "Send private and secure notes" }, + "insecureContextWarning": { + "description": "Your connection is not secure, the app must be served over HTTPS to work properly. You won't be able to create or view notes.", + "learn-more": "Learn more" + }, "navbar": { "new-note": "New note", "theme": { diff --git a/packages/app-client/src/locales/es.json b/packages/app-client/src/locales/es.json index 622aac3d..11f5dc00 100644 --- a/packages/app-client/src/locales/es.json +++ b/packages/app-client/src/locales/es.json @@ -3,6 +3,10 @@ "title": "Enclosed", "description": "Enviar notas privadas y seguras" }, + "insecureContextWarning": { + "description": "Su conexión no es segura, la aplicación debe ser servida a través de HTTPS para funcionar correctamente. No podrá crear ni ver notas.", + "learn-more": "Más información" + }, "navbar": { "new-note": "Nueva nota", "theme": { diff --git a/packages/app-client/src/locales/fr.json b/packages/app-client/src/locales/fr.json index 4855f8eb..ca4edad9 100644 --- a/packages/app-client/src/locales/fr.json +++ b/packages/app-client/src/locales/fr.json @@ -3,6 +3,10 @@ "title": "Enclosed", "description": "Envoyez des notes privées et sécurisées" }, + "insecureContextWarning": { + "description": "Votre connexion n'est pas sécurisée, l'application doit être servie via HTTPS pour fonctionner correctement. Vous ne pourrez pas créer ou consulter de notes.", + "learn-more": "En savoir plus" + }, "navbar": { "new-note": "Nouvelle note", "theme": { diff --git a/packages/app-client/src/modules/ui/layouts/app.layout.tsx b/packages/app-client/src/modules/ui/layouts/app.layout.tsx index 05691b4d..92236050 100644 --- a/packages/app-client/src/modules/ui/layouts/app.layout.tsx +++ b/packages/app-client/src/modules/ui/layouts/app.layout.tsx @@ -1,4 +1,3 @@ -import type { Component, ParentComponent } from 'solid-js'; import { authStore } from '@/modules/auth/auth.store'; import { buildTimeConfig } from '@/modules/config/config.constants'; import { useConfig } from '@/modules/config/config.provider'; @@ -10,6 +9,7 @@ import { useThemeStore } from '@/modules/theme/theme.store'; import { Button } from '@/modules/ui/components/button'; import { DropdownMenu } from '@kobalte/core/dropdown-menu'; import { A, useNavigate } from '@solidjs/router'; +import { type Component, type ParentComponent, Show } from 'solid-js'; import { DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger } from '../components/dropdown-menu'; export const Navbar: Component = () => { @@ -165,8 +165,25 @@ export const Footer: Component = () => { }; export const AppLayout: ParentComponent = (props) => { + const getIsSecureContext = () => { + return window.isSecureContext ?? window.location.protocol === 'https:'; + }; + + const { t } = useI18n(); + return (
+ +
+ + {t('insecureContextWarning.description')} + {' '} + + {t('insecureContextWarning.learn-more')} + +
+ +
{props.children}
diff --git a/packages/app-client/uno.config.ts b/packages/app-client/uno.config.ts index ae821edb..8fd4f1b6 100644 --- a/packages/app-client/uno.config.ts +++ b/packages/app-client/uno.config.ts @@ -53,6 +53,10 @@ export default defineConfig({ DEFAULT: 'hsl(var(--destructive))', foreground: 'hsl(var(--destructive-foreground))', }, + warning: { + DEFAULT: 'hsl(var(--warning))', + foreground: 'hsl(var(--warning-foreground))', + }, muted: { DEFAULT: 'hsl(var(--muted))', foreground: 'hsl(var(--muted-foreground))', diff --git a/packages/docs/.vitepress/theme/custom.css b/packages/docs/.vitepress/theme/custom.css index fcd49e4a..1d014b96 100644 --- a/packages/docs/.vitepress/theme/custom.css +++ b/packages/docs/.vitepress/theme/custom.css @@ -5,7 +5,7 @@ --vp-c-brand-2: #000000; --vp-c-bg: #ffffff; - --vp-c-bg-alt: #ffffff; + --vp-c-bg-alt: #f5f5f5; --vp-c-text-1: #171717; --vp-c-text-2: #737373; @@ -27,8 +27,7 @@ --vp-c-text-2: #a3a3a3; --vp-c-bg: #0a0a0a; - --vp-c-bg-alt: #0a0a0a; - --vp-c-bg-soft: #262626; + --vp-c-bg-alt: #161618; --vp-c-border: #262626; --vp-c-divider: #262626; diff --git a/packages/docs/src/self-hosting/troubleshooting.md b/packages/docs/src/self-hosting/troubleshooting.md index dd1cd370..de0687e7 100644 --- a/packages/docs/src/self-hosting/troubleshooting.md +++ b/packages/docs/src/self-hosting/troubleshooting.md @@ -1,10 +1,18 @@ # Troubleshooting -## App accessible but unable to create a note +## Why do I see a warning about insecure connexion? -The app must be served over HTTPS to create notes. You will not be able to interact with the API if the app is not served over HTTPS. -You will see an error message like this in the console: +Enclosed rely on native browser crypto APIs to encrypt and decrypt notes with security and great performance. +These APIs are only available in secure contexts (HTTPS). If you are running the app in a non-secure context (HTTP), you will see a warning in the app: + +```plaintext +Your connection is not secure, the app must be served over HTTPS to work properly. You won't be able to create or view notes. Learn more. +``` + +You may also see a warning in the browser console: ```plaintext The Cross-Origin-Opener-Policy header has been ignored because the URL's origin was untrustworthy. ``` + +You will need to serve the app over HTTPS to use it properly.