@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.
- package/lib/cjs/builtin/async/ai-runtime/contexts/CurrentAgent.js +2 -2
- package/lib/cjs/builtin/async/ai-runtime/hooks/use-appearances.js +16 -9
- package/lib/cjs/builtin/async/ai-runtime/hooks/use-header-menu.js +4 -1
- package/lib/cjs/builtin/async/ai-runtime/runtime/Runtime/index.js +2 -46
- package/lib/cjs/builtin/async/ai-runtime/state/session.js +5 -3
- package/lib/cjs/tsconfig.tsbuildinfo +1 -1
- package/lib/esm/builtin/async/ai-runtime/contexts/CurrentAgent.js +2 -2
- package/lib/esm/builtin/async/ai-runtime/hooks/use-appearances.js +16 -9
- package/lib/esm/builtin/async/ai-runtime/hooks/use-header-menu.js +4 -1
- package/lib/esm/builtin/async/ai-runtime/runtime/Runtime/index.js +3 -47
- package/lib/esm/builtin/async/ai-runtime/state/session.js +5 -3
- package/lib/esm/tsconfig.tsbuildinfo +1 -1
- package/lib/types/builtin/async/ai-runtime/hooks/use-appearances.d.ts +26 -2
- package/lib/types/tsconfig.tsbuildinfo +1 -1
- package/package.json +3 -3
|
@@ -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 })), {
|
|
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 })), {
|
|
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
|
-
|
|
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,
|
|
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
|
|
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
|
-
|
|
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.
|
|
284
|
-
agentId: identity.
|
|
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 (
|
|
302
|
+
if (mainTaskId === value.taskId) {
|
|
301
303
|
requestAnimationFrame(() => {
|
|
302
304
|
set((state) => {
|
|
303
305
|
var _a, _b, _c, _d;
|