State already uses Google Analytics on HealthVermont.gov - see if we can extend that instance or if we need to create our own

On low end devices we might need to debounce filter/search function in mark.js

Add persistent chat icon to the page that expands to client when clicked

Simple implementation

function popupFunction() {
    var x = document.getElementById('chatFrame');
    if (x.style.visibility == 'hidden') {
        x.style.visibility = 'visible';
    }
    else {
        x.style.visibility = 'hidden';
    }
}

Assess need from communications

Possibly SMS or WhatsApp

Channels Docs

Azure Static Web Apps

Either Node or C#

Can use node client wrapper @ads-vdh/qnamaker-api

Current Workflow:

• Publish KB on Test
• Export via Excel on Test
• Import via Excel on Prod
• Publish KB on Prod

Problems

• Manual process
• Destroy question IDs
  • Never synchronized on test/prod
  • Prod IDs keep getting replaced
  • Test IDs are brittle if we need to do a restore/backup (otherwise appropriately revisioned via QnA Maker)

Any wholesale replacement .replace() method or excel import will re-write IDs

Only way to persist IDs is directly making modifications in QnA Maker or calling .update() method

Update Method

• add
• update
• delete

Restore on TEST (only as a backup to QnA Maker)

1. current test .download()
2. modified faq - local file with changes forked from the test faq
3. look for any changes within each id
   • if we have changes, send update instruction
4. look for any IDs in current, not in previous
   • if we have additions, send add instruction
5. look for any IDs in previous, not in current
   • if we have deletes, send delete instruction

Publish to PROD - simple

1. testClient
   • alterations.get()
   • knowledgebase.donwload()
2. prodClient
   • alterations.replace()
   • knowledgebase.replace() // wholesale replace
   • knowledgebase.publish()

Update on PROD - with ID matching (hard)

1. previous test/faqs.json
2. current test/faqs.json
3. look for any changes within each id
   • if we have changes, send update instruction
     • take test id that was updated, find production id to update (hard)
4. look for any IDs in current, not in previous
   • if we have additions, send add instruction
     • test test question that was added, add brand new question (ID yet to generated) (hard)
5. look for any IDs in previous, not in current
   • if we have deletes, send delete instruction
     • take test id that was deleted, find production id to delete (hard)

Test -> Production id lookup

1. Possibly off name of question, but brittle if name changes
2. Possibly off independently persisted test-to-prod lookup

Check for the following things:

• Answer starts with bold text (presumably the original question)
• QnA has category metadata tag
• The category tag is part of parent list (topics.json)
• URL's are fully qualified (begin with http)
• URL's are valid (return 200 status code)

Targets

• Test
• Prod

Events

• Commit on Main -> Prod
• On KB Publish -> Test
• Button Click -> Test/Prod

Current State

• Build Locally
• Move Files

Hosting Options

• on network
• cloud
  • netlify
  • azure static sites
  • gh-pages

Challenges

• git commits
• authentication

Actions

• publish
• deploy-kb
• fetch
• archive
• lint
• list

Todo

1. Create Azure Static Sites bucket

   1. Create Storage Account
   2. Create Static Web Site
   • Blob Containers > $web

   3. Upload via Azure Storage Explorer

      https://sovcovidbotteststorage.z13.web.core.windows.net/
      https://apps-test.health.vermont.gov/COVIDFAQ/

2. Repoint proxy to azure static sites

3. GH Action to build and deploy site to Azure

4. Click a button -> run a command -> return info

• build historical file (initial)
  • extract all previous versions of a file from git (with date stamp as name) [manual|script]
• display last update date at question level
• provide diffing for any changes over last [3|4|5]? days
• refactor how we archive questions (ongoing)
  • add changes to revisions history as soon as they appear if there's a delta

Possible archive format:

[
    {
        "id": 4534,
        "revs": [
            {
                "date": "2020-07-13",
                "question": "What are the symptoms of CoronaVirus",
                "answer": "People with COVID-19 have had a wide range of symptoms reported"
            },
            {
                "date": "2020-07-14",
                "question": "What are the symptoms of COVID-19?",
                "answer": "People with COVID-19 have had a wide range of symptoms reported"
            }
        ]
    }
]

Send alternative response if word count is over a particular length (i.e. >75) - something like this:

Sorry, I'm just an automated bot. I can't easily address long or complex questions. Please try asking me a more general question or try calling calling 2-1-1 to talk to a real live person

New Config Values:

• LongQuestionWordCountThreshold
• LongQuestionResponse

Acceptance Criteria:

• incoming message should still be logged
• only return custom response

There is an issue with our reverse proxy when we have outbound rules. URL Rewrite will complain if the response is compressed because it can't inspect and alter traffic. We need to either eliminate outbound rules or filter the active ones to make sure they only try to fire when they already have a match on the resource path.

Instead of adding follow up prompt - "this did not answer my question" - automatically add card submit action

Adaptive Card Visualizer
Add card actions to a bot

This could possibly be attached to logging that information directly

An advanced feature would be to submit user info for someone to follow up - but this process workflow would have to be run by communications first

be able to compare deltas and show insert / delete text from previous day or over time

We can use some semantic demarcating edits tags:

• <ins>
• <del>

A couple potential vehicles:

1. Build daily site output with the date timestamped and keep built version. Possibly add revision controls. This allows for exploring previous days, but no succinct diff.
2. During update data - move existing data to faqs-prev.json and new data to faqs-cur.json. Then when building site, grab both data sets (IDs must match) and build updated markdown with diffs

Setting up a GitHub Pages site with Jekyll

• About GitHub Pages and Jekyll
• Creating a GitHub Pages site with Jekyll
• Testing your GitHub Pages site locally with Jekyll
• Adding content to your GitHub Pages site using Jekyll
• Setting a Markdown processor for your GitHub Pages site using Jekyll
• Adding a theme to your GitHub Pages site using Jekyll
• About Jekyll build errors for GitHub Pages sites

Stack Overflow Thread: Looking for a unique “Conversation ID” in the App Insights for QnA Maker

We currently have a kql query in app insights that joins on a partial ID match

// answered and unanswered
let startDate = todatetime("2020-03-25T16:30:00");
// bad convo ids
let wrongIDs = traces
| where customDimensions.Question contains "This did NOT answer my question" 
| project extract("^[a-z0-9]{7}", 0, itemId);
// get all q/a pairs
traces
| extend input = tostring(customDimensions.Question),
        answer = tostring(customDimensions.Answer),
        scoreInt = toint(round(todouble(customDimensions.Score))),
        convoId = extract("^[a-z0-9]{7}", 0, itemId)
| where message contains "GenerateAnswer"
    and input  !contains "This did NOT answer my question"
    and timestamp > startDate
| extend score = iif(convoId in (wrongIDs), -1, scoreInt), // separate bad vs good
         EST = datetime_add("hour", -4, timestamp)         // convert UTC to EST
| order by timestamp desc 
| project itemId,
          input,
          faq = extract("^\\*\\*(.*)\\*\\*", 1, answer),
          type = case(score == -1, "wrong",
                      score == 0, "no answer",
                      "answered"),
          score,
          timestamp = format_datetime(EST, "MM/dd/yyyy hh:mm tt")

But we should confirm if this is the best approach or potentially customize the build

Follow up to #13 (add categories), including subcategories and a individual question level sort indicator

We can download QnA Maker Alterations using the Alterations API

Then pass into mark.js options object which takes a synonyms property:

An object with synonyms. The key will be a synonym for the value and the value for the key. Example: "synonyms": {"one": "1"} will add the synonym "1" for "one" and vice versa

Since we're using commander to capture CLI arguments, we can leverage the documentation generation features by placing all CLI commands under a parent option.

Optionally, consider inquirer to increase discoverability of correct CLI params

Add Google's Structured Data tags for FAQ data

Data should look something like this:

{
  "@context": "https://schema.org",
  "@type": "FAQPage",
  "mainEntity": [
    {
      "@type": "Question",
      "name": " What are the symptoms of COVID-19?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "People with COVID-19 have had a wide range of symptoms reported – ranging from mild symptoms to severe illness. Symptoms may appear 2 to 14 days after exposure to the virus. Not everyone infected with the COVID-19 virus has symptoms. People with these symptoms may have COVID-19:"
      }
    }, {
      "@type": "Question",
      "name": " Can I take ibuprofen for COVID-19 symptoms?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Some early news reports suggested that non-steroidal anti-inflammatory drugs (NSAIDs), such as ibuprofen, could worsen coronavirus disease. However, the Food and Drug Administration (FDA) has said it is not aware of any scientific evidence connecting the use of NSAIDs with worsening COVID-19 symptoms at this time. The FDA is investigating this issue further."
      }
    }
  ]
}

update node modules to be built and consume typescript

this should fix the fact that when passing an instance of the kb-node-client to a function, we lose intellisense because we can't explicitly type the incoming parameters (without duplicating a lot of work in jsdoc comments).

depends on #13 add categorization

Add sidenav with table of contents for FAQ

We can add questions with metadata and then leverage that in the downloaded KB

Add toggle to expand collapse all summary > detail sections

Creating a default community health file

For repo or organization

Examples:

• This did not answer my question
• Are you a human

The Get Details API should provide the information needed to get the last modified time on the KB

https://docs.microsoft.com/en-us/azure/bot-service/bot-builder-send-welcome-message?view=azure-bot-service-4.0&tabs=csharp
microsoft/botframework-sdk#2098

add support for togglable faq sections for older browsers

Although we've already and built and deployed a client side API wrapper

https://www.npmjs.com/package/@ads-vdh/qnamaker-api

It looks like Azure beat us to the punch 2 months earlier. We should use the official wrapper going forward for better long term support which exists here:

https://www.npmjs.com/package/@azure/cognitiveservices-qnamaker
https://www.npmjs.com/package/@ads-vdh/qnamaker-api

Look at implementation in SQL-CLI #2

Update this line in QnAMakerBaseDialog

ScoreThreshold = DefaultThreshold,

Implementation can borrow from DocGov #97 - Add target="_blank" to external links

Follow up button text should always match the question that it points to, add a script that automatically updates button text to match changes to questions

Request from communications team.

A strategy like the one described here may be appropriate:
Expand Certain Div on Page Load with Link

Features

• Hide attachment icon next to question box
• Wrap Follow up Prompt Text
• Add VDH Logo

Deployment

• Add direct address to just embeddable bot built with script
• Add Demo of iframe to direct chatbot embed

Hide Attachment Icon

From this post on How to disable attachment in botframework, we can do by switching to the JS renderer instead of using an iFrame like this:

window.WebChat.renderWebChat({
  directLine: window.WebChat.createDirectLine({ token }),
  styleOptions: {
    hideUploadButton: true
  }
}, document.getElementById('webchat'));

Wrap Follow Up Prompt

.ac-actionSet .ac-pushButton>div {
    overflow: visible !important;
    text-overflow: initial !important;
    white-space: normal !important;
}