VGS Show

Description

The VGS Show.js JavaScript library enables you to securely display sensitive data in a webpage while safely isolating that sensitive data from your systems and any 3rd party scripts. This enables you to instruct VGS to securely share data directly with your users while limiting your data security compliance burden. If you want to know more about VGS, you can access this link: https://www.verygoodsecurity.com/docs/vgs-show/js.

Environment variables setup

Add variables for src/env.d.ts

export const VAULT_ENVIRONMENT_VGS: string;
export const VAULT_IDENTIFIER_VGS: string;

Add variables env/{DEV,QA,PROD}/.env:

VAULT_ENVIRONMENT_VGS=<environment>
VAULT_IDENTIFIER_VGS=<vaultIdentifier>

Description of the variables:

1. VAULT_ENVIRONMENT_VGS: this variable is used to decide which VGS environment will be used to store the sensitive data.

2. VAULT_IDENTIFIER_VGS: this variable is used to decide which VGS vault will be used to store the sensitive data.

How to use it?

import the VgsShowText into your file:

import {VgsShowText} from 'LinkerStudio/modules/Vault/vgs/components/organisms';

import useVgsShow into your file:

import {useVgsShow} from 'LinkerStudio/modules/Vault/vgs/hooks';

Import VGS_COLLECT_CONFIG into your file:

import {VGS_SHOW_CONFIG} from 'LinkerStudio/modules/Vault/vgs/constants';

Use the VgsShowText component and useVgsShow custom hook in your file:

 const {webviewRef, vgsShowResponse, loadingVgsShow, submitRequestToWebView} =
  useVgsShow();

<VgsShowText
      type="s4"
      vgsShowConfig={
        {
          ...VGS_SHOW_CONFIG,
          path: <your path>, // example: /vault/show
          payload: <object> //
        } as VgsShowConfig
      }
      webviewRef={webviewRef}
      vgsShowResponse={vgsShowResponse}
      loadingVgsShow={loadingVgsShow}
      submitRequestToWebView={submitRequestToWebView}
     
    />

Props Description

type: Size of the text. This can be s1, s2, s3, s4 or s5.

vgsShowConfig: inbound HTTP Routes configuration of VGS. For more information https://www.verygoodsecurity.com/docs/api/show#api-showrequest. webviewRef: ref of type webView. vgsShowResponse: event executed when a request is made to VGS, and returns status and message in response. loadingVgsShow: boolean value to determine the status of the request to VGS.

submitRequestToWebView: event making the request to VGS.