add deep link to openid enroll (#150)

* Update OpenIDCallbackCard.tsx

* Update web/src/pages/openidCallback/components/OpenIDCallbackCard.tsx

Co-authored-by: Adam <[email protected]>

---------

Co-authored-by: Adam <[email protected]>

Author: filipslezaklab

web/src/pages/openidCallback/components/OpenIDCallbackCard.tsx

@@ -93,6 +93,13 @@ export const OpenIDCallbackCard = () => {
     return undefined;
   }, [data]);
 
+  const deepLink = useMemo(() => {
+    if (data) {
+      return `defguard://addinstance?token=${data.token}&url=${data.url}`;
+    }
+    return null;
+  }, [data]);
+
   if (isLoading) {
     return (
       <div className="loader-container">
@@ -125,14 +132,26 @@ export const OpenIDCallbackCard = () => {
       <BigInfoBox message={LL.pages.oidcLogin.card.infoBox()} />
       <h3>
         Please enter the provided Instance URL and Token into your Defguard Client. You
-        can scan the QR code or copy and paste the token manually.
+        can scan the QR code, click the button below or copy and paste the token manually.
       </h3>
       {isPresent(data) && (
         <>
           <CopyField label="Url" value={data.url} onCopy={writeToClipboard} />
           <CopyField label="Token" value={data.token} onCopy={writeToClipboard} />
         </>
       )}
+
+      {isPresent(deepLink) && (
+        <div className="row">
+          <a href={deepLink} target="_blank" rel="noopener noreferrer">
+            <Button
+              text="Configure your desktop client"
+              size={ButtonSize.LARGE}
+              styleVariant={ButtonStyleVariant.PRIMARY}
+            />
+          </a>
+        </div>
+      )}
       {isPresent(qrData) && (
         <div className="row">
           <div className="qr">