Portal Search Workflow

Overview

The OneRecord Portal Search Workflow allows a user to search for patient portals with OneRecord API Directory Services v0.1.x.

Usage

To understand how to use this web component, let's first look at integrating a Workflow into a project that does not make use of a frontend framework:

Vanilla JS

// arbitraryJavaScriptFile.js
import '@onerecord/workflows/dist/OneRecordPortalSearchWorkflowModal';

const OneRecordPortalSearchWorkflow = document.querySelector('onerecord-portal-search-workflow-modal')

// We need to set "properties" via JavaScript
// Set required getAuthorizationHeaderValue callback
OneRecordPortalSearchWorkflow.getAuthorizationHeaderValue = () => YOUR_AUTHORIZATION_HEADER_VALUE

// Set optional onSuccess callback
OneRecordPortalSearchWorkflow.onSuccess = (data) => console.log('onSuccess: ', data)

// See "Available Attributes & Properties" for the full list of available properties.

<!-- arbitraryHTMLFile.html -->
<!-- We can set "attributes" directly in the HTML -->
<!-- See "Available Attributes & Properties" for the full list of available attributes. -->
<onerecord-portal-search-workflow-modal
  api-origin="yourapi.com"
  google-maps-api-key="123ABC"
  return-url="https://yourwebsite.com">
</onerecord-portal-search-workflow-modal>

React

const OneRecordPortalSearchWorkflow = () => {
  const element = useRef(null)

  useEffect(() => {
    if (elementRef.current) {
      elementRef.current.getAuthorizationHeaderValue = () => YOUR_AUTHORIZATION_HEADER_VALUE
    }
  }, [elementRef.current])

  useEffect(() => {
    element.current.onSuccess = () => console.log('onSuccess: ', data)
  }, [element])

  return (
    <onerecord-portal-search-workflow-modal 
      api-origin="yourapi.com"
      google-maps-api-key="123ABC"
      ref={element}
      return-url="https://yourwebsite.com">
    </onerecord-portal-search-workflow-modal>
  )
}

SolidJS

const getAuthorizationHeaderValue = () => YOUR_AUTHORIZATION_HEADER_VALUE;

const OneRecordPortalSearchWorkflow = () => {
  const onSuccess = (data) => console.log('onSuccess', data);

  return (
    <onerecord-portal-search-workflow-modal 
      attr:api-origin="yourapi.com"
      attr:google-maps-api-key="123ABC"
      attr:return-url="https://yourwebsite.com"
      prop:getAuthorizationHeaderValue={() => getAuthorizationHeaderValue()}
      prop:onSuccess={() => onSuccess()}>
    </onerecord-portal-search-workflow-modal>
  )
}

Vue

<template>
  <onerecord-portal-search-workflow
    :api-origin.attribute="apiOrigin"
    :getAuthorizationHeaderValue.prop="getAuthorizationHeaderValue"
    :google-maps-api-key.attribute="googleMapsApiKey"
    return-url="https://yourwebsite.com">
  </onerecord-portal-search-workflow>
</template>

<script lang="ts">
  import '@onerecord/workflows/dist/OneRecordPortalSearchWorkflow';

  const getAuthorizationHeaderValue = () => import.meta.env.PUBLIC_AUTHENTICATION_HEADER_VALUE;

  export default {
    data: () => ({
      apiOrigin: "yourapi.com",
      getAuthorizationHeaderValue,
      googleMapsApiKey: "123ABC",
    }),
  }
</script>

Available Attributes & Properties

Note that the "Required" attributes and properties are necessary for the Workflow to do anything. The Workflow will be visible without them set, but it will remain in a loading state until it times out and switches to a failure state.

Please view the integration examples above to understand how your framework of choice integrates with web components. Note that web components are a web standard so Workflows will work with any framework, even if not detailed in the integration examples.

Attributes

Name	Required	Description
api-origin	✅	OneRecord API origin. Limited to same-origin requests.
google-maps-api-key	✅	Google Maps API key. Request an API key.
return-url	✅	URL returned to after a user attempts to connect to a patient portal.

Properties

Name	Required	Default	Description
getAuthorizationHeaderValue	✅	`() => ""`	A function that returns the appropriate Authorization header value for your authentication system
onCancel		`() => {}`	When a user abandons/exits the session.
onMount		`() => {}`	When the workflow initializes.
onCleanup		`() => {}`	When the workflow terminates.
onFailure		`(response) => {}`	When a user search does not return patient portals. Returns the response.
onSelection		`(organization) => {}`	When a user selects a patient portal. Returns an organization.
onSuccess		`(organizations) => {}`	When a user search returns patient portals. Returns an array of organization(s).

References

Organization type

{
  "name": "string",
  "city": "string",
  "state": "string",
  "zip": "string",
  "vendor": "string",
  "endpointStatus": "string",
  "disposition": "string",
  "dataType": "string",
  "derivedAuthUri": "string",
  "latitude": "number|string",
  "longitude": "number|string",
  "location": {
    "latitude": "number|string",
    "longitude": "number|string"
  },
  "_id": "string",
  "parent_org": "string"
}