Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: doc site import #3078

Merged
merged 1 commit into from
Nov 27, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
@@ -1,14 +1,15 @@
import { Meta, IconGallery, IconItem } from '@storybook/blocks';
import { AssistantComponentsCards } from "../../common/cards";
import { IconGallery, IconItem, Meta } from '@storybook/blocks';
import { AssistantComponentsCards } from '../../common/cards';

<Meta title="Assistant/Overview" />
<Meta title='Assistant/Overview' />

# AWS IoT SiteWise Assistant

AWS IoT SiteWise Assistant, a generative AI-powered assistant in AWS IoT SiteWise that allows industrial users to gain insights,
AWS IoT SiteWise Assistant, a generative AI-powered assistant in AWS IoT SiteWise that allows industrial users to gain insights,
solve problems, and take actions from their operational data and other data sources intuitively using natural language queries.

## Get Started

Please check our user guide about how to setup and enable the AWS IoT Sitewise assistant: [https://docs.aws.amazon.com/iot-sitewise/latest/userguide/assistant-get-started.html](https://docs.aws.amazon.com/iot-sitewise/latest/userguide/assistant-get-started.html)

## Features
Expand All @@ -21,6 +22,6 @@ For more details, please read [Transforming industrial decision making with AWS
- Seamless Integration and Accessibility
- Security and Privacy

## AI-aware app kit components
## AI-aware app kit components

<AssistantComponentsCards />
<AssistantComponentsCards />
Original file line number Diff line number Diff line change
@@ -1,8 +1,6 @@
import { Chart, useAssistant } from '@iot-app-kit/react-components';
import {
mockSinWaveData,
} from '@iot-app-kit/testing-util';
import { IoTSitewiseAssistantClient } from '@iot-app-kit/core-util';
import { Chart, useAssistant } from '@iot-app-kit/react-components';
import { mockSinWaveData } from '@iot-app-kit/testing-util';
import { type Meta, type StoryObj } from '@storybook/react';
import { MockInvokeAssistant } from '../../mockAssistantAPI';

Expand Down Expand Up @@ -33,7 +31,7 @@ export const Assistant: Story = {

return (
<div style={{ height: '560px', width: '900px' }}>
Please, select an item in the table below:
Please, select an item in the table below:
<Chart
{...{
...props,
Expand All @@ -53,9 +51,9 @@ export const Assistant: Story = {
componentId: componentId1,
conversationId: 'mockConversationId',
target: 'widget',
onAction:(event) => {
if (event.type === 'selection') {
clearAll();
onAction: (event) => {
if (event.type === 'selection') {
clearAll();
generateSummary({
componentId: componentId1,
conversationId: crypto.randomUUID(),
Expand All @@ -64,11 +62,11 @@ export const Assistant: Story = {
'generate a summary and return the response in markdown format.',
});
}
}
},
}}
/>
</div>
)
);
},
args: {
queries: [mockSinWaveData()],
Expand Down
Original file line number Diff line number Diff line change
@@ -1,10 +1,14 @@
/* eslint-disable */
// @ts-nocheck
import { useEffect } from 'react';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import { AssistantChatbot, useAssistant, MessageType } from '@iot-app-kit/react-components';
import { IoTSitewiseAssistantClient } from '@iot-app-kit/core-util';
import '@cloudscape-design/global-styles/index.css';
import { IoTSitewiseAssistantClient } from '@iot-app-kit/core-util';
import {
AssistantChatbot,
MessageType,
useAssistant,
} from '@iot-app-kit/react-components';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import { useEffect } from 'react';
import { MockInvokeAssistant } from '../../mockAssistantAPI';

export default {
Expand All @@ -30,10 +34,7 @@ const client = new IoTSitewiseAssistantClient({
defaultContext: '',
});

export const Standard: ComponentStory<
typeof AssistantChatbot
> = () => {

export const Standard: ComponentStory<typeof AssistantChatbot> = () => {
const { messages, invokeAssistant, clearAll, setMessages } = useAssistant({
assistantClient: client,
});
Expand All @@ -42,8 +43,7 @@ export const Standard: ComponentStory<
clearAll();
setMessages([
{
content:
'Who are you ?',
content: 'Who are you ?',
sender: 'user',
type: MessageType.TEXT,
id: crypto.randomUUID(),
Expand Down Expand Up @@ -83,14 +83,10 @@ export const Standard: ComponentStory<
);
};

export const LoadingState: ComponentStory<
typeof AssistantChatbot
> = () => {

export const LoadingState: ComponentStory<typeof AssistantChatbot> = () => {
const messages = [
{
content:
'Processing assistant response, please wait..',
content: 'Processing assistant response, please wait..',
sender: 'assistant',
type: MessageType.TEXT,
id: crypto.randomUUID(),
Expand All @@ -105,7 +101,7 @@ export const LoadingState: ComponentStory<
loading: true,
},
];

return (
<div style={{ padding: '0.5rem' }} data-testid='processing-chatbot-story'>
<AssistantChatbot
Expand All @@ -118,32 +114,30 @@ export const LoadingState: ComponentStory<
);
};

export const ErrorState: ComponentStory<
typeof AssistantChatbot
> = () => {

export const ErrorState: ComponentStory<typeof AssistantChatbot> = () => {
const messages = [
{
content:
'Processing assistant response, please wait..',
content: 'Processing assistant response, please wait..',
sender: 'assistant',
type: MessageType.TEXT,
id: crypto.randomUUID(),
loading: true,
},
{
content: 'You do not have the required permissions to use the Sitewise Assistant. Please contact your administrator to request access.',
content:
'You do not have the required permissions to use the Sitewise Assistant. Please contact your administrator to request access.',
sender: 'assistant',
type: MessageType.ERROR,
id: crypto.randomUUID(),
loading: false,
payload: {
accessDeniedException: {
name: 'accessDeniedException',
message: 'You do not have the required permissions to use the Sitewise Assistant. Please contact your administrator to request access.',
}
}
}
message:
'You do not have the required permissions to use the Sitewise Assistant. Please contact your administrator to request access.',
},
},
},
];

return (
Expand All @@ -156,4 +150,4 @@ export const ErrorState: ComponentStory<
/>
</div>
);
};
};
Original file line number Diff line number Diff line change
@@ -1,11 +1,9 @@
import { useEffect } from 'react';
// eslint-disable-next-line import/default
import { Gauge, useAssistant} from '@iot-app-kit/react-components';
import {
mockSinWaveDataWithQuality,
} from '@iot-app-kit/testing-util';
import { type Meta, type StoryObj } from '@storybook/react';
import { IoTSitewiseAssistantClient } from '@iot-app-kit/core-util';
import { Gauge, useAssistant } from '@iot-app-kit/react-components';
import { mockSinWaveDataWithQuality } from '@iot-app-kit/testing-util';
import { type Meta, type StoryObj } from '@storybook/react';
import { MockInvokeAssistant } from '../../mockAssistantAPI';

// More on how to set up stories at: https://storybook.js.org/docs/7.0/react/writing-stories/introduction
Expand Down Expand Up @@ -52,7 +50,7 @@ export const Assistant: Story = {
margin: '0 auto',
}}
>
<Gauge
<Gauge
{...props}
assistant={{
client,
Expand Down
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
import { useEffect } from 'react';
import { IoTSitewiseAssistantClient } from '@iot-app-kit/core-util';
import { KPI, useAssistant } from '@iot-app-kit/react-components';
import { mockAlarmData, mockSinWaveData } from '@iot-app-kit/testing-util';
import { IoTSitewiseAssistantClient } from '@iot-app-kit/core-util';
import { type Meta, type StoryObj } from '@storybook/react';
import { useEffect } from 'react';
import { MockInvokeAssistant } from '../../mockAssistantAPI';

// More on how to set up stories at: https://storybook.js.org/docs/7.0/react/writing-stories/introduction
Expand Down Expand Up @@ -84,10 +84,14 @@ export const Alarm: Story = {

return (
<div
style={{ width: '300px', height: '200px', border: '1px solid lightgrey' }}
style={{
width: '300px',
height: '200px',
border: '1px solid lightgrey',
}}
>
<KPI
{...props}
<KPI
{...props}
assistant={{
client,
enabled: true,
Expand All @@ -102,10 +106,10 @@ export const Alarm: Story = {
target: 'widget',
utterance:
'generate a summary and return the response in markdown format.',
context: getContextByComponent(event.sourceComponentId)
context: getContextByComponent(event.sourceComponentId),
});
}
}
},
}}
/>
</div>
Expand All @@ -122,4 +126,4 @@ export const Alarm: Story = {
secondaryFontSize: 12,
},
},
};
};
Original file line number Diff line number Diff line change
@@ -1,10 +1,14 @@
import { useEffect } from 'react';
import { Table, useAssistant, AssistantChatbot } from '@iot-app-kit/react-components';
import Button from '@cloudscape-design/components/button';
import { mockAlarmData } from '@iot-app-kit/testing-util';
import { DATA_TYPE } from '@iot-app-kit/core';
import { IoTSitewiseAssistantClient } from '@iot-app-kit/core-util';
import {
AssistantChatbot,
Table,
useAssistant,
} from '@iot-app-kit/react-components';
import { mockAlarmData } from '@iot-app-kit/testing-util';
import { type Meta, type StoryObj } from '@storybook/react';
import { useEffect } from 'react';
import { MockInvokeAssistant } from '../../mockAssistantAPI';

const meta: Meta<typeof Table> = {
Expand Down Expand Up @@ -71,34 +75,38 @@ export const Assistant: Story = {
componentId,
conversationId: 'mockConversationId',
target: 'dashboard',
onAction:(event) => {
onAction: (event) => {
if (event.type === 'selection') {
console.log('onAction', event);
}
}
},
}}
/>
<br />
<Button onClick={() => {
clearAll();
generateSummary({
componentId,
conversationId: crypto.randomUUID(),
target: 'widget',
utterance:
'generate a summary and return the response in markdown format.',
});
}}>Generate Summary</Button>
<Button
onClick={() => {
clearAll();
generateSummary({
componentId,
conversationId: crypto.randomUUID(),
target: 'widget',
utterance:
'generate a summary and return the response in markdown format.',
});
}}
>
Generate Summary
</Button>
<br />
{messages.length > 0 ? (
<AssistantChatbot
height={500}
messages={messages}
onSubmit={() => {}}
/>
): null }
) : null}
</div>
)
);
},
args: {
queries: [mockAlarmData()],
Expand Down
Loading