@blocklet/pages-kit 0.2.358 → 0.2.359

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -6,7 +6,7 @@ import { useRuntimeState } from '../state/runtime';
6
6
  function useCurrentAid({ agentId }) {
7
7
  const { aid } = useRuntimeState();
8
8
  return useMemo(() => ({
9
- aid: stringifyIdentity(Object.assign(Object.assign({}, parseIdentity(aid, { rejectWhenError: true })), { assistantId: agentId })),
9
+ aid: stringifyIdentity(Object.assign(Object.assign({}, parseIdentity(aid, { rejectWhenError: true })), { agentId })),
10
10
  }), [aid, agentId]);
11
11
  }
12
12
  const context = createContext(undefined);
@@ -18,7 +18,7 @@ export function useCurrentAgent(args = {}) {
18
18
  const { blockletDid, aid: runtimeAid, working } = useRuntimeState();
19
19
  const aidFromParam = useMemo(() => args.aid ||
20
20
  (args.agentId
21
- ? stringifyIdentity(Object.assign(Object.assign({}, parseIdentity(runtimeAid, { rejectWhenError: true })), { assistantId: args.agentId }))
21
+ ? stringifyIdentity(Object.assign(Object.assign({}, parseIdentity(runtimeAid, { rejectWhenError: true })), { agentId: args.agentId }))
22
22
  : undefined), [args.agentId, args.aid, runtimeAid]);
23
23
  const current = useContext(context);
24
24
  const aid = aidFromParam !== null && aidFromParam !== void 0 ? aidFromParam : current === null || current === void 0 ? void 0 : current.aid;
@@ -10,18 +10,25 @@ export default function useAppearances(args) {
10
10
  const { agent: runtimeAgent } = useRuntimeState();
11
11
  const { agent } = useCurrentAgent(args);
12
12
  const appearancePage = useMemo(() => {
13
- var _a, _b;
13
+ var _a, _b, _c, _d;
14
14
  const appearance = (_b = (_a = agent.outputVariables) === null || _a === void 0 ? void 0 : _a.find((i) => i.name === RuntimeOutputVariable.appearancePage)) === null || _b === void 0 ? void 0 : _b.appearance;
15
- return Object.assign(Object.assign({}, appearance), { componentId: (appearance === null || appearance === void 0 ? void 0 : appearance.componentId) || DEFAULT_PAGE_COMPONENT_ID });
15
+ if (appearance === null || appearance === void 0 ? void 0 : appearance.componentId)
16
+ return Object.assign(Object.assign({}, appearance), { componentId: appearance.componentId });
17
+ const runtimeAppearance = (_d = (_c = runtimeAgent.outputVariables) === null || _c === void 0 ? void 0 : _c.find((i) => i.name === RuntimeOutputVariable.appearancePage)) === null || _d === void 0 ? void 0 : _d.appearance;
18
+ if (runtimeAppearance === null || runtimeAppearance === void 0 ? void 0 : runtimeAppearance.componentId)
19
+ return Object.assign(Object.assign({}, runtimeAppearance), { componentId: runtimeAppearance.componentId });
20
+ return {
21
+ componentId: DEFAULT_PAGE_COMPONENT_ID,
22
+ };
16
23
  }, [agent]);
17
24
  const appearanceInput = useMemo(() => {
18
25
  var _a, _b, _c, _d;
19
26
  const appearance = (_b = (_a = agent.outputVariables) === null || _a === void 0 ? void 0 : _a.find((i) => i.name === RuntimeOutputVariable.appearanceInput)) === null || _b === void 0 ? void 0 : _b.appearance;
20
- if (appearance)
21
- return appearance;
27
+ if (appearance === null || appearance === void 0 ? void 0 : appearance.componentId)
28
+ return Object.assign(Object.assign({}, appearance), { componentId: appearance.componentId });
22
29
  const runtimeAppearance = (_d = (_c = runtimeAgent.outputVariables) === null || _c === void 0 ? void 0 : _c.find((i) => i.name === RuntimeOutputVariable.appearanceInput)) === null || _d === void 0 ? void 0 : _d.appearance;
23
- if (runtimeAppearance)
24
- return runtimeAppearance;
30
+ if (runtimeAppearance === null || runtimeAppearance === void 0 ? void 0 : runtimeAppearance.componentId)
31
+ return Object.assign(Object.assign({}, runtimeAppearance), { componentId: runtimeAppearance.componentId });
25
32
  return {
26
33
  componentId: DEFAULT_INPUT_COMPONENT_ID,
27
34
  };
@@ -30,10 +37,10 @@ export default function useAppearances(args) {
30
37
  var _a, _b, _c, _d;
31
38
  const appearance = (_b = (_a = agent.outputVariables) === null || _a === void 0 ? void 0 : _a.find((i) => i.name === RuntimeOutputVariable.appearanceOutput)) === null || _b === void 0 ? void 0 : _b.appearance;
32
39
  if (appearance === null || appearance === void 0 ? void 0 : appearance.componentId)
33
- return appearance;
40
+ return Object.assign(Object.assign({}, appearance), { componentId: appearance.componentId });
34
41
  const runtimeAppearance = (_d = (_c = runtimeAgent.outputVariables) === null || _c === void 0 ? void 0 : _c.find((i) => i.name === RuntimeOutputVariable.appearanceOutput)) === null || _d === void 0 ? void 0 : _d.appearance;
35
- if (runtimeAppearance)
36
- return runtimeAppearance;
42
+ if (runtimeAppearance === null || runtimeAppearance === void 0 ? void 0 : runtimeAppearance.componentId)
43
+ return Object.assign(Object.assign({}, runtimeAppearance), { componentId: runtimeAppearance.componentId });
37
44
  return {
38
45
  componentId: DEFAULT_OUTPUT_COMPONENT_ID,
39
46
  };
@@ -15,18 +15,20 @@ import { useHeader } from '../../../page/header';
15
15
  import { settingsDialogState } from '../components/AgentSettings/AgentSettingsDialog';
16
16
  import PopperMenuButton from '../components/PopperMenuButton';
17
17
  import LoadingMenuItem from '../components/PopperMenuButton/LoadingMenuItem';
18
+ import SocialShare from '../components/SocialShare';
18
19
  import { useComponentPreferences } from '../contexts/ComponentPreferences';
19
20
  import { useRuntimeState } from '../state/runtime';
20
21
  import { useSessionState } from '../state/session';
21
22
  import { useIsAgentAdmin } from './use-agent-admin';
22
23
  export function useHeaderMenu() {
23
- var _a;
24
+ var _a, _b, _c;
24
25
  const { t, locale } = useLocaleContext();
25
26
  const { hideHeaderMenuButton } = (_a = useComponentPreferences()) !== null && _a !== void 0 ? _a : {};
26
27
  const clearSession = useSessionState((s) => s.clearSession);
27
28
  const { agent } = useRuntimeState();
28
29
  const isAdmin = useIsAgentAdmin(agent);
29
30
  const hasSettings = agent.config.secrets.length > 0;
31
+ const shareContent = ((_b = agent.project) === null || _b === void 0 ? void 0 : _b.name) ? `${agent.project.name}\n\n${(_c = agent.project) === null || _c === void 0 ? void 0 : _c.description}` : '';
30
32
  useHeader(() => hideHeaderMenuButton
31
33
  ? {}
32
34
  : {
@@ -35,6 +37,7 @@ export function useHeaderMenu() {
35
37
  hasSettings && isAdmin && (_jsxs(MenuItem, { onClick: () => settingsDialogState.getState().open(), children: [_jsx(ListItemIcon, { children: _jsx(Icon, { icon: "tabler:settings" }) }), t('settings')] }, "settings")),
36
38
  _jsxs(LoadingMenuItem, { onClick: () => __awaiter(this, void 0, void 0, function* () { return clearSession(); }), children: [_jsx(ListItemIcon, { children: _jsx(Icon, { icon: "mingcute:broom-line" }) }), t('clearSession')] }, "clearSession"),
37
39
  ], children: _jsx(Icon, { icon: "tabler:dots" }) }),
40
+ _jsx(SocialShare, { content: shareContent }),
38
41
  ...exists,
39
42
  ],
40
43
  }, [locale, hideHeaderMenuButton]);
@@ -1,65 +1,21 @@
1
- import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { Box, useMediaQuery, useTheme } from '@mui/material';
1
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
3
2
  import { Helmet } from 'react-helmet';
4
- import { joinURL } from 'ufo';
5
3
  import CustomComponentRenderer from '../../../../../components/CustomComponentRenderer';
6
- import { Avatar, DID } from '../../../../arcblock/ux';
7
- import { useLocaleContext } from '../../../../locale';
8
- import { useHeader } from '../../../../page/header';
9
- import { getComponentMountPoint } from '../../../../utils';
10
4
  import AgentSettingsDialog from '../../components/AgentSettings/AgentSettingsDialog';
11
- import RuntimeCommonProvider, { RuntimeLocaleProvider } from '../../components/RuntimeCommonProvider';
12
- import SocialShare from '../../components/SocialShare';
5
+ import RuntimeCommonProvider from '../../components/RuntimeCommonProvider';
13
6
  import ThemeProvider from '../../components/ThemeProvider';
14
- import { AI_STUDIO_DID, DEFAULT_PAGE_COMPONENT_ID } from '../../constants';
15
7
  import ActiveAgentProvider from '../../contexts/ActiveAgent';
16
8
  import RuntimeProvider, { RuntimeProviderFromUrl } from '../../contexts/Runtime';
17
9
  import useAppearances from '../../hooks/use-appearances';
18
10
  import { useHeaderMenu } from '../../hooks/use-header-menu';
19
11
  import { useRuntimeState } from '../../state/runtime';
20
- const logoSize = 44;
21
- function AgentCreatedBy({ did }) {
22
- const { t } = useLocaleContext();
23
- return (_jsxs(_Fragment, { children: [t('by'), " ", _jsx(Box, { component: DID, did: did, copyable: false, responsive: true })] }));
24
- }
25
12
  export default function Runtime({ blockletDid, aid, working, }) {
26
13
  const children = (_jsx(ThemeProvider, { children: _jsx(ActiveAgentProvider, { children: _jsx(RuntimeView, {}) }) }));
27
14
  return (_jsx(RuntimeCommonProvider, { children: aid ? (_jsx(RuntimeProvider, { blockletDid: blockletDid, aid: aid, working: working, children: children })) : (_jsx(RuntimeProviderFromUrl, { children: children })) }));
28
15
  }
29
16
  function RuntimeView() {
30
- var _a;
31
17
  const { aid, agent } = useRuntimeState();
32
18
  const { appearancePage } = useAppearances({ aid });
33
- const theme = useTheme();
34
- const isMobile = useMediaQuery(theme.breakpoints.down('sm'));
35
- const { locale } = useLocaleContext();
36
- useHeader(() => {
37
- const logo = joinURL(window.location.origin, getComponentMountPoint(AI_STUDIO_DID), '/api/projects', agent.project.id, '/logo.png');
38
- const shareContent = `${agent.name}
39
-
40
- ${agent === null || agent === void 0 ? void 0 : agent.description}
41
- `;
42
- return {
43
- logo: logo && (_jsx(Box, { component: Avatar, src: logo, did: blocklet === null || blocklet === void 0 ? void 0 : blocklet.appId, borderRadius: 1, size: logoSize, sx: {
44
- width: logoSize,
45
- height: logoSize,
46
- } })),
47
- brand: !isMobile ? (_jsx(Box, { sx: {
48
- height: 18,
49
- fontSize: 18,
50
- }, children: agent.project.name })) : undefined,
51
- description: !isMobile && agent.createdBy ? (_jsx(RuntimeLocaleProvider, { children: _jsx(Box, { sx: {
52
- display: 'inline-flex',
53
- alignItems: 'center',
54
- gap: 0.5,
55
- mt: 0.5,
56
- height: 12,
57
- fontSize: 12,
58
- }, children: _jsx(AgentCreatedBy, { did: agent.project.createdBy }) }) })) : undefined,
59
- addons: (exists) => [_jsx(SocialShare, { content: shareContent }), ...exists].filter(Boolean),
60
- };
61
- }, [locale, isMobile, agent]);
62
19
  useHeaderMenu();
63
- const componentId = (_a = appearancePage === null || appearancePage === void 0 ? void 0 : appearancePage.componentId) !== null && _a !== void 0 ? _a : DEFAULT_PAGE_COMPONENT_ID;
64
- return (_jsxs(_Fragment, { children: [_jsxs(Helmet, { children: [agent.project.name && _jsx("title", { children: agent.project.name }), agent.project.description && _jsx("meta", { name: "description", content: agent.project.description })] }), _jsx(CustomComponentRenderer, { componentId: componentId, properties: appearancePage === null || appearancePage === void 0 ? void 0 : appearancePage.componentProperties }), _jsx(AgentSettingsDialog, {})] }));
20
+ return (_jsxs(_Fragment, { children: [_jsxs(Helmet, { children: [agent.project.name && _jsx("title", { children: agent.project.name }), agent.project.description && _jsx("meta", { name: "description", content: agent.project.description })] }), _jsx(CustomComponentRenderer, { componentId: appearancePage.componentId, properties: appearancePage.componentProperties }), _jsx(AgentSettingsDialog, {})] }));
65
21
  }
@@ -268,6 +268,7 @@ export const createSessionState = ({ aid }) => {
268
268
  parameters: Object.assign(Object.assign({}, parameters), { $clientTime: new Date().toISOString() }),
269
269
  });
270
270
  let responseStarted = false;
271
+ let mainTaskId;
271
272
  try {
272
273
  for (var _e = true, stream_1 = __asyncValues(stream), stream_1_1; stream_1_1 = yield stream_1.next(), _b = stream_1_1.done, !_b; _e = true) {
273
274
  _d = stream_1_1.value;
@@ -279,9 +280,10 @@ export const createSessionState = ({ aid }) => {
279
280
  }
280
281
  if ((value === null || value === void 0 ? void 0 : value.type) === 'CHUNK') {
281
282
  if (!message) {
283
+ mainTaskId = value.taskId;
282
284
  message = {
283
- id: value.taskId,
284
- agentId: identity.assistantId,
285
+ id: value.messageId,
286
+ agentId: identity.agentId,
285
287
  sessionId,
286
288
  inputs: parameters,
287
289
  createdAt: new Date().toISOString(),
@@ -297,7 +299,7 @@ export const createSessionState = ({ aid }) => {
297
299
  s.messages.push(message);
298
300
  });
299
301
  }
300
- if (message.id === value.taskId) {
302
+ if (mainTaskId === value.taskId) {
301
303
  requestAnimationFrame(() => {
302
304
  set((state) => {
303
305
  var _a, _b, _c, _d;