import Link from "next/link";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";

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

    const router = useRouter();
    const { locale } = router;
    return (
        <div>
            <div className="govuk-grid-row">
                <div className="govuk-grid-column-full">
                    <h2>Documents</h2>
                    <dl class="govuk-summary-list govuk-!-margin-bottom-9 results">
                        <div class="govuk-summary-list__row results-headings">
                            <dd class="govuk-summary-list__key govuk-!-font-size-14 govuk-!-padding-left-2">
                                {t("case:documents-name-label")}
                            </dd>
                            <dd class="govuk-summary-list__key govuk-!-font-size-14">
                                {t("case:documents-doc-type-label")}
                            </dd>
                            <dd class="govuk-summary-list__key govuk-!-font-size-14">
                                {t("case:documents-date-published-label")}
                            </dd>
                            <dd class="govuk-summary-list__key govuk-!-font-size-14">
                                {t("case:documents-size-label")}
                            </dd>
                        </div>
                        <div class="govuk-summary-list__row">
                            <dd class="govuk-summary-list__value govuk-!-font-size-14  govuk-!-padding-left-2">
                                <Link href="/case">
                                    <a>
                                        <span className="results-visually-hidden">
                                            {t("case:documents-name-label")}:
                                        </span>
                                        3272770 Appeal Decision.pdf
                                    </a>
                                </Link>
                            </dd>
                            <dd class="govuk-summary-list__value govuk-!-font-size-14">
                                <span className="results-visually-hidden">
                                    {t("case:documents-doc-type-label")}:
                                </span>
                                Outcome / Decision
                            </dd>
                            <dd class="govuk-summary-list__value govuk-!-font-size-14">
                                <span className="results-visually-hidden">
                                    {t("case:documents-date-published-label")}:
                                </span>
                                15/06/2021
                            </dd>
                            <dd class="govuk-summary-list__value govuk-!-font-size-14">
                                <span className="results-visually-hidden">
                                    {t("case:documents-size-label")}:
                                </span>
                                92
                            </dd>
                        </div>
                    </dl>
                </div>
            </div>
        </div>
    );
}