Allow to install packed extensions from URL or local file (#1456)

* Option to install an extension from filesystem/url #1227 -- part 1 (UI)

Signed-off-by: Roman <ixrock@gmail.com>

* DropFileInput: common component to handle droped files (replaced also in add-cluster-page)

Signed-off-by: Roman <ixrock@gmail.com>

* fix: install via url-string on input.submit

Signed-off-by: Roman <ixrock@gmail.com>

* ui tweaks & minor fixes

Signed-off-by: Roman <ixrock@gmail.com>

* more ui/ux tweaks & fixes

Signed-off-by: Roman <ixrock@gmail.com>

* layout fixes

Signed-off-by: Roman <ixrock@gmail.com>

* component renaming: `copy-to-click` => `copy-to-clipboard` => `clipboard`

Signed-off-by: Roman <ixrock@gmail.com>

* reworks -- part 1

Signed-off-by: Roman <ixrock@gmail.com>

* fix downloading file, added common/utils/downloadFile

Signed-off-by: Roman <ixrock@gmail.com>

* confirm before install, unpack tar first steps

Signed-off-by: Roman <ixrock@gmail.com>

* installation flow, extracting .tgz

Signed-off-by: Roman <ixrock@gmail.com>

* clean up, fix lint issues

Signed-off-by: Roman <ixrock@gmail.com>

* update .azure-pipelines.yml

Signed-off-by: Roman <ixrock@gmail.com>

* fixes & refactoring

Signed-off-by: Roman <ixrock@gmail.com>

* fix lint harder :/

Signed-off-by: Roman <ixrock@gmail.com>

* fix validation

Signed-off-by: Roman <ixrock@gmail.com>

* fix validation harder

Signed-off-by: Roman <ixrock@gmail.com>

* responding to comments, fixed package validation

Signed-off-by: Roman <ixrock@gmail.com>

* common/utils/tar.ts: reject with Error-type

Signed-off-by: Roman <ixrock@gmail.com>

* fix: unit-tests

Signed-off-by: Roman <ixrock@gmail.com>

src/renderer/utils/copyToClipboard.ts

@@ -1,19 +1,25 @@
 // Helper for selecting element's text content and copy in clipboard
 
-export function copyToClipboard(elem: HTMLElement, resetSelection = true): boolean {
+export function copyToClipboard(elem: HTMLElement, { resetSelection = true } = {}) {
   let clearSelection: () => void;
   if (isSelectable(elem)) {
     elem.select();
     clearSelection = () => elem.setSelectionRange(0, 0);
-  }
-  else {
+  } else {
     const selection = window.getSelection();
     selection.selectAllChildren(elem);
     clearSelection = () => selection.removeAllRanges();
   }
-  const copyResult = document.execCommand("copy");
-  if (resetSelection) clearSelection();
-  return copyResult;
+  const selectedText = document.getSelection().toString();
+  const isCopied = document.execCommand("copy");
+  if (resetSelection) {
+    clearSelection();
+  }
+  return {
+    copied: isCopied,
+    copiedText: selectedText,
+    clearSelection,
+  };
 }
 
 function isSelectable(elem: HTMLElement): elem is HTMLInputElement {

src/renderer/utils/downloadFile.ts

@@ -1,12 +0,0 @@
-export function downloadFile(filename: string, contents: any, type: string) {
-  const data = new Blob([contents], { type });
-  const url = URL.createObjectURL(data);
-  const link = document.createElement("a");
-  link.href = url;
-  link.download = filename;
-  link.style.display = "none";
-  document.body.appendChild(link);
-  link.click();
-  document.body.removeChild(link);
-  URL.revokeObjectURL(url);
-}

src/renderer/utils/index.ts

@@ -7,7 +7,7 @@ export * from "../../common/utils";
 export * from "./cssVar";
 export * from "./cssNames";
 export * from "../../common/event-emitter";
-export * from "./downloadFile";
+export * from "./saveFile";
 export * from "./prevDefault";
 export * from "./createStorage";
 export * from "./interval";

src/renderer/utils/saveFile.ts

@@ -0,0 +1,18 @@
+/**
+ * Request default save-file dialog in browser.
+ * @param filename Name of file to be saved locally
+ * @param contents String or Buffer
+ * @param type Content-type
+ */
+export function saveFileDialog(filename: string, contents: BlobPart | BlobPart[], type: string) {
+  const data = new Blob([contents].flat(), { type });
+  const url = URL.createObjectURL(data);
+  const link = document.createElement("a");
+  link.href = url;
+  link.download = filename;
+  link.style.display = "none";
+  document.body.appendChild(link);
+  link.click();
+  document.body.removeChild(link);
+  URL.revokeObjectURL(url);
+}