feat: vica integration

[adriangohjw]

Problem

Add integration for VICA

Solution

Breaking Changes

• Yes - this PR contains breaking changes
  • Details ...
• No - this PR is backwards compatible

Features:

Refer to this slack message for installation guide: https://opengovproducts.slack.com/archives/C087MUEJAMA/p1736330772752669?thread_ts=1736245461.677389&cid=C087MUEJAMA

note: decided to follow vica's way of specifying the keys and values as will be easier to port over from agency

• Add Vica stylesheet and widget component
• Add vica props to siteprops
• todo - clarifying with VICA on usage of props to pass in colour config (installation guide wasn't clear). In the meantime, we can manually pass it in via the props

Tests

note: slightly tricky to test as we will need to get the app-id and app-name from agencies

1. add the necessary vica config in site in the Site table
2. rebuild and see if it shows up

[datadog-opengovsg]

Datadog Report

Branch report: vica-integration
Commit report: b8194b0
Test service: isomer-studio

✅ 0 Failed, 257 Passed, 36 Skipped, 46.82s Total Time
➡️ Test Sessions change in coverage: 1 no change

[seaerchin]

mostly lgtm - i just took a (brief) look at the vica docs linked in slack

[seaerchin]

abit confused - how will we override? i'm assuming the compiled css will have font-family but how will vica pick it up

[adriangohjw]

can override directly in

isomer/packages/components/src/templates/next/components/internal/Vica/Vica.tsx

Lines 30 to 36 in 25eee45

	<div
	id="webchat"
	{...props}
	app-font-family="Inter, system-ui, sans-serif"
	// NOTE: Clarifying with VICA regarding color scheme
	// Once confirmed, will override with site's color scheme for consistency
	/>

once VICA got back to me, we also ideally want to use the site's color to prefill this. For now the only props we know we will override what's passed in is font family