import Constants from "expo-constants";
import { Link } from "expo-router";
import { Text, View } from "react-native";
import { useServerStore } from "../hooks/useServerCheck";

export function GlobalFooter() {
	const build = Constants.expoConfig?.android?.versionCode ?? 1;
	const serverVersion = useServerStore((s) => s.serverVersion);
	const hasUpdate =
		serverVersion && serverVersion?.minSupportedVersionCode > build;
	const shouldUpdate = serverVersion && serverVersion?.versionCode > build;

	if (serverVersion && serverVersion?.versionCode <= build) return;
	return (
		<View>
			{(hasUpdate || shouldUpdate) && (
				<View className="bg-slate-500">
					{hasUpdate && (
						<View className="items-center h-[75px] bg-[#EB091A] justify-center">
							<Link href="/updateScreen">
								<Text className="font-medium text-base text-center">
									Critical updates pending, once you are completed with your
									task please click me for instructions to update
								</Text>
							</Link>
						</View>
					)}

					{!hasUpdate && shouldUpdate && (
						<View className="bg-[#FDBA74] py-2 items-center">
							<Link href="/updateScreen">
								<Text className="font-medium text-base text-center">
									There is an update click me for instructions
								</Text>
							</Link>
						</View>
					)}
				</View>
			)}
		</View>
	);
}
