import { Metadata } from "next";
import { getServerI18n } from "@/i18n";
import Add from "@mui/icons-material/Add";
import Button from "@mui/material/Button";
import Stack from "@mui/material/Stack";
import Typography from "@mui/material/Typography";
import Link from "next/link";
import { Suspense } from "react";

const Bssp: React.FC = async () => {
    const { t } = await getServerI18n("bssp")

    return (
        <>
          <Stack
            direction="row"
            justifyContent="space-between"
            flexWrap="wrap"
            rowGap={2}
          >
            <Typography variant="h1" marginInlineEnd={2}>
              {t("Bssp")}
            </Typography>

          </Stack>
          <Suspense>
            {t("SSSSS")}
            <a href= "http://localhost:3000/bssp">{t("link")}</a>

            <form>
              <label>{t("First name:")}</label><br/>
              <input type="text" id="fname" name="fname"/><br/>
              <label>{t("Last name:")}</label><br/>
              <input type="text" id="lname" name="lname"/><br/><br/>
              <input type="submit" value="Submit"/>
            </form> 

          </Suspense>
        </>
      )
};

export default Bssp;