fix(login) use trust_token as a field name in the payload when reusin…

…g a certificate in case the explicit_trust_token api extension is present

Signed-off-by: David Edler <david.edler@canonical.com>

src/api/certificates.tsx

@@ -11,13 +11,17 @@ export const fetchCertificates = (): Promise<LxdCertificate[]> => {
   });
 };
 
-export const addCertificate = (token: string): Promise<void> => {
+export const addCertificate = (
+  token: string,
+  hasExplicitTrustToken: boolean,
+): Promise<void> => {
   return new Promise((resolve, reject) => {
+    const tokenFieldName = hasExplicitTrustToken ? "trust_token" : "password";
     fetch(`/1.0/certificates`, {
       method: "POST",
       body: JSON.stringify({
         type: "client",
-        password: token,
+        [tokenFieldName]: token,
       }),
     })
       .then(handleResponse)

src/context/useSupportedFeatures.tsx

@@ -21,5 +21,6 @@ export const useSupportedFeatures = () => {
       !!serverVersion && serverMajor >= 5 && serverMinor >= 19,
     hasDocumentationObject:
       !!serverVersion && serverMajor >= 5 && serverMinor >= 20,
+    hasExplicitTrustToken: apiExtensions.has("explicit_trust_token"),
   };
 };

src/pages/login/CertificateAddForm.tsx

@@ -1,10 +1,12 @@
 import { FC, useState } from "react";
 import { Button, Form, Textarea, useNotify } from "@canonical/react-components";
 import { addCertificate } from "api/certificates";
+import { useSupportedFeatures } from "context/useSupportedFeatures";
 
 const CertificateAddForm: FC = () => {
   const notify = useNotify();
   const [token, setToken] = useState("");
+  const { hasExplicitTrustToken } = useSupportedFeatures();
 
   const useToken = () => {
     const sanitisedToken =
@@ -13,7 +15,7 @@ const CertificateAddForm: FC = () => {
         .split(/\r?\n|\r|\n/g)
         .at(-1) ?? "";
 
-    addCertificate(sanitisedToken)
+    addCertificate(sanitisedToken, hasExplicitTrustToken)
       .then(() => {
         location.reload();
       })