App and sorting updates

src/pages/homepage/components/Applications/Applications.tsx

@@ -9,17 +9,31 @@ function Applications({ contentType }: any) {
 	const { data: apps, isFetching: isAppsFetching } = useQueryAPI({
 		endpoint: 'api/apps',
 	});
-	const { isMobile } = useCommonHooks();
+	const { isMobile, appSort } = useCommonHooks();
 	const [applicationData, setApplicationData] = useState<Application[]>([]);
 
 	useEffect(() => {
 		if (apps && !isAppsFetching) {
 			setApplicationData(
-				apps.sort((a: Application, b: Application) => (a.name > b.name ? 1 : -1)),
+				apps
+					.filter((a: Application) => a.enabled === 1)
+					.sort((a: any, b: any) => {
+						switch (appSort) {
+							case 'A>Z':
+								return a.name > b.name ? 1 : -1;
+							case 'Z>A':
+								return a.name < b.name ? 1 : -1;
+							case 'Newest':
+								return a.id < b.id ? 1 : -1;
+							case 'Oldest':
+								return a.id > b.id ? 1 : -1;
+							case 'Custom':
+								return a.index > b.index ? 1 : -1;
+						}
+					}),
 			);
 		}
-	}, [apps, isAppsFetching]);
-
+	}, [apps, isAppsFetching, appSort]);
 	return (
 		<>
 			{applicationData.length > 0 && contentType.length > 0 && (
@@ -39,11 +53,13 @@ function Applications({ contentType }: any) {
 							gridTemplateRows: '64px',
 						}}
 					>
-						{applicationData?.map((application: any) => {
-							if (
-								contentType.includes(application.filterName) ||
-								contentType.includes('All')
+						{applicationData
+							?.filter(
+								(application: Application) =>
+									contentType.includes(application.filterName) ||
+									contentType.includes('All'),
 							)
+							.map((application: any) => {
 								return (
 									<AppItem
 										key={application.name}
@@ -53,7 +69,7 @@ function Applications({ contentType }: any) {
 										category={application.category}
 									/>
 								);
-						})}
+							})}
 					</Stack>
 				</Stack>
 			)}