diff --git a/flake.nix b/flake.nix index e62141c..a61fc25 100644 --- a/flake.nix +++ b/flake.nix @@ -219,6 +219,10 @@ }; + packages = { + incus-ui = pkgs.callPackage ./pkgs/incus-ui { }; + }; + devShells.default = with pkgs; mkShell { inherit (self'.checks.pre-commit-check) shellHook; diff --git a/overlays/default.nix b/overlays/default.nix index 19ff1e1..663094b 100644 --- a/overlays/default.nix +++ b/overlays/default.nix @@ -22,4 +22,5 @@ _final: prev: { patches = (prevAttrs.patches or [ ]) ++ [ ./ddccontrol-db/0001-add-del41d9.patch ]; }); + incus-ui = prev.pkgs.callPackage ../pkgs/incus-ui { }; } diff --git a/pkgs/incus-ui/default.nix b/pkgs/incus-ui/default.nix new file mode 100644 index 0000000..6b5480c --- /dev/null +++ b/pkgs/incus-ui/default.nix @@ -0,0 +1,76 @@ +{ lib +, stdenv +, fetchFromGitHub +, fetchYarnDeps +, nodejs +, prefetch-yarn-deps +, yarn +}: + +stdenv.mkDerivation rec { + pname = "incus-ui"; + version = "0.5"; + + src = fetchFromGitHub { + owner = "canonical"; + repo = "lxd-ui"; + rev = version; + hash = "sha256-52MRf7bk8Un9wqz00+JjDmuJgPKYhgAhIbMbcAuf8W8="; + }; + + offlineCache = fetchYarnDeps { + yarnLock = "${src}/yarn.lock"; + hash = "sha256-WWnNjwzhN57PzTPmLWWzPoj66VFUnuzW1hTjKlVV8II="; + }; + + patches = [ + ./ui-canonical-0001-Branding.patch + ./ui-canonical-0002-Update-navigation.patch + ./ui-canonical-0003-Update-certificate-generation.patch + ./ui-canonical-0004-Remove-external-links.patch + ./ui-canonical-0005-Remove-Canonical-image-servers.patch + ]; + + nativeBuildInputs = [ + nodejs + prefetch-yarn-deps + yarn + ]; + + configurePhase = '' + runHook preConfigure + + export HOME=$(mktemp -d) + yarn config --offline set yarn-offline-mirror "$offlineCache" + fixup-yarn-lock yarn.lock + yarn --offline --frozen-lockfile --ignore-platform --ignore-scripts --no-progress --non-interactive install + patchShebangs node_modules + cp ${./favicon-32x32.png} public/assets/img/favicon-32x32.png + + runHook postConfigure + ''; + + buildPhase = '' + runHook preBuild + + yarn --offline build + + runHook postBuild + ''; + + installPhase = '' + runHook preInstall + + cp -r build/ui $out + + runHook postInstall + ''; + + meta = with lib; { + description = "Easy and accessible container and virtual machine management. A browser interface for LXD"; + homepage = "https://github.com/canonical/lxd-ui"; + license = licenses.gpl3; + maintainers = with maintainers; [ ]; + platforms = platforms.linux; + }; +} diff --git a/pkgs/incus-ui/favicon-32x32.png b/pkgs/incus-ui/favicon-32x32.png new file mode 100644 index 0000000..1d487b4 Binary files /dev/null and b/pkgs/incus-ui/favicon-32x32.png differ diff --git a/pkgs/incus-ui/ui-canonical-0001-Branding.patch b/pkgs/incus-ui/ui-canonical-0001-Branding.patch new file mode 100644 index 0000000..1422bc8 --- /dev/null +++ b/pkgs/incus-ui/ui-canonical-0001-Branding.patch @@ -0,0 +1,276 @@ +From b2c17ef237b6c7540d4947f3d4544dc08dbd33ad Mon Sep 17 00:00:00 2001 +From: Erwin Boskma +Date: Sat, 23 Dec 2023 20:02:24 +0100 +Subject: [PATCH] Branding + +--- + index.html | 2 +- + public/assets/img/incus-logo.svg | 129 ++++++++++++++++++++++++++++++ + public/assets/img/lxd-logo.svg | 34 -------- + src/components/Logo.tsx | 6 +- + src/sass/_pattern_navigation.scss | 8 +- + src/util/title.tsx | 2 +- + 6 files changed, 138 insertions(+), 43 deletions(-) + create mode 100644 public/assets/img/incus-logo.svg + delete mode 100644 public/assets/img/lxd-logo.svg + +diff --git a/index.html b/index.html +index 6aa1283..85b46bd 100644 +--- a/index.html ++++ b/index.html +@@ -5,7 +5,7 @@ + + + +- LXD UI ++ Incus UI + + + +diff --git a/public/assets/img/incus-logo.svg b/public/assets/img/incus-logo.svg +new file mode 100644 +index 0000000..9caf711 +--- /dev/null ++++ b/public/assets/img/incus-logo.svg +@@ -0,0 +1,129 @@ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ +diff --git a/public/assets/img/lxd-logo.svg b/public/assets/img/lxd-logo.svg +deleted file mode 100644 +index 272ef59..0000000 +--- a/public/assets/img/lxd-logo.svg ++++ /dev/null +@@ -1,34 +0,0 @@ +- +- +- +- +- +- +- +- +- +- +- +- +- +- +- +- +- +- +- +- +- +- +\ No newline at end of file +diff --git a/src/components/Logo.tsx b/src/components/Logo.tsx +index bcaf07e..92a0a5a 100644 +--- a/src/components/Logo.tsx ++++ b/src/components/Logo.tsx +@@ -15,11 +15,11 @@ const Logo: FC = () => { + return ( + + LXD-UI logo +-
Canonical LXD
++
Incus UI
+ + ); + }; +diff --git a/src/sass/_pattern_navigation.scss b/src/sass/_pattern_navigation.scss +index a224ef4..d68f363 100644 +--- a/src/sass/_pattern_navigation.scss ++++ b/src/sass/_pattern_navigation.scss +@@ -5,20 +5,20 @@ + + .p-panel__logo-image { + height: 36px; +- margin-top: -3px; ++ margin-top: 2px; + max-width: inherit; + } + + .logo-text { + color: #fff; +- left: 47px; ++ left: 70px; + position: absolute; + top: $spv--x-small; + } + + @include mobile { + .logo-text { +- left: 38px; ++ left: 66px; + } + } + +@@ -28,7 +28,7 @@ + } + + .logo-text { +- left: 52px; ++ left: 80px; + } + } + } +diff --git a/src/util/title.tsx b/src/util/title.tsx +index 715fd43..a40b0b7 100644 +--- a/src/util/title.tsx ++++ b/src/util/title.tsx +@@ -6,6 +6,6 @@ export const setTitle = () => { + + useEffect(() => { + const host = settings?.config["user.ui_title"] ?? location.hostname; +- document.title = `${host} | LXD UI`; ++ document.title = `${host} | Incus UI`; + }, [settings?.config]); + }; +-- +2.42.0 + diff --git a/pkgs/incus-ui/ui-canonical-0002-Update-navigation.patch b/pkgs/incus-ui/ui-canonical-0002-Update-navigation.patch new file mode 100644 index 0000000..9bf7972 --- /dev/null +++ b/pkgs/incus-ui/ui-canonical-0002-Update-navigation.patch @@ -0,0 +1,74 @@ +From 837f1824fb44a3f9d47370ebb098e09f84e7fd9d Mon Sep 17 00:00:00 2001 +From: =?UTF-8?q?St=C3=A9phane=20Graber?= +Date: Wed, 22 Nov 2023 23:02:27 +0000 +Subject: [PATCH 2/5] Update navigation +MIME-Version: 1.0 +Content-Type: text/plain; charset=UTF-8 +Content-Transfer-Encoding: 8bit + +Signed-off-by: Stéphane Graber +--- + src/components/Navigation.tsx | 5 ++--- + src/components/NoMatch.tsx | 2 +- + src/context/useDocs.tsx | 2 +- + 3 files changed, 4 insertions(+), 5 deletions(-) + +diff --git a/src/components/Navigation.tsx b/src/components/Navigation.tsx +index 0e0c704..93d2db2 100644 +--- a/src/components/Navigation.tsx ++++ b/src/components/Navigation.tsx +@@ -287,7 +287,7 @@ const Navigation: FC = () => { +
  • + { +
  • + { + Report a bug + +
    • +- + + + +diff --git a/src/components/NoMatch.tsx b/src/components/NoMatch.tsx +index 8d5270c..bd9e515 100644 +--- a/src/components/NoMatch.tsx ++++ b/src/components/NoMatch.tsx +@@ -13,7 +13,7 @@ const NoMatch: FC = () => { +
    + If you think this is an error in our product, please{" "} + { +- const remoteBase = "https://documentation.ubuntu.com/lxd/en/latest"; ++ const remoteBase = "/documentation"; + const localBase = "/documentation"; + + const { data: settings } = useSettings(); +-- +2.39.2 + diff --git a/pkgs/incus-ui/ui-canonical-0003-Update-certificate-generation.patch b/pkgs/incus-ui/ui-canonical-0003-Update-certificate-generation.patch new file mode 100644 index 0000000..116f844 --- /dev/null +++ b/pkgs/incus-ui/ui-canonical-0003-Update-certificate-generation.patch @@ -0,0 +1,195 @@ +From fc477ad289e1be83d2e4350e07563c01c8750468 Mon Sep 17 00:00:00 2001 +From: =?UTF-8?q?St=C3=A9phane=20Graber?= +Date: Wed, 22 Nov 2023 23:03:33 +0000 +Subject: [PATCH 3/5] Update certificate generation +MIME-Version: 1.0 +Content-Type: text/plain; charset=UTF-8 +Content-Transfer-Encoding: 8bit + +Signed-off-by: Stéphane Graber +--- + src/pages/login/BrowserImport.tsx | 18 +++++++++--------- + src/pages/login/CertificateAdd.tsx | 4 ++-- + src/pages/login/CertificateGenerate.tsx | 12 ++++++------ + src/util/certificate.tsx | 4 ++-- + 4 files changed, 19 insertions(+), 19 deletions(-) + +diff --git a/src/pages/login/BrowserImport.tsx b/src/pages/login/BrowserImport.tsx +index f3cbcae..5d11d80 100644 +--- a/src/pages/login/BrowserImport.tsx ++++ b/src/pages/login/BrowserImport.tsx +@@ -25,7 +25,7 @@ const BrowserImport: FC = ({ sendPfx }) => { + <> +
  • + This opens a certificate management dialog. Click Import... +- then Next and select the lxd-ui.pfx file you ++ then Next and select the incus-ui.pfx file you + just downloaded. Enter your password, or leave the field empty if you + have not set one. Click Next. +
    • +@@ -34,14 +34,14 @@ const BrowserImport: FC = ({ sendPfx }) => { + Next, then click Finish. + +
  • +- Restart the browser and open LXD-UI. Select the LXD-UI certificate. ++ Restart the browser and open Incus-UI. Select the Incus-UI certificate. +
    • + + ); + + const downloadPfx = ( +
  • +- Download lxd-ui.pfx ++ Download incus-ui.pfx + {sendPfx && ( +
    + +@@ -82,12 +82,12 @@ const BrowserImport: FC = ({ sendPfx }) => { + Import. +
    • +
  • +- Select the lxd-ui.pfx file you just downloaded. ++ Select the incus-ui.pfx file you just downloaded. + Enter your password, or leave the field empty if you have not + set one. +
    • +
  • +- Restart the browser and open LXD-UI. Select the LXD-UI ++ Restart the browser and open Incus-UI. Select the Incus-UI + certificate. +
    • + +@@ -108,11 +108,11 @@ const BrowserImport: FC = ({ sendPfx }) => { + +
  • + Click the Import button and select the{" "} +- lxd-ui.pfx file you just downloaded. Enter your ++ incus-ui.pfx file you just downloaded. Enter your + password, or leave the field empty if you have not set one. +
    • +
  • +- Restart the browser and open LXD-UI. Select the LXD-UI ++ Restart the browser and open Incus-UI. Select the Incus-UI + certificate. +
    • + +@@ -179,7 +179,7 @@ const BrowserImport: FC = ({ sendPfx }) => { + keychain. + +
  • +- Drag the lxd-ui.pfx file onto the Keychain Access ++ Drag the incus-ui.pfx file onto the Keychain Access + app. +
    • +
  • +@@ -187,7 +187,7 @@ const BrowserImport: FC = ({ sendPfx }) => { + and password for an administrator user on this computer. +
    • +
  • +- Restart the browser and open LXD-UI. Select the LXD-UI ++ Restart the browser and open Incus-UI. Select the Incus-UI + certificate. +
    • + +diff --git a/src/pages/login/CertificateAdd.tsx b/src/pages/login/CertificateAdd.tsx +index e539588..bc09982 100644 +--- a/src/pages/login/CertificateAdd.tsx ++++ b/src/pages/login/CertificateAdd.tsx +@@ -52,7 +52,7 @@ const CertificateAdd: FC = () => { +

    Generate a token on the command line

    +
    + 
    +-                        lxc config trust add --name lxd-ui
++                        incus config trust add --name incus-ui
+
    +
    + +@@ -78,7 +78,7 @@ const CertificateAdd: FC = () => { + + +
    +-

    Enjoy LXD UI.

    ++

    Enjoy Incus UI.

    +
    + + +diff --git a/src/pages/login/CertificateGenerate.tsx b/src/pages/login/CertificateGenerate.tsx +index e8ce222..3c23645 100644 +--- a/src/pages/login/CertificateGenerate.tsx ++++ b/src/pages/login/CertificateGenerate.tsx +@@ -82,7 +82,7 @@ const CertificateGenerate: FC = () => { + mainClassName="certificate-generate" + header={ +
    +-

    Setup LXD UI

    ++

    Setup Incus UI

    +
    + } + > +@@ -137,12 +137,12 @@ const CertificateGenerate: FC = () => { + +
    +

    +- Download lxd-ui.crt and add it to the LXD ++ Download incus-ui.crt and add it to the Incus + trust store +

    +
    + 
    +-                        lxc config trust add Downloads/lxd-ui.crt
++                        incus config trust add-certificate Downloads/incus-ui.crt
+
    +
    +
    +@@ -152,7 +152,7 @@ const CertificateGenerate: FC = () => { +