chore: Import changes from the examples package (#182)

Author: georgylobko

src/pages/chat/common-components.tsx

@@ -16,11 +16,18 @@ export function ChatBubbleAvatar({ type, name, initials, loading }: AuthorAvatar
   return <Avatar initials={initials} tooltipText={name} ariaLabel={name} />;
 }
 
-export function CodeViewActions() {
+export function CodeViewActions({ content }: { content: string }) {
   return (
     <ButtonGroup
       variant="icon"
-      onItemClick={() => void 0}
+      onItemClick={({ detail }) => {
+        if (detail.id !== 'copy' || !navigator.clipboard) {
+          return;
+        }
+
+        // eslint-disable-next-line no-console
+        navigator.clipboard.writeText(content).catch(error => console.log('Failed to copy', error.message));
+      }}
       items={[
         {
           type: 'group',
@@ -84,7 +91,7 @@ export const ScrollableContainer = forwardRef(function ScrollableContainer(
 ) {
   return (
     <div style={{ position: 'relative', blockSize: '100%' }}>
-      <div style={{ position: 'absolute', inset: 0, overflowY: 'auto' }} ref={ref}>
+      <div style={{ position: 'absolute', inset: 0, overflowY: 'auto' }} ref={ref} data-testid="chat-scroll-container">
         {children}
       </div>
     </div>

src/pages/chat/config.tsx

@@ -260,7 +260,17 @@ main();`}
         highlight={typescriptHighlight}
       />
     ),
-    actions: <CodeViewActions />,
+    actions: (
+      <CodeViewActions
+        content={`// This is the main function that will be executed when the script runs
+    function main(): void {
+      // Use console.log to print "Hello, World!" to the console
+      console.log("Hello, World!");
+    }
+    // Call the main function to execute the program
+    main();`}
+      />
+    ),
     timestamp: getTimestampMinutesAgo(4),
     hideAvatar: true,
   },

src/pages/table-property-filter/property-filter-table.tsx

@@ -124,7 +124,12 @@ export function PropertyFilterTable({
              * https://owasp.org/www-community/vulnerabilities/Information_exposure_through_query_strings_in_url
              * For further guidance, reach out to your organization’s security team.
              */
-            setQueryParam(PROPERTY_FILTERS_QUERY_PARAM_KEY, JSON.stringify(event.detail));
+            const query = event.detail;
+            if (!query.tokens?.length && !query?.tokenGroups?.length) {
+              setQueryParam(PROPERTY_FILTERS_QUERY_PARAM_KEY, null);
+            } else {
+              setQueryParam(PROPERTY_FILTERS_QUERY_PARAM_KEY, JSON.stringify(query));
+            }
 
             propertyFilterProps.onChange(event);
           }}

src/pages/table-saved-filters/root.tsx

@@ -239,7 +239,13 @@ export function App() {
                    * https://owasp.org/www-community/vulnerabilities/Information_exposure_through_query_strings_in_url
                    * For further guidance, reach out to your organization’s security team.
                    */
-                  setQueryParam(PROPERTY_FILTERS_QUERY_PARAM_KEY, JSON.stringify(event.detail));
+                  const query = event.detail;
+                  if (!query.tokens?.length && !query?.tokenGroups?.length) {
+                    setQueryParam(PROPERTY_FILTERS_QUERY_PARAM_KEY, null);
+                    setQueryParam(SELECTED_FILTER_SET_QUERY_PARAM_KEY, null);
+                  } else {
+                    setQueryParam(PROPERTY_FILTERS_QUERY_PARAM_KEY, JSON.stringify(query));
+                  }
 
                   propertyFilterProps.onChange(event);
                 }}

src/styles/chat.scss

@@ -17,8 +17,8 @@
   }
 
   &.classic {
-    position: absolute;
-    inset-block-end: 0;
+    inline-size: 100%;
+    block-size: 1100px;
   }
 }