diff options
Diffstat (limited to 'src/components/services/tabs/TabBarSortableList.js')
-rw-r--r-- | src/components/services/tabs/TabBarSortableList.js | 44 |
1 files changed, 44 insertions, 0 deletions
diff --git a/src/components/services/tabs/TabBarSortableList.js b/src/components/services/tabs/TabBarSortableList.js new file mode 100644 index 000000000..c0a68d1a5 --- /dev/null +++ b/src/components/services/tabs/TabBarSortableList.js | |||
@@ -0,0 +1,44 @@ | |||
1 | import React from 'react'; | ||
2 | import { observer } from 'mobx-react'; | ||
3 | import { SortableContainer } from 'react-sortable-hoc'; | ||
4 | |||
5 | import TabItem from './TabItem'; | ||
6 | import { ctrlKey } from '../../../environment'; | ||
7 | |||
8 | export default SortableContainer(observer(({ | ||
9 | services, | ||
10 | setActive, | ||
11 | reload, | ||
12 | toggleNotifications, | ||
13 | deleteService, | ||
14 | disableService, | ||
15 | openSettings, | ||
16 | }) => ( | ||
17 | <ul | ||
18 | className="tabs" | ||
19 | > | ||
20 | {services.map((service, index) => ( | ||
21 | <TabItem | ||
22 | key={service.id} | ||
23 | clickHandler={() => setActive({ serviceId: service.id })} | ||
24 | service={service} | ||
25 | index={index} | ||
26 | shortcutIndex={index + 1} | ||
27 | reload={() => reload({ serviceId: service.id })} | ||
28 | toggleNotifications={() => toggleNotifications({ serviceId: service.id })} | ||
29 | deleteService={() => deleteService({ serviceId: service.id })} | ||
30 | disableService={() => disableService({ serviceId: service.id })} | ||
31 | openSettings={openSettings} | ||
32 | /> | ||
33 | ))} | ||
34 | <li> | ||
35 | <button | ||
36 | className="sidebar__add-service" | ||
37 | onClick={() => openSettings({ path: 'recipes' })} | ||
38 | data-tip={`Add new service (${ctrlKey}+N)`} | ||
39 | > | ||
40 | <span className="mdi mdi-plus" /> | ||
41 | </button> | ||
42 | </li> | ||
43 | </ul> | ||
44 | ))); | ||