Regression: Lint warnings and some datepicker (#20280)

app/theme/client/imports/general/base.css

@@ -249,4 +249,4 @@ button {
 
 .gallery-item {
 	cursor: pointer;
-}
+}

app/threads/client/flextab/threadlist.tsx

@@ -1,4 +1,4 @@
-import React, { useMemo, lazy, LazyExoticComponent, FC } from 'react';
+import React, { useMemo, lazy, LazyExoticComponent, FC, ReactNode } from 'react';
 import { BadgeProps } from '@rocket.chat/fuselage';
 
 import { addAction } from '../../../../client/views/room/lib/Toolbox';
@@ -28,7 +28,7 @@ addAction('thread', (options) => {
 		title: 'Threads',
 		icon: 'thread',
 		template,
-		renderAction: (props) => {
+		renderAction: (props): ReactNode => {
 			const unread = room.tunread?.length > 99 ? '99+' : room.tunread?.length;
 			const variant = getVariant(room.tunreadUser?.length, room.tunreadGroup?.length);
 			return <Header.ToolBoxAction {...props} >

app/ui-utils/client/lib/RoomHistoryManager.js

@@ -256,6 +256,7 @@ export const RoomHistoryManager = new class {
 
 			return setTimeout(() => msgElement.removeClass('highlight'), 500);
 		}
+
 		const room = this.getRoom(message.rid);
 		room.isLoading.set(true);
 		let typeName = undefined;

client/components/Message/Attachments/providers/AttachmentProvider.tsx

@@ -21,7 +21,7 @@ const AttachmentProvider: FC<{}> = ({ children }) => {
 			width: 480,
 			height: 360,
 		},
-	}), [autoLoadEmbedMedias, collapsedByDefault, saveMobileBandwidth, reducedData]);
+	}), [collapsedByDefault, reducedData, autoLoadEmbedMedias, saveMobileBandwidth, isMobile]);
 
 	return <AttachmentContext.Provider children={children} value={contextValue} />;
 };

client/views/omnichannel/analytics/AnalyticsPage.js

@@ -50,16 +50,16 @@ const AnalyticsPage = () => {
 		<Page.Header title={t('Analytics')}/>
 		<Page.ScrollableContentWithShadow display='flex' flexDirection='column'>
 			<Margins block='x4'>
-				<Box display='flex' flexDirection='row' flexWrap='wrap' >
-					<Box display='flex' mie='x8' flexGrow={1} flexDirection='column'>
+				<Box display='flex' mi='neg-x4' flexDirection='row' flexWrap='wrap' >
+					<Box display='flex' mi='x4' flexGrow={1} flexDirection='column'>
 						<Label mb='x4' >{t('Type')}</Label>
 						<Select flexShrink={0} options={typeOptions} value={type} onChange={setType} />
 					</Box>
-					<Box display='flex' mie='x8' flexGrow={1} flexDirection='column'>
+					<Box display='flex' mi='x4' flexGrow={1} flexDirection='column'>
 						<Label mb='x4'>{t('Departments')}</Label>
 						<DepartmentAutoComplete flexShrink={0} placeholder={t('All')} value={departmentId} onChange={setDepartmentId}/>
 					</Box>
-					<DateRangePicker onChange={setDateRange}/>
+					<DateRangePicker mi='x4' flexGrow={1} onChange={setDateRange}/>
 				</Box>
 				<Box>
 					<Overview type={type} dateRange={dateRange} departmentId={departmentId}/>

client/views/omnichannel/analytics/DateRangePicker.js

@@ -91,20 +91,26 @@ const DateRangePicker = ({ onChange = () => {}, ...props }) => {
 		},
 	}), [handleRange, t]);
 
-	return <Box display='flex' mie='x8' flexGrow={1} flexDirection='row' {...props}>
-		<Field mie='x4' flexShrink={1} flexGrow={1}>
-			<Field.Label>{t('Start')}</Field.Label>
-			<Field.Row>
-				<InputBox type='date' onChange={handleStart} max={todayDate} value={start}/>
-			</Field.Row>
-		</Field>
-		<Field mie='x4' flexShrink={1} flexGrow={1}>
-			<Field.Label>{t('End')}</Field.Label>
-			<Field.Row>
-				<InputBox type='date' onChange={handleEnd} min={start} max={todayDate} value={end}/>
-				<Menu options={options}/>
-			</Field.Row>
-		</Field>
+	return <Box {...props}>
+		<Box mi='neg-x4' height='full' display='flex' flexDirection='row'>
+			<Field mi='x4' flexShrink={1} flexGrow={1}>
+				<Field.Label>{t('Start')}</Field.Label>
+				<Field.Row>
+					<Box height='x40' display='flex' width='full'>
+						<InputBox type='date' onChange={handleStart} max={todayDate} value={start}/>
+					</Box>
+				</Field.Row>
+			</Field>
+			<Field mi='x4' flexShrink={1} flexGrow={1}>
+				<Field.Label>{t('End')}</Field.Label>
+				<Field.Row>
+					<Box height='x40' display='flex' width='full'>
+						<InputBox type='date' onChange={handleEnd} min={start} max={todayDate} value={end}/>
+					</Box>
+					<Menu mis='x8' options={options}/>
+				</Field.Row>
+			</Field>
+		</Box>
 	</Box>;
 };