<template>
	<div class="form-floating">
		<select
			class="form-select"
			id="selectClient"
			@change="setClient($event)"
			v-model="getApolloClient">
			<option
				:value="clientName"
				v-for="(clientObject, clientName) in $nuxt.$apolloProvider.clients"
				:key="clientName">
				{{
					clientName
						.split(/(?=[A-Z])/)
						.map((s) => s.toLowerCase())
						.join("-")
				}}
			</option>
		</select>
		<label for="selectClient">{{ $t("wotwizard.nodeselect") }}</label>
	</div>
</template>

<script>
export default {
	methods: {
		setClient(e) {
			localStorage.setItem("apollo-client", e.target.value)
			window.location =
				window.location.origin + "/" + this.$i18n.locale + "/index.html"
		}
	}
}
</script>