ilhamdev's picture
Upload folder using huggingface_hub
ece5841 verified
import React from "react";
import { Button, Card, Flex, Image, Select, Text, Title } from "@mantine/core";
import { Form, redirect } from "react-router-dom";
const Computer = () => {
return (
<Card
maw={600}
sx={{
width: "100%",
height: "75vh",
textAlign: "center",
backgroundColor: "#262523",
}}
p={'30px'}
>
<Flex align="center" justify="center" gap="xs" my="lg">
<Image
width="30px"
src="https://www.chess.com/bundles/web/images/color-icons/computer.2318c3b4.svg"
/>
<Title order={2}>Play with Computer</Title>
</Flex>
<Flex direction="column" gap="10px">
<Form action={`/play/computer`} method='POST'>
<Select
defaultValue="w"
my="20px"
color="lime"
name="color"
label={
<Text mx="auto" order={3}>
Select your color
</Text>
}
placeholder="choose your color"
data={[
{ value: "w", label: "White" },
{ value: "b", label: "Black" },
]}
/>
<Button color="lime" type="submit">
Play
</Button>
</Form>
</Flex>
</Card>
);
};
export const playComputerAction = async ({request}) => {
const formData = await request.formData();
let color = formData.get('color');
localStorage.setItem('myColor',color);
return redirect('/game/computer');
}
export default Computer;