initial commit

components/myportal/awaitingsubmission.js

@@ -0,0 +1,24 @@
+import Link from "next/link";
+import { useRouter } from "next/router";
+import useTranslation from "next-translate/useTranslation";
+
+export default function AwaitingSubmission() {
+  let { t } = useTranslation();
+
+  const router = useRouter();
+  const { locale } = router;
+  return (
+    <div className="card card-3" id="casescomment-card">
+      <div className="card-body">
+        <h3 className="heading-small card-heading">
+          {t("myportal:awatitingsubmission-card-title")}
+        </h3>
+        <div className="cardVieAll">
+          <Link href="/">
+            <a>{t("myportal:viewall-link")}</a>
+          </Link>
+        </div>
+      </div>
+    </div>
+  );
+}

components/myportal/makenewappeal.js

@@ -0,0 +1,26 @@
+import Link from "next/link";
+import { useRouter } from "next/router";
+import useTranslation from "next-translate/useTranslation";
+
+export default function MakeNewAppeal() {
+  let { t } = useTranslation();
+
+  const router = useRouter();
+  const { locale } = router;
+  return (
+    <div className="card card-3" id="casescomment-card">
+      <div className="card-body">
+        <h3 className="heading-small card-heading">
+          {t("myportal:makenewappeal-card-title")}
+        </h3>
+        <p className="govuk-body-s">{t("myportal:makenewappeal-card-paragraph-one")}</p>
+        <p className="govuk-body-s">{t("myportal:makenewappeal-card-paragraph-two")}</p>
+        <div>
+          <Link href="/">
+            <a className="govuk-button">{t("myportal:makenewappeal-card-button-label")}</a>
+          </Link>
+        </div>
+      </div>
+    </div>
+  );
+}

components/myportal/mycases.js

@@ -0,0 +1,24 @@
+import Link from "next/link";
+import { useRouter } from "next/router";
+import useTranslation from "next-translate/useTranslation";
+
+export default function MyCases() {
+  let { t } = useTranslation();
+
+  const router = useRouter();
+  const { locale } = router;
+  return (
+    <div className="card card-3" id="casescomment-card">
+      <div className="card-body">
+        <h3 className="heading-small card-heading">
+          {t("myportal:mycases-card-title")}
+        </h3>
+        <div className="cardVieAll">
+          <Link href="/">
+            <a>{t("myportal:viewall-link")}</a>
+          </Link>
+        </div>
+      </div>
+    </div>
+  );
+}

components/myportal/myrepresentations.js

@@ -0,0 +1,24 @@
+import Link from "next/link";
+import { useRouter } from "next/router";
+import useTranslation from "next-translate/useTranslation";
+
+export default function MyRepresentations() {
+  let { t } = useTranslation();
+
+  const router = useRouter();
+  const { locale } = router;
+  return (
+    <div className="card card-3" id="casescomment-card">
+      <div className="card-body">
+        <h3 className="heading-small card-heading">
+          {t("myportal:myrepresentations-card-title")}
+        </h3>
+        <div className="cardVieAll">
+          <Link href="/">
+            <a>{t("myportal:viewall-link")}</a>
+          </Link>
+        </div>
+      </div>
+    </div>
+  );
+}

components/myportal/searchcases.js

@@ -0,0 +1,53 @@
+import Link from "next/link";
+import { useRouter } from "next/router";
+import useTranslation from "next-translate/useTranslation";
+
+export default function SearchCases() {
+  let { t } = useTranslation();
+
+  const router = useRouter();
+  const { locale } = router;
+  return (
+    <div className="card card-3" id="casescomment-card">
+      <div className="card-body">
+        <h3 className="heading-small card-heading">
+          {t("myportal:searchcases-card-title")}
+        </h3>
+        <div class="govuk-form-group">
+          <div id="event-name-hint" classNAme="govuk-hint ">
+            {t("myportal:searchcases-card-search-hint")}:
+            <br />
+            <span className="govuk-body-s">
+              {" "}
+              <span className="govuk-!-font-weight-bold">
+                {t("myportal:searchcases-card-search-example-label")}:
+              </span>{" "}
+              APP/A1234/A/99/1234567
+            </span>
+          </div>
+          <input
+            className="govuk-input"
+            id="event-name"
+            name="event-name"
+            type="text"
+            aria-describedby="event-name-hint"
+          />
+        </div>
+        <div class="govuk-form-group">
+          <button
+            type="submit"
+            class="govuk-button"
+            data-module="govuk-button"
+            id="submit-search"
+            formnovalidate=""
+          >
+            {t("myportal:searchcases-card-button")}
+          </button>
+        </div>
+        <Link href="/">
+          <a>{t("myportal:searchcases-card-advanced-link")}</a>
+        </Link>
+      </div>
+    </div>
+  );
+}

components/myportal/watchedcases.js

@@ -0,0 +1,24 @@
+import Link from "next/link";
+import { useRouter } from "next/router";
+import useTranslation from "next-translate/useTranslation";
+
+export default function WatchedCases() {
+  let { t } = useTranslation();
+
+  const router = useRouter();
+  const { locale } = router;
+  return (
+    <div className="card card-3" id="casescomment-card">
+      <div className="card-body">
+        <h3 className="heading-small card-heading">
+          {t("myportal:watchedcases-card-title")}
+        </h3>
+        <div className="cardVieAll">
+          <Link href="/">
+            <a>{t("myportal:viewall-link")}</a>
+          </Link>
+        </div>
+      </div>
+    </div>
+  );
+}