Typing and Density settings

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

@@ -9,7 +9,7 @@ function Applications({ contentType }: { contentType: [string] }) {
 	const { data: apps, isFetching: isAppsFetching } = useQueryAPI({
 		endpoint: 'api/apps',
 	});
-	const { isMobile, appSort } = useCommonHooks();
+	const { isMobile, appSort, appDensity } = useCommonHooks();
 	const [applicationData, setApplicationData] = useState<Application[]>([]);
 
 	useEffect(() => {
@@ -49,7 +49,9 @@ function Applications({ contentType }: { contentType: [string] }) {
 							display: 'grid',
 							gridColumnGap: '5px',
 							gridRowGap: '5px',
-							gridTemplateColumns: isMobile ? '1fr 1fr 1fr' : '1fr 1fr 1fr 1fr 1fr 1fr',
+							gridTemplateColumns: isMobile
+								? '1fr 1fr 1fr'
+								: `repeat(${appDensity}, 1fr)`,
 							gridTemplateRows: '64px',
 						}}
 					>