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

const TitleContent = (props) => {
    let { t } = useTranslation();

    const router = useRouter();
    const { locale } = router;
    return (
        <div className="govuk-panel govuk-grid-column-two-thirds govuk-panel--header">
            <h1 className="govuk-panel__title">
                Developments of National Significance
            </h1>
            <div className="govuk-panel__body">
                <p className="govuk-body-s">
                    A Development of National Significance (DNS) is a type of
                    planning application for a large infrastructure project of
                    national importance in Wales. Here you can find out about
                    proposed DNS applications. This site is managed by the
                    Planning Inspectorate.
                </p>
            </div>
            <div className="govuk-form-group govuk-!-margin-bottom-0">
                <input
                    className="govuk-input govuk-!-width-one-half"
                    id="one-third"
                    name="one-third"
                    type="text"
                    placeholder="Search application name"
                />
                <button
                    className="govuk-button govuk-!-margin-bottom-0"
                    data-module="govuk-button"
                >
                    Search
                </button>
            </div>
        </div>
    );
};

export default TitleContent;