Function useTabGroupProps

apps/baseai.dev/src/components/Code.tsx:302–327

(availableLanguages: Array<string>)

}));

function useTabGroupProps(availableLanguages: Array<string>) {
	let { preferredLanguages, addPreferredLanguage } =
		usePreferredLanguageStore();
	let [selectedIndex, setSelectedIndex] = useState(0);
	let activeLanguage = [...availableLanguages].sort(
		(a, z) => preferredLanguages.indexOf(z) - preferredLanguages.indexOf(a)
	)[0];
	let languageIndex = availableLanguages.indexOf(activeLanguage);
	let newSelectedIndex = languageIndex === -1 ? selectedIndex : languageIndex;
	if (newSelectedIndex !== selectedIndex) {
		setSelectedIndex(newSelectedIndex);
	}

	let { positionRef, preventLayoutShift } = usePreventLayoutShift();

	return {
		as: 'div' as const,
		ref: positionRef,
		selectedIndex,
		onChange: (newSelectedIndex: number) => {
			preventLayoutShift(() =>
				addPreferredLanguage(availableLanguages[newSelectedIndex])
			);
		}
	};
}

const CodeGroupContext = createContext(false);