diff --git a/app/theme/client/imports/general/base.css b/app/theme/client/imports/general/base.css
index 5eda246fb99e0..5ee2fca3327f8 100644
--- a/app/theme/client/imports/general/base.css
+++ b/app/theme/client/imports/general/base.css
@@ -249,4 +249,4 @@ button {
 
 .gallery-item {
 	cursor: pointer;
-}
\ No newline at end of file
+}
diff --git a/app/threads/client/flextab/threadlist.tsx b/app/threads/client/flextab/threadlist.tsx
index 1fe2ab0b93e44..45bf968663312 100644
--- a/app/threads/client/flextab/threadlist.tsx
+++ b/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} >
diff --git a/app/ui-utils/client/lib/RoomHistoryManager.js b/app/ui-utils/client/lib/RoomHistoryManager.js
index 82137b1f2bf01..0773b4a95d1f3 100644
--- a/app/ui-utils/client/lib/RoomHistoryManager.js
+++ b/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;
diff --git a/client/components/Message/Attachments/providers/AttachmentProvider.tsx b/client/components/Message/Attachments/providers/AttachmentProvider.tsx
index 7cbcade972cfe..7132ad2960eb0 100644
--- a/client/components/Message/Attachments/providers/AttachmentProvider.tsx
+++ b/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} />;
 };
diff --git a/client/views/omnichannel/analytics/AnalyticsPage.js b/client/views/omnichannel/analytics/AnalyticsPage.js
index c5669bcb522b4..81b6cfc577c63 100644
--- a/client/views/omnichannel/analytics/AnalyticsPage.js
+++ b/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}/>
diff --git a/client/views/omnichannel/analytics/DateRangePicker.js b/client/views/omnichannel/analytics/DateRangePicker.js
index 512eb050adda4..a6b4f4cff0f71 100644
--- a/client/views/omnichannel/analytics/DateRangePicker.js
+++ b/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>;
 };