@servicetitan/titan-chatbot-ui 4.3.2 → 4.4.0
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/CHANGELOG.md +12 -0
- package/dist/components/chatbot/filters/chatbot-filter.d.ts +2 -2
- package/dist/components/chatbot/filters/chatbot-filter.d.ts.map +1 -1
- package/dist/components/chatbot/filters/chatbot-filter.js +22 -15
- package/dist/components/chatbot/filters/chatbot-filter.js.map +1 -1
- package/dist/components/chatbot/filters/chatbot-filter.module.css +5 -0
- package/dist/components/chatbot/filters/chatbot-filters.js +1 -1
- package/package.json +6 -6
- package/src/components/chatbot/filters/chatbot-filter.module.css +5 -0
- package/src/components/chatbot/filters/chatbot-filter.module.css.d.ts +2 -0
- package/src/components/chatbot/filters/chatbot-filter.tsx +31 -22
- package/src/components/chatbot/filters/chatbot-filters.tsx +1 -1
- package/tsconfig.tsbuildinfo +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,15 @@
|
|
|
1
|
+
# v4.4.0 (Thu Oct 23 2025)
|
|
2
|
+
|
|
3
|
+
#### 🚀 Enhancement
|
|
4
|
+
|
|
5
|
+
- SPA-7397: Filters changed from hiding to disabling inactive ones [#67](https://github.com/servicetitan/titan-chatbot-client/pull/67) ([@AlexYarmolchuk](https://github.com/AlexYarmolchuk))
|
|
6
|
+
|
|
7
|
+
#### Authors: 1
|
|
8
|
+
|
|
9
|
+
- Alexandr Yarmolchuk ([@AlexYarmolchuk](https://github.com/AlexYarmolchuk))
|
|
10
|
+
|
|
11
|
+
---
|
|
12
|
+
|
|
1
13
|
# v4.3.1 (Fri Oct 17 2025)
|
|
2
14
|
|
|
3
15
|
#### 🐛 Bug Fix
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { IUiFilterOption } from '@servicetitan/titan-chatbot-api';
|
|
2
2
|
import { FC } from 'react';
|
|
3
3
|
interface IChatFilterProps {
|
|
4
|
-
filter:
|
|
4
|
+
filter: IUiFilterOption;
|
|
5
5
|
}
|
|
6
6
|
export declare const ChatFilter: FC<IChatFilterProps>;
|
|
7
7
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chatbot-filter.d.ts","sourceRoot":"","sources":["../../../../src/components/chatbot/filters/chatbot-filter.tsx"],"names":[],"mappings":"AAUA,OAAO,EAA0B,
|
|
1
|
+
{"version":3,"file":"chatbot-filter.d.ts","sourceRoot":"","sources":["../../../../src/components/chatbot/filters/chatbot-filter.tsx"],"names":[],"mappings":"AAUA,OAAO,EAA0B,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAG1F,OAAO,EAAe,EAAE,EAAqD,MAAM,OAAO,CAAC;AAG3F,UAAU,gBAAgB;IACtB,MAAM,EAAE,eAAe,CAAC;CAC3B;AAED,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC,gBAAgB,CAoJ1C,CAAC"}
|
|
@@ -7,26 +7,30 @@ import { observer } from 'mobx-react';
|
|
|
7
7
|
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
|
8
8
|
import * as Style from './chatbot-filter.module.css';
|
|
9
9
|
export const ChatFilter = observer(({ filter }) => {
|
|
10
|
-
var _a, _b;
|
|
10
|
+
var _a, _b, _c, _d;
|
|
11
|
+
const triggerRef = useRef(null);
|
|
11
12
|
const [filterText, setFilterText] = useState('');
|
|
12
13
|
const [open, setOpen] = useState(false);
|
|
13
14
|
const [listMaxHeight, setListMaxHeight] = useState(400);
|
|
14
15
|
const [{ filterStore }] = useDependencies(CHATBOT_UI_STORE_TOKEN);
|
|
15
16
|
const filterLabel = filterStore.getFilterLabel((_a = filter.displayName) !== null && _a !== void 0 ? _a : filter.key).trim();
|
|
16
|
-
const
|
|
17
|
-
const
|
|
17
|
+
const selectedOptionsCount = (_c = (_b = filterStore.selected.get(filter.key)) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : 0;
|
|
18
|
+
const allFilterOptions = useMemo(() => filterStore.getFilterOptions(filter.key), [filterStore, filter.key]);
|
|
19
|
+
const allOptionsDisabled = allFilterOptions.every(opt => filterStore.isOptionDisabled(filter.key, opt.key));
|
|
20
|
+
const filteredOptions = allFilterOptions
|
|
21
|
+
.filter(opt => {
|
|
18
22
|
var _a, _b;
|
|
19
|
-
return ((
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
}
|
|
23
|
+
return ((_a = opt.displayName) !== null && _a !== void 0 ? _a : opt.key) &&
|
|
24
|
+
((_b = opt.displayName) !== null && _b !== void 0 ? _b : opt.key).toLowerCase().indexOf(filterText.toLowerCase()) > -1;
|
|
25
|
+
})
|
|
26
|
+
.map(opt => {
|
|
27
|
+
var _a;
|
|
28
|
+
return ({
|
|
29
|
+
text: filterStore.getFilterLabel((_a = opt.displayName) !== null && _a !== void 0 ? _a : opt.key),
|
|
30
|
+
value: opt.key,
|
|
31
|
+
disabled: filterStore.isOptionDisabled(filter.key, opt.key),
|
|
32
|
+
});
|
|
33
|
+
});
|
|
30
34
|
useEffect(() => {
|
|
31
35
|
if (triggerRef.current) {
|
|
32
36
|
const triggerElement = triggerRef.current;
|
|
@@ -36,6 +40,9 @@ export const ChatFilter = observer(({ filter }) => {
|
|
|
36
40
|
}
|
|
37
41
|
}, []);
|
|
38
42
|
const handleToggle = () => {
|
|
43
|
+
if (allOptionsDisabled) {
|
|
44
|
+
return;
|
|
45
|
+
}
|
|
39
46
|
setOpen(prev => !prev);
|
|
40
47
|
};
|
|
41
48
|
const handleCancel = () => {
|
|
@@ -56,6 +63,6 @@ export const ChatFilter = observer(({ filter }) => {
|
|
|
56
63
|
filterStore.selectAll(filter.key);
|
|
57
64
|
}, className: Style.filterBottomButton, "data-cy": "titan-chatbot-filter-all", children: "All" }), _jsx(Button, { fill: "subtle", primary: true, xsmall: true, onClick: () => {
|
|
58
65
|
filterStore.deselectAll(filter.key);
|
|
59
|
-
}, className: Style.filterBottomButton, "data-cy": "titan-chatbot-filter-none", children: "None" })] }), trigger: _jsx(FilterButton, { ref: triggerRef, onClick: handleToggle, value:
|
|
66
|
+
}, className: Style.filterBottomButton, "data-cy": "titan-chatbot-filter-none", children: "None" })] }), trigger: _jsx(FilterButton, { ref: triggerRef, onClick: handleToggle, value: selectedOptionsCount, label: filterLabel, expandIcon: open, disabled: allOptionsDisabled, "data-cy": "titan-chatbot-filter-button" }), children: allFilterOptions.length > 0 ? (_jsx(OptionList, { multiple: true, options: filteredOptions, onChange: handleItemChecked, value: (_d = filterStore.selected.get(filter.key)) !== null && _d !== void 0 ? _d : [], "data-cy": "titan-chatbot-filter-options" })) : (_jsx(BodyText, { className: "ta-center", size: "small", subdued: true, children: "No items available" })) }));
|
|
60
67
|
});
|
|
61
68
|
//# sourceMappingURL=chatbot-filter.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chatbot-filter.js","sourceRoot":"","sources":["../../../../src/components/chatbot/filters/chatbot-filter.tsx"],"names":[],"mappings":";AAAA,OAAO,EACH,QAAQ,EACR,MAAM,EACN,YAAY,EACZ,KAAK,EACL,UAAU,EACV,OAAO,EACP,KAAK,GACR,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,sBAAsB,
|
|
1
|
+
{"version":3,"file":"chatbot-filter.js","sourceRoot":"","sources":["../../../../src/components/chatbot/filters/chatbot-filter.tsx"],"names":[],"mappings":"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"}
|
|
@@ -6,6 +6,6 @@ import { observer } from 'mobx-react';
|
|
|
6
6
|
import { ChatFilter } from './chatbot-filter';
|
|
7
7
|
export const ChatFilters = observer(({ className }) => {
|
|
8
8
|
const [{ filterStore }] = useDependencies(CHATBOT_UI_STORE_TOKEN);
|
|
9
|
-
return filterStore.filters.length > 0 ? (_jsx(Stack, { className: className, spacing: "1", "data-cy": "titan-chatbot-filters", children: filterStore.filters.map(filter => (_jsx(ChatFilter, { filter: filter }, filter.
|
|
9
|
+
return filterStore.filters.length > 0 ? (_jsx(Stack, { className: className, spacing: "1", "data-cy": "titan-chatbot-filters", children: filterStore.filters.map(filter => (_jsx(ChatFilter, { filter: filter }, filter.uid))) })) : null;
|
|
10
10
|
});
|
|
11
11
|
//# sourceMappingURL=chatbot-filters.js.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@servicetitan/titan-chatbot-ui",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.4.0",
|
|
4
4
|
"description": "Chatbot experience UI package",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -17,9 +17,9 @@
|
|
|
17
17
|
"push:local": "yalc push"
|
|
18
18
|
},
|
|
19
19
|
"dependencies": {
|
|
20
|
-
"@servicetitan/titan-chat-ui": "^4.
|
|
21
|
-
"@servicetitan/titan-chat-ui-common": "^4.
|
|
22
|
-
"@servicetitan/titan-chatbot-api": "^4.
|
|
20
|
+
"@servicetitan/titan-chat-ui": "^4.4.0",
|
|
21
|
+
"@servicetitan/titan-chat-ui-common": "^4.4.0",
|
|
22
|
+
"@servicetitan/titan-chatbot-api": "^4.4.0",
|
|
23
23
|
"nanoid": "^5.1.5"
|
|
24
24
|
},
|
|
25
25
|
"peerDependencies": {
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
"react-dom": ">=18"
|
|
41
41
|
},
|
|
42
42
|
"devDependencies": {
|
|
43
|
-
"@servicetitan/cypress-shared": "^4.
|
|
43
|
+
"@servicetitan/cypress-shared": "^4.4.0",
|
|
44
44
|
"cypress": "^15.2.0"
|
|
45
45
|
},
|
|
46
46
|
"keywords": [
|
|
@@ -53,5 +53,5 @@
|
|
|
53
53
|
"cli": {
|
|
54
54
|
"webpack": false
|
|
55
55
|
},
|
|
56
|
-
"gitHead": "
|
|
56
|
+
"gitHead": "b4dbc388479b90931319b63bb222da62d5b0df72"
|
|
57
57
|
}
|
|
@@ -8,40 +8,46 @@ import {
|
|
|
8
8
|
Stack,
|
|
9
9
|
} from '@servicetitan/design-system';
|
|
10
10
|
import { useDependencies } from '@servicetitan/react-ioc';
|
|
11
|
-
import { CHATBOT_UI_STORE_TOKEN,
|
|
11
|
+
import { CHATBOT_UI_STORE_TOKEN, IUiFilterOption } from '@servicetitan/titan-chatbot-api';
|
|
12
12
|
import classNames from 'classnames';
|
|
13
13
|
import { observer } from 'mobx-react';
|
|
14
14
|
import { ChangeEvent, FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
|
15
15
|
import * as Style from './chatbot-filter.module.css';
|
|
16
16
|
|
|
17
17
|
interface IChatFilterProps {
|
|
18
|
-
filter:
|
|
18
|
+
filter: IUiFilterOption;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
21
|
export const ChatFilter: FC<IChatFilterProps> = observer(({ filter }: IChatFilterProps) => {
|
|
22
|
+
const triggerRef = useRef<HTMLButtonElement>(null);
|
|
22
23
|
const [filterText, setFilterText] = useState('');
|
|
23
24
|
const [open, setOpen] = useState(false);
|
|
24
25
|
const [listMaxHeight, setListMaxHeight] = useState(400);
|
|
25
26
|
const [{ filterStore }] = useDependencies(CHATBOT_UI_STORE_TOKEN);
|
|
26
27
|
const filterLabel = filterStore.getFilterLabel(filter.displayName ?? filter.key).trim();
|
|
27
|
-
const triggerRef = useRef<HTMLDivElement>(null);
|
|
28
28
|
|
|
29
|
-
const
|
|
30
|
-
return (
|
|
31
|
-
filter.subOptions?.map(filterSelectable => ({
|
|
32
|
-
text: filterStore.getFilterLabel(
|
|
33
|
-
filterSelectable.displayName ?? filterSelectable.key
|
|
34
|
-
),
|
|
35
|
-
value: filterSelectable.key,
|
|
36
|
-
})) ?? []
|
|
37
|
-
);
|
|
38
|
-
}, [filterStore, filter.subOptions]);
|
|
29
|
+
const selectedOptionsCount = filterStore.selected.get(filter.key)?.length ?? 0;
|
|
39
30
|
|
|
40
|
-
const
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
31
|
+
const allFilterOptions = useMemo(
|
|
32
|
+
() => filterStore.getFilterOptions(filter.key),
|
|
33
|
+
[filterStore, filter.key]
|
|
34
|
+
);
|
|
35
|
+
|
|
36
|
+
const allOptionsDisabled = allFilterOptions.every(opt =>
|
|
37
|
+
filterStore.isOptionDisabled(filter.key, opt.key)
|
|
38
|
+
);
|
|
39
|
+
|
|
40
|
+
const filteredOptions = allFilterOptions
|
|
41
|
+
.filter(
|
|
42
|
+
opt =>
|
|
43
|
+
(opt.displayName ?? opt.key) &&
|
|
44
|
+
(opt.displayName ?? opt.key).toLowerCase().indexOf(filterText.toLowerCase()) > -1
|
|
45
|
+
)
|
|
46
|
+
.map(opt => ({
|
|
47
|
+
text: filterStore.getFilterLabel(opt.displayName ?? opt.key),
|
|
48
|
+
value: opt.key,
|
|
49
|
+
disabled: filterStore.isOptionDisabled(filter.key, opt.key),
|
|
50
|
+
}));
|
|
45
51
|
|
|
46
52
|
useEffect(() => {
|
|
47
53
|
if (triggerRef.current) {
|
|
@@ -53,6 +59,9 @@ export const ChatFilter: FC<IChatFilterProps> = observer(({ filter }: IChatFilte
|
|
|
53
59
|
}, []);
|
|
54
60
|
|
|
55
61
|
const handleToggle = () => {
|
|
62
|
+
if (allOptionsDisabled) {
|
|
63
|
+
return;
|
|
64
|
+
}
|
|
56
65
|
setOpen(prev => !prev);
|
|
57
66
|
};
|
|
58
67
|
|
|
@@ -134,20 +143,20 @@ export const ChatFilter: FC<IChatFilterProps> = observer(({ filter }: IChatFilte
|
|
|
134
143
|
<FilterButton
|
|
135
144
|
ref={triggerRef}
|
|
136
145
|
onClick={handleToggle}
|
|
137
|
-
value={
|
|
146
|
+
value={selectedOptionsCount}
|
|
138
147
|
label={filterLabel}
|
|
139
148
|
expandIcon={open}
|
|
140
|
-
disabled={
|
|
149
|
+
disabled={allOptionsDisabled}
|
|
141
150
|
data-cy="titan-chatbot-filter-button"
|
|
142
151
|
/>
|
|
143
152
|
}
|
|
144
153
|
>
|
|
145
|
-
{
|
|
154
|
+
{allFilterOptions.length > 0 ? (
|
|
146
155
|
<OptionList
|
|
147
156
|
multiple
|
|
148
157
|
options={filteredOptions}
|
|
149
158
|
onChange={handleItemChecked}
|
|
150
|
-
value={filterStore.
|
|
159
|
+
value={filterStore.selected.get(filter.key) ?? []}
|
|
151
160
|
data-cy="titan-chatbot-filter-options"
|
|
152
161
|
/>
|
|
153
162
|
) : (
|
|
@@ -10,7 +10,7 @@ export const ChatFilters: FC<{ className?: string }> = observer(({ className })
|
|
|
10
10
|
return filterStore.filters.length > 0 ? (
|
|
11
11
|
<Stack className={className} spacing="1" data-cy="titan-chatbot-filters">
|
|
12
12
|
{filterStore.filters.map(filter => (
|
|
13
|
-
<ChatFilter key={filter.
|
|
13
|
+
<ChatFilter key={filter.uid} filter={filter} />
|
|
14
14
|
))}
|
|
15
15
|
</Stack>
|
|
16
16
|
) : null;
|