diff --git a/README.md b/README.md index 21f25e2d7a..d163caa7cf 100644 --- a/README.md +++ b/README.md @@ -19,6 +19,7 @@ This repo contains the typescript clients and projects for Threefold grid. - [rmb peer client](./packages/rmb_peer_client/README.md) - [rmb peer server](./packages/rmb_peer_server/README.md) - [Playground](./packages/playground/README.md) +- [UI](./packages/UI/README.md) ## Requirements diff --git a/packages/UI/docs/pdf_viewer.md b/packages/UI/docs/pdf_viewer.md index 2d20e1d3e2..ddbc0f536b 100644 --- a/packages/UI/docs/pdf_viewer.md +++ b/packages/UI/docs/pdf_viewer.md @@ -28,11 +28,13 @@ To use the PDF Signer Web Component, follow these steps: 2. Navigate to the `repository/packages/UI` directory. -3. Run `yarn build` to generate the required distribution files. +3. Choose which provider you are going to use [see providers section](#using-providers-and-extensions) -4. Locate the `dist` folder created in the previous step. +4. Run `yarn build` to generate the required distribution files. -5. Copy the `dist/threefold-ui.umd.js` file and include it in your project's HTML files. +5. Locate the `dist` folder created in the previous step. + +6. Copy the `dist/threefold-ui.umd.js` file and include it in your project's HTML files. ```html @@ -101,6 +103,8 @@ Here's an example of how to use the PDF Signer Web Component in your HTML file: In the example above, replace `` and `` with the actual URLs for your PDF document and the destination where signed documents should be sent. Also, for the ``, use one of the following network options: `[main, test, qa, dev]`. +PS: Please make sure that you have a `PDF URL` with `CORS-ORIGIN` enabled. + Feel free to customize the HTML structure and styles to match your application's design and requirements. **Now you can serve your HTML file on any live-server plugin.** diff --git a/packages/UI/docs/script_editor.md b/packages/UI/docs/script_editor.md index d536334a58..6b339cdf3b 100644 --- a/packages/UI/docs/script_editor.md +++ b/packages/UI/docs/script_editor.md @@ -27,11 +27,13 @@ To create an instance of the Script Editor, follow these steps: 2. Navigate to the `repository/packages/UI` directory. -3. Run `yarn build` to generate the required distribution files. +3. Choose which provider you are going to use [see providers section](#using-providers-and-extensions) -4. Locate the `dist` folder created in the previous step. +4. Run `yarn build` to generate the required distribution files. -5. Copy the `dist/threefold-ui.umd.js` file and include it in your project's HTML files. +5. Locate the `dist` folder created in the previous step. + +6. Copy the `dist/threefold-ui.umd.js` file and include it in your project's HTML files. ```html diff --git a/packages/UI/src/components/PDFSignerViewComponent.vue b/packages/UI/src/components/PDFSignerViewComponent.vue index f4c308d184..680791384b 100644 --- a/packages/UI/src/components/PDFSignerViewComponent.vue +++ b/packages/UI/src/components/PDFSignerViewComponent.vue @@ -111,7 +111,10 @@ export default { pdfData.value = data.toString(); numOfPages.value = pdf.numPages; } catch (error: any) { - showError({ isError: true, errorMessage: error.message }); + showError({ + isError: true, + errorMessage: "Please make sure that you have provided a PDF URL with CORS enabled.", + }); } finally { loadingPdf.value = false; }