cozy-search 2.6.2 → 2.7.0

package/dist/components/Conversations/Conversation.js

@@ -7,11 +7,21 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
 var _react = require("@assistant-ui/react");
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
-var _react2 = _interopRequireDefault(require("react"));
+var _react2 = _interopRequireWildcard(require("react"));
+
+var _Typography = _interopRequireDefault(require("cozy-ui/transpiled/react/Typography"));
+
+var _Breakpoints = require("cozy-ui/transpiled/react/providers/Breakpoints");
+
+var _CozyTheme = require("cozy-ui/transpiled/react/providers/CozyTheme");
 
 var _twakeI18n = require("twake-i18n");
 
@@ -21,12 +31,26 @@ var _AssistantMessage = _interopRequireDefault(require("../Messages/AssistantMes
 
 var _UserMessage = _interopRequireDefault(require("../Messages/UserMessage"));
 
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 var styles = {
   "composerContainer": "styles__composerContainer___3bNfY",
+  "composerContainer--mobile": "styles__composerContainer--mobile___nIYa-",
+  "composerContainer--mobile-dark": "styles__composerContainer--mobile-dark___12Go9",
+  "composer-dock": "styles__composer-dock___2nPT8",
   "composerActions": "styles__composerActions___2xQEH",
+  "welcome": "styles__welcome___ozY_t",
+  "welcome-halo": "styles__welcome-halo___3jlz_",
+  "welcome-halo--dark": "styles__welcome-halo--dark___fV9pN",
+  "welcome-title": "styles__welcome-title___sBOKX",
   "conversationBar": "styles__conversationBar___2J-Us",
   "conversationBar--mobile": "styles__conversationBar--mobile___1jdg8",
+  "viewport-fade-top": "styles__viewport-fade-top___3j8Lv",
+  "viewport-fade-top--visible": "styles__viewport-fade-top--visible___32uyl",
   "conversationViewport": "styles__conversationViewport___24jYX",
+  "conversationViewport--filled": "styles__conversationViewport--filled___T2QFN",
   "conversationBar-input": "styles__conversationBar-input___2DfdZ",
   "chatConversation": "styles__chatConversation___2EmkA",
   "conversationHeaderBar": "styles__conversationHeaderBar___C8tlD",
@@ -45,37 +69,66 @@ var styles = {
   "cozyThread-messageContent": "styles__cozyThread-messageContent___2HjdB",
   "conversation-list-item": "styles__conversation-list-item___rQapI",
   "conversation-list-item-action": "styles__conversation-list-item-action___qiuKm",
-  "conversation-list-item--selected--light": "styles__conversation-list-item--selected--light___3WvIn",
-  "conversation-list-item--selected--dark": "styles__conversation-list-item--selected--dark___JDQlY",
+  "conversation-list-item--selected": "styles__conversation-list-item--selected___2D5_3",
   "conversation-list-item--wider": "styles__conversation-list-item--wider___2Tl2c",
-  "conversation-list-item-divider": "styles__conversation-list-item-divider___2LOP1",
   "conversation-list-item-text": "styles__conversation-list-item-text___31VBM",
   "conversation-list-item-title": "styles__conversation-list-item-title___3je_6",
-  "conversation-list-item-meta": "styles__conversation-list-item-meta___3Zk-r",
-  "conversation-list-item-subtitle": "styles__conversation-list-item-subtitle___3e_h0"
+  "conversation-list-item-subtitle": "styles__conversation-list-item-subtitle___3e_h0",
+  "conversation-list-item-meta": "styles__conversation-list-item-meta___3Zk-r"
 };
 
 var Conversation = function Conversation(_ref) {
+  var _cx3;
+
   var className = _ref.className;
 
   var _useI18n = (0, _twakeI18n.useI18n)(),
       t = _useI18n.t;
 
+  var _useCozyTheme = (0, _CozyTheme.useCozyTheme)(),
+      isLight = _useCozyTheme.isLight;
+
+  var _useBreakpoints = (0, _Breakpoints.useBreakpoints)(),
+      isMobile = _useBreakpoints.isMobile;
+
   var isThreadEmpty = (0, _react.useThread)(function (state) {
     return state.messages.length === 0;
-  });
+  }); // On mobile the conversation scrolls under the sidebar bar: once it has,
+  // a fade below the bar dissolves the text instead of cutting it (at the
+  // top of the scroll, the first message sits clear of the bar).
+
+  var _useState = (0, _react2.useState)(false),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      isScrolled = _useState2[0],
+      setIsScrolled = _useState2[1];
+
   return /*#__PURE__*/_react2.default.createElement(_react.ThreadPrimitive.Root, {
-    className: (0, _classnames.default)('u-flex u-flex-column u-flex-items-center u-h-100', className, {
+    // The gutters: the messages and the composer are centered up to a max
+    // width, and keep a margin from the edges when the screen is narrower
+    className: (0, _classnames.default)('u-flex u-flex-column u-flex-items-center u-h-100 u-bxz u-pos-relative', isMobile ? 'u-ph-1' : 'u-ph-2', className, {
       'u-flex-justify-between': !isThreadEmpty,
       'u-flex-justify-center': isThreadEmpty
     })
-  }, /*#__PURE__*/_react2.default.createElement(_react.ThreadPrimitive.Empty, null, /*#__PURE__*/_react2.default.createElement("h2", {
-    className: "u-w-100 u-maw-7 u-mh-auto u-mb-3 u-fw-normal u-ta-center"
-  }, t('assistant.message.welcome'))), /*#__PURE__*/_react2.default.createElement(_react.ThreadPrimitive.Viewport, {
+  }, /*#__PURE__*/_react2.default.createElement(_react.ThreadPrimitive.Empty, null, /*#__PURE__*/_react2.default.createElement("div", {
+    className: (0, _classnames.default)('u-pos-relative u-w-100 u-maw-7 u-mh-auto u-mb-3 u-flex u-flex-items-center u-flex-justify-center', styles['welcome'])
+  }, /*#__PURE__*/_react2.default.createElement("div", {
+    "aria-hidden": "true",
+    className: (0, _classnames.default)(styles['welcome-halo'], (0, _defineProperty2.default)({}, styles['welcome-halo--dark'], !isLight))
+  }), /*#__PURE__*/_react2.default.createElement(_Typography.default, {
+    variant: "h3",
+    component: "h2",
+    className: (0, _classnames.default)('u-pos-relative u-fw-normal u-ta-center', styles['welcome-title'])
+  }, t('assistant.message.welcome')))), isMobile && !isThreadEmpty && /*#__PURE__*/_react2.default.createElement("div", {
+    "aria-hidden": "true",
+    className: (0, _classnames.default)(styles['viewport-fade-top'], (0, _defineProperty2.default)({}, styles['viewport-fade-top--visible'], isScrolled))
+  }), /*#__PURE__*/_react2.default.createElement(_react.ThreadPrimitive.Viewport, {
     autoScroll: true,
-    className: (0, _classnames.default)('u-w-100 u-bxz u-ov-auto u-mb-1', styles.conversationViewport, {
+    onScroll: function onScroll(event) {
+      return setIsScrolled(event.currentTarget.scrollTop > 0);
+    },
+    className: (0, _classnames.default)('u-w-100 u-bxz u-ov-auto', styles.conversationViewport, (_cx3 = {
       'u-flex-auto': !isThreadEmpty
-    })
+    }, (0, _defineProperty2.default)(_cx3, styles['conversationViewport--filled'], !isThreadEmpty), (0, _defineProperty2.default)(_cx3, 'u-mb-1', isThreadEmpty), _cx3))
   }, /*#__PURE__*/_react2.default.createElement("div", {
     className: "u-maw-7 u-mh-auto"
   }, /*#__PURE__*/_react2.default.createElement(_react.ThreadPrimitive.Messages, {
@@ -83,7 +136,14 @@ var Conversation = function Conversation(_ref) {
       UserMessage: _UserMessage.default,
       AssistantMessage: _AssistantMessage.default
     }
-  }))), /*#__PURE__*/_react2.default.createElement(_ConversationComposer.default, null));
+  }))), /*#__PURE__*/_react2.default.createElement("div", {
+    className: (0, _classnames.default)('u-w-100', (0, _defineProperty2.default)({}, styles['composer-dock'], !isThreadEmpty))
+  }, /*#__PURE__*/_react2.default.createElement(_ConversationComposer.default, null), /*#__PURE__*/_react2.default.createElement(_Typography.default, {
+    variant: "caption",
+    color: "textSecondary",
+    component: "p",
+    className: "u-w-100 u-maw-7 u-mh-auto u-mt-half u-mb-0 u-ta-center"
+  }, t('assistant.disclaimer'))));
 };
 
 var _default = Conversation;

package/dist/components/Conversations/ConversationBar.js

@@ -35,10 +35,20 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 var styles = {
   "composerContainer": "styles__composerContainer___3bNfY",
+  "composerContainer--mobile": "styles__composerContainer--mobile___nIYa-",
+  "composerContainer--mobile-dark": "styles__composerContainer--mobile-dark___12Go9",
+  "composer-dock": "styles__composer-dock___2nPT8",
   "composerActions": "styles__composerActions___2xQEH",
+  "welcome": "styles__welcome___ozY_t",
+  "welcome-halo": "styles__welcome-halo___3jlz_",
+  "welcome-halo--dark": "styles__welcome-halo--dark___fV9pN",
+  "welcome-title": "styles__welcome-title___sBOKX",
   "conversationBar": "styles__conversationBar___2J-Us",
   "conversationBar--mobile": "styles__conversationBar--mobile___1jdg8",
+  "viewport-fade-top": "styles__viewport-fade-top___3j8Lv",
+  "viewport-fade-top--visible": "styles__viewport-fade-top--visible___32uyl",
   "conversationViewport": "styles__conversationViewport___24jYX",
+  "conversationViewport--filled": "styles__conversationViewport--filled___T2QFN",
   "conversationBar-input": "styles__conversationBar-input___2DfdZ",
   "chatConversation": "styles__chatConversation___2EmkA",
   "conversationHeaderBar": "styles__conversationHeaderBar___C8tlD",
@@ -57,14 +67,12 @@ var styles = {
   "cozyThread-messageContent": "styles__cozyThread-messageContent___2HjdB",
   "conversation-list-item": "styles__conversation-list-item___rQapI",
   "conversation-list-item-action": "styles__conversation-list-item-action___qiuKm",
-  "conversation-list-item--selected--light": "styles__conversation-list-item--selected--light___3WvIn",
-  "conversation-list-item--selected--dark": "styles__conversation-list-item--selected--dark___JDQlY",
+  "conversation-list-item--selected": "styles__conversation-list-item--selected___2D5_3",
   "conversation-list-item--wider": "styles__conversation-list-item--wider___2Tl2c",
-  "conversation-list-item-divider": "styles__conversation-list-item-divider___2LOP1",
   "conversation-list-item-text": "styles__conversation-list-item-text___31VBM",
   "conversation-list-item-title": "styles__conversation-list-item-title___3je_6",
-  "conversation-list-item-meta": "styles__conversation-list-item-meta___3Zk-r",
-  "conversation-list-item-subtitle": "styles__conversation-list-item-subtitle___3e_h0"
+  "conversation-list-item-subtitle": "styles__conversation-list-item-subtitle___3e_h0",
+  "conversation-list-item-meta": "styles__conversation-list-item-meta___3Zk-r"
 };
 
 var ConversationBar = function ConversationBar(_ref) {

package/dist/components/Conversations/ConversationComposer.js

@@ -7,6 +7,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
 var _react = require("@assistant-ui/react");
@@ -23,6 +25,8 @@ var _Buttons = _interopRequireDefault(require("cozy-ui/transpiled/react/Buttons"
 
 var _Breakpoints = require("cozy-ui/transpiled/react/providers/Breakpoints");
 
+var _CozyTheme = require("cozy-ui/transpiled/react/providers/CozyTheme");
+
 var _ConversationBar = _interopRequireDefault(require("./ConversationBar"));
 
 var _AssistantSelection = _interopRequireDefault(require("../Assistant/AssistantSelection"));
@@ -37,10 +41,20 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 var styles = {
   "composerContainer": "styles__composerContainer___3bNfY",
+  "composerContainer--mobile": "styles__composerContainer--mobile___nIYa-",
+  "composerContainer--mobile-dark": "styles__composerContainer--mobile-dark___12Go9",
+  "composer-dock": "styles__composer-dock___2nPT8",
   "composerActions": "styles__composerActions___2xQEH",
+  "welcome": "styles__welcome___ozY_t",
+  "welcome-halo": "styles__welcome-halo___3jlz_",
+  "welcome-halo--dark": "styles__welcome-halo--dark___fV9pN",
+  "welcome-title": "styles__welcome-title___sBOKX",
   "conversationBar": "styles__conversationBar___2J-Us",
   "conversationBar--mobile": "styles__conversationBar--mobile___1jdg8",
+  "viewport-fade-top": "styles__viewport-fade-top___3j8Lv",
+  "viewport-fade-top--visible": "styles__viewport-fade-top--visible___32uyl",
   "conversationViewport": "styles__conversationViewport___24jYX",
+  "conversationViewport--filled": "styles__conversationViewport--filled___T2QFN",
   "conversationBar-input": "styles__conversationBar-input___2DfdZ",
   "chatConversation": "styles__chatConversation___2EmkA",
   "conversationHeaderBar": "styles__conversationHeaderBar___C8tlD",
@@ -59,20 +73,23 @@ var styles = {
   "cozyThread-messageContent": "styles__cozyThread-messageContent___2HjdB",
   "conversation-list-item": "styles__conversation-list-item___rQapI",
   "conversation-list-item-action": "styles__conversation-list-item-action___qiuKm",
-  "conversation-list-item--selected--light": "styles__conversation-list-item--selected--light___3WvIn",
-  "conversation-list-item--selected--dark": "styles__conversation-list-item--selected--dark___JDQlY",
+  "conversation-list-item--selected": "styles__conversation-list-item--selected___2D5_3",
   "conversation-list-item--wider": "styles__conversation-list-item--wider___2Tl2c",
-  "conversation-list-item-divider": "styles__conversation-list-item-divider___2LOP1",
   "conversation-list-item-text": "styles__conversation-list-item-text___31VBM",
   "conversation-list-item-title": "styles__conversation-list-item-title___3je_6",
-  "conversation-list-item-meta": "styles__conversation-list-item-meta___3Zk-r",
-  "conversation-list-item-subtitle": "styles__conversation-list-item-subtitle___3e_h0"
+  "conversation-list-item-subtitle": "styles__conversation-list-item-subtitle___3e_h0",
+  "conversation-list-item-meta": "styles__conversation-list-item-meta___3Zk-r"
 };
 
 var ConversationComposer = function ConversationComposer() {
+  var _cx;
+
   var _useBreakpoints = (0, _Breakpoints.useBreakpoints)(),
       isMobile = _useBreakpoints.isMobile;
 
+  var _useCozyTheme = (0, _CozyTheme.useCozyTheme)(),
+      isLight = _useCozyTheme.isLight;
+
   var composerRuntime = (0, _react.useComposerRuntime)();
   var isRunning = (0, _react.useThread)(function (state) {
     return state.isRunning;
@@ -115,17 +132,8 @@ var ConversationComposer = function ConversationComposer() {
       return !prev;
     });
   }, [isRunning, setWebsearchEnabled]);
-  return /*#__PURE__*/_react2.default.createElement(_react.ComposerPrimitive.Root, {
-    className: (0, _classnames.default)('u-w-100 u-maw-7 u-mh-auto u-bxz', styles['composerContainer'])
-  }, /*#__PURE__*/_react2.default.createElement("div", {
-    className: "u-flex u-flex-items-start u-flex-justify-between"
-  }, /*#__PURE__*/_react2.default.createElement(_ConversationBar.default, {
-    value: value,
-    isEmpty: isEmpty,
-    onKeyDown: handleKeyDown
-  }), /*#__PURE__*/_react2.default.createElement("div", {
-    className: "u-flex u-flex-items-center u-flex-shrink-0"
-  }, /*#__PURE__*/_react2.default.createElement(_Buttons.default, (0, _extends2.default)({
+
+  var sendButton = /*#__PURE__*/_react2.default.createElement(_Buttons.default, (0, _extends2.default)({
     size: "small",
     className: "u-miw-auto u-w-2 u-h-2 u-bdrs-circle u-flex-shrink-0",
     classes: {
@@ -140,20 +148,42 @@ var ConversationComposer = function ConversationComposer() {
   } : {
     variant: 'primary',
     label: /*#__PURE__*/_react2.default.createElement(_twakeIcons.Icon, {
-      icon: _twakeIcons.Paperplane,
-      size: 12,
-      rotate: -45
+      icon: _twakeIcons.ArrowUp,
+      size: 16
     }),
     onClick: handleSend
-  })))), /*#__PURE__*/_react2.default.createElement("div", {
+  })); // On mobile the send button sits by the text, the sources are icons and
+  // the assistant chip picks the assistant; on desktop the send button ends
+  // the chips row and the assistant is picked from the sidebar.
+
+
+  return /*#__PURE__*/_react2.default.createElement(_react.ComposerPrimitive.Root, {
+    className: (0, _classnames.default)('u-w-100 u-maw-7 u-mh-auto u-bxz', styles['composerContainer'], (_cx = {}, (0, _defineProperty2.default)(_cx, styles['composerContainer--mobile'], isMobile), (0, _defineProperty2.default)(_cx, styles['composerContainer--mobile-dark'], isMobile && !isLight), _cx))
+  }, /*#__PURE__*/_react2.default.createElement("div", {
+    className: "u-flex u-flex-items-start u-flex-justify-between"
+  }, /*#__PURE__*/_react2.default.createElement(_ConversationBar.default, {
+    value: value,
+    isEmpty: isEmpty,
+    onKeyDown: handleKeyDown
+  }), isMobile && /*#__PURE__*/_react2.default.createElement("div", {
+    className: "u-flex u-flex-items-center u-flex-shrink-0"
+  }, sendButton)), /*#__PURE__*/_react2.default.createElement("div", {
     className: (0, _classnames.default)('u-flex u-flex-items-center u-flex-justify-between', styles['composerActions'])
+  }, /*#__PURE__*/_react2.default.createElement("div", {
+    className: "u-flex u-flex-items-center u-flex-wrap"
   }, (0, _cozyFlags.default)('cozy.assistant.create-assistant.enabled') && /*#__PURE__*/_react2.default.createElement(_AssistantSelection.default, {
-    disabled: !isThreadEmpty
-  }), /*#__PURE__*/_react2.default.createElement(_TwakeKnowledgeSelector.default, {
+    disabled: !isThreadEmpty,
+    selectable: isMobile,
+    borderless: isMobile,
+    className: "u-mr-half"
+  }), !isMobile && /*#__PURE__*/_react2.default.createElement(_TwakeKnowledgeSelector.default, {
+    websearchEnabled: websearchEnabled,
+    onToggleWebsearch: handleToggleWebsearch
+  })), isMobile ? /*#__PURE__*/_react2.default.createElement(_TwakeKnowledgeSelector.default, {
     className: "u-ml-auto",
     websearchEnabled: websearchEnabled,
     onToggleWebsearch: handleToggleWebsearch
-  })));
+  }) : sendButton));
 };
 
 var _default = ConversationComposer;

package/dist/components/Conversations/ConversationListItem.js

@@ -13,28 +13,30 @@ var _classnames = _interopRequireDefault(require("classnames"));
 
 var _react = _interopRequireDefault(require("react"));
 
-var _Divider = _interopRequireDefault(require("cozy-ui/transpiled/react/Divider"));
-
 var _ListItem = _interopRequireDefault(require("cozy-ui/transpiled/react/ListItem"));
 
 var _ListItemText = _interopRequireDefault(require("cozy-ui/transpiled/react/ListItemText"));
 
-var _CozyTheme = require("cozy-ui-plus/dist/providers/CozyTheme");
-
-var _twakeI18n = require("twake-i18n");
-
 var _ConversationActions = _interopRequireDefault(require("./ConversationActions"));
 
-var _AssistantAvatar = _interopRequireDefault(require("../Assistant/AssistantAvatar"));
-
 var _helpers = require("../helpers");
 
 var styles = {
   "composerContainer": "styles__composerContainer___3bNfY",
+  "composerContainer--mobile": "styles__composerContainer--mobile___nIYa-",
+  "composerContainer--mobile-dark": "styles__composerContainer--mobile-dark___12Go9",
+  "composer-dock": "styles__composer-dock___2nPT8",
   "composerActions": "styles__composerActions___2xQEH",
+  "welcome": "styles__welcome___ozY_t",
+  "welcome-halo": "styles__welcome-halo___3jlz_",
+  "welcome-halo--dark": "styles__welcome-halo--dark___fV9pN",
+  "welcome-title": "styles__welcome-title___sBOKX",
   "conversationBar": "styles__conversationBar___2J-Us",
   "conversationBar--mobile": "styles__conversationBar--mobile___1jdg8",
+  "viewport-fade-top": "styles__viewport-fade-top___3j8Lv",
+  "viewport-fade-top--visible": "styles__viewport-fade-top--visible___32uyl",
   "conversationViewport": "styles__conversationViewport___24jYX",
+  "conversationViewport--filled": "styles__conversationViewport--filled___T2QFN",
   "conversationBar-input": "styles__conversationBar-input___2DfdZ",
   "chatConversation": "styles__chatConversation___2EmkA",
   "conversationHeaderBar": "styles__conversationHeaderBar___C8tlD",
@@ -53,36 +55,28 @@ var styles = {
   "cozyThread-messageContent": "styles__cozyThread-messageContent___2HjdB",
   "conversation-list-item": "styles__conversation-list-item___rQapI",
   "conversation-list-item-action": "styles__conversation-list-item-action___qiuKm",
-  "conversation-list-item--selected--light": "styles__conversation-list-item--selected--light___3WvIn",
-  "conversation-list-item--selected--dark": "styles__conversation-list-item--selected--dark___JDQlY",
+  "conversation-list-item--selected": "styles__conversation-list-item--selected___2D5_3",
   "conversation-list-item--wider": "styles__conversation-list-item--wider___2Tl2c",
-  "conversation-list-item-divider": "styles__conversation-list-item-divider___2LOP1",
   "conversation-list-item-text": "styles__conversation-list-item-text___31VBM",
   "conversation-list-item-title": "styles__conversation-list-item-title___3je_6",
-  "conversation-list-item-meta": "styles__conversation-list-item-meta___3Zk-r",
-  "conversation-list-item-subtitle": "styles__conversation-list-item-subtitle___3e_h0"
+  "conversation-list-item-subtitle": "styles__conversation-list-item-subtitle___3e_h0",
+  "conversation-list-item-meta": "styles__conversation-list-item-meta___3Zk-r"
 };
 
+/**
+ * A conversation of the sidebar: its name on one line, with its actions
+ * on hover.
+ */
 var ConversationListItem = function ConversationListItem(_ref) {
-  var _conversation$cozyMet;
-
   var conversation = _ref.conversation,
       selected = _ref.selected,
       onOpenConversation = _ref.onOpenConversation;
-
-  var _useI18n = (0, _twakeI18n.useI18n)(),
-      t = _useI18n.t,
-      lang = _useI18n.lang;
-
-  var _useCozyTheme = (0, _CozyTheme.useCozyTheme)(),
-      theme = _useCozyTheme.type;
-
   return /*#__PURE__*/_react.default.createElement(_ListItem.default, {
     button: true,
     onClick: function onClick() {
       return onOpenConversation(conversation._id);
     },
-    className: (0, _classnames.default)('u-ov-hidden u-flex-column u-pv-half u-ph-1', styles['conversation-list-item'], (0, _defineProperty2.default)({}, styles["conversation-list-item--selected--".concat(theme)], selected)),
+    className: (0, _classnames.default)('u-ov-hidden u-ph-half', styles['conversation-list-item'], (0, _defineProperty2.default)({}, styles['conversation-list-item--selected'], selected)),
     selected: selected
   }, /*#__PURE__*/_react.default.createElement(_ConversationActions.default, {
     buttonClassName: styles['conversation-list-item-action'],
@@ -93,23 +87,9 @@ var ConversationListItem = function ConversationListItem(_ref) {
       component: 'div',
       className: styles['conversation-list-item-text']
     },
-    secondaryTypographyProps: {
-      component: 'div',
-      className: styles['conversation-list-item-text']
-    },
     primary: /*#__PURE__*/_react.default.createElement("span", {
-      className: (0, _classnames.default)('u-ellipsis u-db u-pb-half', styles['conversation-list-item-title'])
-    }, (0, _helpers.getNameOfConversation)(conversation)),
-    secondary: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", {
-      className: (0, _classnames.default)('u-db u-ellipsis', styles['conversation-list-item-subtitle'])
-    }, (0, _helpers.getDescriptionOfConversation)(conversation, t)), /*#__PURE__*/_react.default.createElement("span", {
-      className: (0, _classnames.default)('u-flex u-flex-items-center', styles['conversation-list-item-subtitle'], styles['conversation-list-item-meta'])
-    }, /*#__PURE__*/_react.default.createElement(_AssistantAvatar.default, {
-      assistant: conversation.assistant,
-      isSmall: true
-    }), (0, _helpers.formatConversationDate)((_conversation$cozyMet = conversation.cozyMetadata) === null || _conversation$cozyMet === void 0 ? void 0 : _conversation$cozyMet.updatedAt, t, lang)))
-  }), /*#__PURE__*/_react.default.createElement(_Divider.default, {
-    className: styles['conversation-list-item-divider']
+      className: (0, _classnames.default)('u-ellipsis u-db', styles['conversation-list-item-title'])
+    }, (0, _helpers.getNameOfConversation)(conversation))
   }));
 }; // Memoized so a re-render of the conversation list only re-renders items
 // whose props actually changed (typically just the previously- and

package/dist/components/Conversations/ConversationListItemWider.js

@@ -21,8 +21,6 @@ var _ListItemText = _interopRequireDefault(require("cozy-ui/transpiled/react/Lis
 
 var _Typography = _interopRequireDefault(require("cozy-ui/transpiled/react/Typography"));
 
-var _CozyTheme = require("cozy-ui-plus/dist/providers/CozyTheme");
-
 var _twakeI18n = require("twake-i18n");
 
 var _ConversationActions = _interopRequireDefault(require("./ConversationActions"));
@@ -33,10 +31,20 @@ var _helpers = require("../helpers");
 
 var styles = {
   "composerContainer": "styles__composerContainer___3bNfY",
+  "composerContainer--mobile": "styles__composerContainer--mobile___nIYa-",
+  "composerContainer--mobile-dark": "styles__composerContainer--mobile-dark___12Go9",
+  "composer-dock": "styles__composer-dock___2nPT8",
   "composerActions": "styles__composerActions___2xQEH",
+  "welcome": "styles__welcome___ozY_t",
+  "welcome-halo": "styles__welcome-halo___3jlz_",
+  "welcome-halo--dark": "styles__welcome-halo--dark___fV9pN",
+  "welcome-title": "styles__welcome-title___sBOKX",
   "conversationBar": "styles__conversationBar___2J-Us",
   "conversationBar--mobile": "styles__conversationBar--mobile___1jdg8",
+  "viewport-fade-top": "styles__viewport-fade-top___3j8Lv",
+  "viewport-fade-top--visible": "styles__viewport-fade-top--visible___32uyl",
   "conversationViewport": "styles__conversationViewport___24jYX",
+  "conversationViewport--filled": "styles__conversationViewport--filled___T2QFN",
   "conversationBar-input": "styles__conversationBar-input___2DfdZ",
   "chatConversation": "styles__chatConversation___2EmkA",
   "conversationHeaderBar": "styles__conversationHeaderBar___C8tlD",
@@ -55,14 +63,12 @@ var styles = {
   "cozyThread-messageContent": "styles__cozyThread-messageContent___2HjdB",
   "conversation-list-item": "styles__conversation-list-item___rQapI",
   "conversation-list-item-action": "styles__conversation-list-item-action___qiuKm",
-  "conversation-list-item--selected--light": "styles__conversation-list-item--selected--light___3WvIn",
-  "conversation-list-item--selected--dark": "styles__conversation-list-item--selected--dark___JDQlY",
+  "conversation-list-item--selected": "styles__conversation-list-item--selected___2D5_3",
   "conversation-list-item--wider": "styles__conversation-list-item--wider___2Tl2c",
-  "conversation-list-item-divider": "styles__conversation-list-item-divider___2LOP1",
   "conversation-list-item-text": "styles__conversation-list-item-text___31VBM",
   "conversation-list-item-title": "styles__conversation-list-item-title___3je_6",
-  "conversation-list-item-meta": "styles__conversation-list-item-meta___3Zk-r",
-  "conversation-list-item-subtitle": "styles__conversation-list-item-subtitle___3e_h0"
+  "conversation-list-item-subtitle": "styles__conversation-list-item-subtitle___3e_h0",
+  "conversation-list-item-meta": "styles__conversation-list-item-meta___3Zk-r"
 };
 
 var ConversationListItemWider = function ConversationListItemWider(_ref) {
@@ -78,16 +84,13 @@ var ConversationListItemWider = function ConversationListItemWider(_ref) {
       t = _useI18n.t,
       lang = _useI18n.lang;
 
-  var _useCozyTheme = (0, _CozyTheme.useCozyTheme)(),
-      theme = _useCozyTheme.type;
-
   return /*#__PURE__*/_react.default.createElement(_ListItem.default, {
     divider: divider,
     button: true,
     onClick: function onClick() {
       return onOpenConversation(conversation._id);
     },
-    className: (0, _classnames.default)('u-bdrs-0 u-ov-hidden u-flex u-flex-items-center u-flex-justify-between u-w-100 u-pv-half u-ph-1', styles['conversation-list-item'], styles['conversation-list-item--wider'], (0, _defineProperty2.default)({}, styles["conversation-list-item--selected--".concat(theme)], selected)),
+    className: (0, _classnames.default)('u-bdrs-0 u-ov-hidden u-flex u-flex-items-center u-flex-justify-between u-w-100 u-pv-half u-ph-1', styles['conversation-list-item'], styles['conversation-list-item--wider'], (0, _defineProperty2.default)({}, styles['conversation-list-item--selected'], selected)),
     selected: selected
   }, /*#__PURE__*/_react.default.createElement(_ListItemIcon.default, null, /*#__PURE__*/_react.default.createElement(_AssistantAvatar.default, {
     assistant: conversation.assistant,