Add observability for LLM topic context inclusion (#1038)

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: thomasnordquist <7721625+thomasnordquist@users.noreply.github.com>
Co-authored-by: Thomas Nordquist <thomasnordquist@users.noreply.github.com>

app/src/components/Demo/ShowText.tsx

@@ -11,6 +11,7 @@ interface State {
 
 class Demo extends React.Component<{ classes: any }, State> {
   private timer: any
+
   constructor(props: any) {
     super(props)
     this.state = { location: 'bottom', keys: [] }
@@ -44,7 +45,7 @@ class Demo extends React.Component<{ classes: any }, State> {
       middle: -32,
     }
     const style = {
-      position: 'fixed' as 'fixed',
+      position: 'fixed' as const,
       left: '5vw',
       zIndex: 1000000,
       margin: '30vw auto 50vw',
@@ -52,7 +53,7 @@ class Demo extends React.Component<{ classes: any }, State> {
       bottom: `${positions[this.state.location]}vh`,
     }
     const style2 = {
-      textAlign: 'center' as 'center',
+      textAlign: 'center' as const,
       fontSize: '4em',
       color: 'white',
       backgroundColor: 'rgba(0, 0, 0, 0.8)',
@@ -67,9 +68,7 @@ class Demo extends React.Component<{ classes: any }, State> {
     if (this.state.keys.length > 0) {
       keys = this.state.keys
         .map(key => [<Key key={key} keyboardKey={key} />])
-        .reduce((prev, current) => {
-          return [prev, '+' as any, current]
-        })
+        .reduce((prev, current) => [prev, '+' as any, current])
     }
 
     return (
@@ -86,7 +85,7 @@ class Demo extends React.Component<{ classes: any }, State> {
 const style = (theme: Theme) => ({
   keysStyle: {
     fontSize: '1em',
-    display: 'inline-block' as 'inline-block',
+    display: 'inline-block' as const,
     transform: 'translateY(0.3em) translateX(0.8em)',
   },
 })