Chore: Evaluate CannedResponsesListView - TypeScript (#4149)

app/definitions/ICannedResponse.ts

@@ -1,23 +1,3 @@
-export interface IDepartment {
-	_id: string;
-	enabled: boolean;
-	name: string;
-	description: string;
-	showOnRegistration: boolean;
-	showOnOfflineForm: boolean;
-	requestTagBeforeClosingChat: boolean;
-	email: string;
-	chatClosingTags: string[];
-	offlineMessageChannelName: string;
-	maxNumberSimultaneousChat: number;
-	abandonedRoomsCloseCustomMessage: string;
-	waitingQueueMessage: string;
-	departmentsAllowedToForward: string;
-	_updatedAt: Date;
-	numAgents: number;
-	ancestors: string[];
-}
-
 export interface ICannedResponse {
 	_id: string;
 	shortcut: string;

app/definitions/ILivechatDepartment.ts

@@ -13,6 +13,11 @@ export interface ILivechatDepartment {
 	_updatedAt?: Date;
 	businessHourId?: string;
 	fallbackForwardDepartment?: string;
+	maxNumberSimultaneousChat: number;
+	abandonedRoomsCloseCustomMessage: string;
+	waitingQueueMessage: string;
+	departmentsAllowedToForward: string;
+	ancestors: string[];
 	// extra optional fields
 	[k: string]: any;
 }

app/views/CannedResponsesListView/Dropdown/DropdownItemFilter.tsx

@@ -1,12 +1,12 @@
 import React from 'react';
 
-import { IDepartment } from '../../../definitions/ICannedResponse';
+import { ILivechatDepartment } from '../../../definitions/ILivechatDepartment';
 import DropdownItem from './DropdownItem';
 
 interface IDropdownItemFilter {
-	currentDepartment: IDepartment;
+	currentDepartment: ILivechatDepartment;
-	value: IDepartment;
+	value: ILivechatDepartment;
-	onPress: (value: IDepartment) => void;
+	onPress: (value: ILivechatDepartment) => void;
 }
 
 const DropdownItemFilter = ({ currentDepartment, value, onPress }: IDropdownItemFilter): JSX.Element => (

app/views/CannedResponsesListView/Dropdown/DropdownItemHeader.tsx

@@ -1,14 +1,14 @@
 import React from 'react';
 
-import { IDepartment } from '../../../definitions/ICannedResponse';
+import { ILivechatDepartment } from '../../../definitions/ILivechatDepartment';
 import DropdownItem from './DropdownItem';
 
 interface IDropdownItemHeader {
-	department: IDepartment;
+	department: ILivechatDepartment;
 	onPress: () => void;
 }
 
-const DropdownItemHeader = ({ department, onPress }: IDropdownItemHeader): JSX.Element => (
+const DropdownItemHeader = ({ department, onPress }: IDropdownItemHeader): React.ReactElement => (
 	<DropdownItem text={department?.name} iconName='filter' onPress={onPress} />
 );
 

app/views/CannedResponsesListView/Dropdown/index.tsx

@@ -6,19 +6,19 @@ import styles from '../styles';
 import { themes } from '../../../lib/constants';
 import { TSupportedThemes, withTheme } from '../../../theme';
 import * as List from '../../../containers/List';
-import { IDepartment } from '../../../definitions/ICannedResponse';
 import DropdownItemFilter from './DropdownItemFilter';
 import DropdownItemHeader from './DropdownItemHeader';
 import { ROW_HEIGHT } from './DropdownItem';
+import { ILivechatDepartment } from '../../../definitions/ILivechatDepartment';
 
 const ANIMATION_DURATION = 200;
 
 interface IDropdownProps {
 	theme?: TSupportedThemes;
-	currentDepartment: IDepartment;
+	currentDepartment: ILivechatDepartment;
 	onClose: () => void;
-	onDepartmentSelected: (value: IDepartment) => void;
+	onDepartmentSelected: (value: ILivechatDepartment) => void;
-	departments: IDepartment[];
+	departments: ILivechatDepartment[];
 }
 
 class Dropdown extends React.Component<IDropdownProps> {

app/views/CannedResponsesListView/index.tsx

@@ -25,11 +25,13 @@ import CannedResponseItem from './CannedResponseItem';
 import Dropdown from './Dropdown';
 import DropdownItemHeader from './Dropdown/DropdownItemHeader';
 import styles from './styles';
-import { ICannedResponse, IDepartment } from '../../definitions/ICannedResponse';
+import { ICannedResponse } from '../../definitions/ICannedResponse';
 import { ChatsStackParamList } from '../../stacks/types';
 import { ISubscription } from '../../definitions/ISubscription';
 import { getRoomTitle, getUidDirectMessage } from '../../lib/methods';
 import { Services } from '../../lib/services';
+import { IApplicationState } from '../../definitions';
+import { ILivechatDepartment } from '../../definitions/ILivechatDepartment';
 
 const COUNT = 25;
 
@@ -46,7 +48,7 @@ const fixedScopes = [
 		_id: 'user',
 		name: I18n.t('Private')
 	}
-] as IDepartment[];
+] as ILivechatDepartment[];
 
 interface ICannedResponsesListViewProps {
 	navigation: StackNavigationProp<ChatsStackParamList, 'CannedResponsesListView'>;
@@ -58,7 +60,7 @@ const CannedResponsesListView = ({ navigation, route }: ICannedResponsesListView
 
 	const [cannedResponses, setCannedResponses] = useState<ICannedResponse[]>([]);
 	const [cannedResponsesScopeName, setCannedResponsesScopeName] = useState<ICannedResponse[]>([]);
-	const [departments, setDepartments] = useState<IDepartment[]>([]);
+	const [departments, setDepartments] = useState<ILivechatDepartment[]>([]);
 
 	// states used by the filter in Header and Dropdown
 	const [isSearching, setIsSearching] = useState(false);
@@ -74,8 +76,8 @@ const CannedResponsesListView = ({ navigation, route }: ICannedResponsesListView
 
 	const insets = useSafeAreaInsets();
 	const { theme } = useTheme();
-	const { isMasterDetail } = useSelector((state: any) => state.app);
+	const isMasterDetail = useSelector((state: IApplicationState) => state.app.isMasterDetail);
-	const { rooms } = useSelector((state: any) => state.room);
+	const rooms = useSelector((state: IApplicationState) => state.room.rooms);
 
 	const getRoomFromDb = async () => {
 		const { rid } = route.params;
@@ -92,9 +94,9 @@ const CannedResponsesListView = ({ navigation, route }: ICannedResponsesListView
 
 	const getDepartments = debounce(async () => {
 		try {
-			const res: any = await Services.getDepartments();
+			const res = await Services.getDepartments();
 			if (res.success) {
-				setDepartments([...fixedScopes, ...res.departments]);
+				setDepartments([...fixedScopes, ...(res.departments as ILivechatDepartment[])]);
 			}
 		} catch (e) {
 			setDepartments(fixedScopes);
@@ -119,7 +121,7 @@ const CannedResponsesListView = ({ navigation, route }: ICannedResponsesListView
 				t: room.t,
 				fname: name
 			}),
-			t: room.t as any,
+			t: room.t,
 			roomUserId: getUidDirectMessage(room),
 			usedCannedResponse: item.text
 		};
@@ -214,7 +216,7 @@ const CannedResponsesListView = ({ navigation, route }: ICannedResponsesListView
 		searchCallback(text, scope, departmentId);
 	};
 
-	const onDepartmentSelect = (value: IDepartment) => {
+	const onDepartmentSelect = (value: ILivechatDepartment) => {
 		let department = '';
 		let depId = '';