import Link from "next/link";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import xpath from "xpath";
import BuildField from "./buildfield";

export default function BuildRow(props) {
    let { t } = useTranslation();

    const router = useRouter();
    const { locale } = router;

    const { rowXML, whichSection, sectionCount, onSubmit } = props;

    const parser = new DOMParser();

    return (
        <div className="govuk-grid-column-full">
            {Object.keys(rowXML).map((key, index) => {
                var doc = parser.parseFromString(
                    rowXML[key].outerHTML,
                    "text/xml"
                );
                var rows = xpath.select("//label/@description", doc);
                var fieldtype = xpath.select("//@classid", doc);
                var datafieldname = xpath.select("//@datafieldname", doc);
                return (
                    <BuildField
                        fieldType={fieldtype[0].value}
                        label={rows[0].value}
                        datafieldname={datafieldname[0].value}
                        key={key}
                        props={props}
                    />
                );
            })}
        </div>
    );
}