@olvyhq/widget-react

This react component allows you to easily include Olvy widgets in your React applications. The component takes care of all the necessary set up and configuration, allowing you to simply specify which Olvy widget you want to use and any relevant options.

Demo

https://codesandbox.io/s/olvy-widget-react-icif8y

Installation

Install @olvyhq/widget-react with npm

  npm install @olvyhq/widget-react

Usage/Examples

In main.js

import {OlvyWidget,OlvyUtils} from  "@olvyhq/widget-react"

How to use

 <OlvyWidget
      config={<Configuration> }
      targetElement={<div>
      <div id="<Target-Element-Id>"></div>
      </div>  
    }
    ></OlvyWidget>

//Replace <Target-Element-Id> with your target element id and <Configuration> with your configuration

Example

 <OlvyWidget
      config={{workspaceAlias: "olvysdktest"}}
      targetElement={<div>
      <div id="olvy-whats-new">Announcement Widget</div>
      </div>  
    }>
    </OlvyWidget>

Configuration

{
    widgetId:"",   // (optional)
    workspaceAlias:""  //(required)
}

| Parameter | Type | Description | | :-------- | :------- | :------------------------- | | workspaceAlias | string | Required. Your subdomain | | widgetAliasOrID | string | Optional. widget Id or alias ( you can find it on widget details page in olvy dashbaord ) |

Methods

To show widget

OlvyUtils.showWidget(workspaceAlias,widgetAliasOrID)

| Parameter | Type | Description | | :-------- | :------- | :------------------------- | | workspaceAlias | string | Required. Your subdomain | | widgetAliasOrID | string | Required. widget Id or alias ( you can find it on widget details page in olvy dashbaord ) |

To hide widget

OlvyUtils.hideWidget(workspaceAlias,widgetAliasOrID)

| Parameter | Type | Description | | :-------- | :------- | :------------------------- | | workspaceAlias | string | Required. Your subdomain | | widgetAliasOrID | string | Required. widget Id or alias ( you can find it on widget details page in olvy dashbaord ) |

To set user

OlvyUtils.setUser(workspaceAlias, userObject) 

| Parameter | Type | Description | | :-------- | :------- | :------------------------- | | workspaceAlias | string | Required. Your subdomain | | userObject | object | Required. |

To set feedback meta info

OlvyUtils.setFeedbackMetaInfo (workspaceAlias, metaInfo)

| Parameter | Type | Description | | :-------- | :------- | :------------------------- | | workspaceAlias | string | Required. Your subdomain | | metaInfo | object | Required. |

To refresh unread count

OlvyUtils.refreshUnreadCount(workspaceAlias,widgetAliasOrID) 

| Parameter | Type | Description | | :-------- | :------- | :------------------------- | | workspaceAlias | string | Required. Your subdomain | | widgetAliasOrID | string | Required. widget Id or alias ( you can find it on widget details page in olvy dashbaord ) |

To show unread releases count

OlvyUtils.getUnreadReleasesCount(workspaceAlias,widgetAliasOrID)

| Parameter | Type | Description | | :-------- | :------- | :------------------------- | | workspaceAlias | string | Required. Your subdomain | | widgetAliasOrID | string | Required. widget Id or alias ( you can find it on widget details page in olvy dashbaord ) |

To remove unread indicator element

OlvyUtils.removeUnreadIndicatorElement(workspaceAlias,widgetAliasOrID)

| Parameter | Type | Description | | :-------- | :------- | :------------------------- | | workspaceAlias | string | Required. Your subdomain | | widgetAliasOrID | string | Required. widget Id or alias ( you can find it on widget details page in olvy dashbaord ) |

To add unread indicator element

OlvyUtils.addUnreadIndicatorElement(workspaceAlias,widgetAliasOrID, count) 

| Parameter | Type | Description | | :-------- | :------- | :------------------------- | | workspaceAlias | string | Required. Your subdomain | | widgetAliasOrID | string | Required. widget Id or alias ( you can find it on widget details page in olvy dashbaord ) |

To get last opened timestamp

OlvyUtils.getLastOpenedTimestamp(workspaceAlias,widgetAliasOrID)

| Parameter | Type | Description | | :-------- | :------- | :------------------------- | | workspaceAlias | string | Required. Your subdomain | | widgetAliasOrID | string | Required. widget Id or alias ( you can find it on widget details page in olvy dashbaord ) |

To refresh the widget

OlvyUtils.refresh(workspaceAlias,widgetAliasOrID)

| Parameter | Type | Description | | :-------- | :------- | :------------------------- | | workspaceAlias | string | Required. Your subdomain | | widgetAliasOrID | string | Required. widget Id or alias ( you can find it on widget details page in olvy dashbaord ) |

To teardown the widget

OlvyUtils.teardown(workspaceAlias,widgetAliasOrID)

| Parameter | Type | Description | | :-------- | :------- | :------------------------- | | workspaceAlias | string | Required. Your subdomain | | widgetAliasOrID | string | Required. widget Id or alias ( you can find it on widget details page in olvy dashbaord ) |

To create feedback

OlvyUtils.createFeedback(workspaceAlias,params)

| Parameter | Type | Description | | :-------- | :------- | :------------------------- | | workspaceAlias | string | Required. Your subdomain | | params | object | Required. |

Tests

  npm run test:unit