Merge branch 'main' of https://github.com/appKom/online-opptak into 1…

…48-setup-email-sending-out-interviewtimes

.env.local.template

@@ -11,4 +11,4 @@ AUTH0_CLIENT_SECRET=#client secret
 AUTH0_ISSUER=#issuer base url, example: example.us.auth0.com
 
 AWS_SECRET_ACCESS_KEY=#aws secret access key
-AWS_ACCESS_KEY_ID=#aws access key id
+AWS_ACCESS_KEY_ID=#aws access key id

algorithm/README.md

@@ -9,11 +9,10 @@ cd algorithm
 python -m venv ".venv"
 ```
 
-Lag så en fil i `.\.venv\Lib\site-packages` som slutter på `.pth` og inneholder den absolutte filstien til `mip_matching`-mappen.
-
 ```
 .\.venv\Scripts\activate
-python -m pip install -r requirements.txt
+pip install -e .
+pip install -r requirements.txt
 ```
 
 ## TODOs

algorithm/bridge/.env.template

@@ -0,0 +1,2 @@
+MONGODB_URI=#url to mongodb database
+DB_NAME=#name of db

algorithm/bridge/fetch_applicants_and_committees.py

@@ -0,0 +1,76 @@
+from pymongo import MongoClient
+from dotenv import load_dotenv
+from datetime import datetime, timezone
+import os
+import certifi
+
+def main():
+    periods = fetch_periods()
+
+    #Sjekker om perioden er etter søknadstiden og før intervjuslutt og hasSentInterviewtimes er false, og returnerer søkere og komitétider dersom det er tilfelle
+    for period in periods:
+        periodId = str(period["_id"])
+        interview_end = datetime.fromisoformat(period["interviewPeriod"]["end"].replace("Z", "+00:00"))
+        application_end = datetime.fromisoformat(period["applicationPeriod"]["end"].replace("Z", "+00:00"))
+
+
+        now = datetime.now(timezone.utc)
+
+        if  application_end > now and period["hasSentInterviewTimes"] == False and interview_end < now:
+            applicants = fetch_applicants(periodId)
+            committee_times = fetch_committee_times(periodId)
+            print(applicants)
+            print(committee_times)
+
+            return applicants, committee_times
+
+
+def connect_to_db(collection_name):
+    load_dotenv()
+
+    mongo_uri = os.getenv("MONGODB_URI")
+    db_name = os.getenv("DB_NAME")
+
+    client = MongoClient(mongo_uri, tlsCAFile=certifi.where())
+
+    db = client[db_name] # type: ignore
+
+    collection = db[collection_name]
+
+    return collection, client
+
+def fetch_periods():
+    collection, client = connect_to_db("period")
+
+    periods = collection.find()
+
+    periods = list(periods)
+
+    client.close()
+
+    return periods
+
+def fetch_applicants(periodId):
+    collection, client = connect_to_db("applicant")
+
+    applicants = collection.find({"periodId": periodId})
+
+    applicants = list(applicants)
+
+    client.close()
+
+    return applicants
+
+def fetch_committee_times(periodId):
+    collection, client = connect_to_db("committee")
+
+    committee_times = collection.find({"periodId": periodId})
+
+    committee_times = list(committee_times)
+
+    client.close()
+
+    return committee_times
+
+if __name__ == "__main__":
+    main()

algorithm/src/mip_matching/Applicant.py

@@ -3,8 +3,8 @@
 from typing import TYPE_CHECKING
 if TYPE_CHECKING:
     # Unngår cyclic import
-    from Committee import Committee
-    from TimeInterval import TimeInterval
+    from mip_matching.Committee import Committee
+    from mip_matching.TimeInterval import TimeInterval
 
 import itertools
 

components/ErrorPage.tsx

@@ -0,0 +1,23 @@
+import Image from "next/image";
+import { useTheme } from "../lib/hooks/useTheme";
+
+const ErrorPage = () => {
+  const theme = useTheme();
+
+  const onlineLogoSrc =
+    theme === "dark" ? "/Online_hvit.svg" : "/Online_bla.svg";
+
+  return (
+    <div className="flex flex-col items-center justify-center h-full gap-10 bg-white dark:bg-gray-900">
+      <Image
+        src={onlineLogoSrc}
+        width={300}
+        height={100}
+        alt="Online logo"
+      />
+      <div className="text-xl text-black dark:text-white">Det har skjedd en feil :(</div>
+    </div>
+  );
+};
+
+export default ErrorPage;

components/Navbar.tsx

@@ -36,13 +36,12 @@ const Navbar = () => {
     <div>
       <div className="hidden md:flex justify-between w-full px-5 py-5 sm:items-center border-b-[1px] border-gray-200 dark:border-0 dark:bg-gray-800">
         <Link href="/" passHref>
-          <a
-            aria-label="Online logo"
-          >
+          <a aria-label="Online logo">
             <Image
               src={onlineLogoSrc}
               width={100 * 1.5}
               height={30 * 1.5}
+              priority
               alt="Online logo"
               className="transition-all cursor-pointer hover:opacity-60"
             />
@@ -102,7 +101,7 @@ const Navbar = () => {
                 height={30 * 1.5}
                 alt="Bekk logo"
                 className="transition-all cursor-pointer hover:opacity-60"
-                />
+              />
             </a>
           </Link>
         </div>

components/PageTitle.tsx

@@ -19,10 +19,10 @@ const PageTitle = ({
           {mainTitle}
         </h2>
         {subTitle && (
-          <p className="text-xl text-gray-500 dark:text-gray-400">
+          <div className="text-xl text-gray-500 dark:text-gray-400">
             {boldSubTitle && <span className="font-semibold">{boldSubTitle}{boldSubTitle && subTitle && ":"}&nbsp;</span>}
             {subTitle}
-          </p>
+          </div>
         )}
       </div>
     </div>

components/Table.tsx

@@ -24,8 +24,8 @@ const Table = ({ rows, columns, onDelete }: TableProps) => {
   const router = useRouter();
 
   return (
-    <div className="">
-      <div className="hidden md:flex overflow-auto border border-gray-200 rounded-lg shadow-md dark:border-gray-700">
+    <>
+      <div className="hidden overflow-auto border border-gray-200 rounded-lg shadow-md md:flex dark:border-gray-700">
         <table className="w-full text-gray-500 border-collapse dark:bg-online-darkBlue dark:text-gray-200">
           <thead className="bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
             <tr>
@@ -36,16 +36,16 @@ const Table = ({ rows, columns, onDelete }: TableProps) => {
                       {column.label}
                     </th>
                   ) : (
-                    <div className="px-10 py-2"></div>
+                    <th className="px-10 py-2"></th>
                   )}
                 </React.Fragment>
               ))}
             </tr>
           </thead>
           <tbody className="border-t border-gray-100 dark:border-0">
-            {rows.map((row) => (
+            {rows.map((row, index) => (
               <tr
-                key={"tr-" + row.id}
+                key={"tr-" + index}
                 className="relative cursor-pointer hover:bg-gray-50 dark:bg-gray-800 dark:hover:bg-gray-900 dark:border-gray-700"
                 onClick={() => row.link && router.push(row.link)}
               >
@@ -78,12 +78,12 @@ const Table = ({ rows, columns, onDelete }: TableProps) => {
           </tbody>
         </table>
       </div>
-      <div className="md:hidden flex flex-col space-y-4">
-        {rows.map((row) => (
-          <TableCard key={row.id} period={row} onDelete={onDelete} />
+      <div className="flex flex-col space-y-4 md:hidden">
+        {rows.map((row, index) => (
+          <TableCard key={"TableCard-" + index} period={row} onDelete={onDelete} />
         ))}
       </div>
-    </div>
+    </>
   );
 };
 

components/applicantoverview/ApplicantsOverview.tsx

@@ -10,7 +10,7 @@ import ApplicantTable from "./ApplicantTable";
 import ApplicantOverviewSkeleton from "./ApplicantOverviewSkeleton";
 
 interface Props {
-  period: periodType | null;
+  period?: periodType | null;
   committees?: string[] | null;
   committee?: string;
   includePreferences: boolean;

components/form/ApplicationForm.tsx

@@ -5,7 +5,8 @@ import SelectInput from "./SelectInput";
 import Line from "./Line";
 import { DeepPartial, applicantType } from "../../lib/types/types";
 import { changeDisplayName } from "../../lib/utils/toString";
-import { useState } from "react";
+import { useEffect, useState } from "react";
+import toast from "react-hot-toast";
 
 interface Props {
   applicationData: DeepPartial<applicantType>;
@@ -15,6 +16,7 @@ interface Props {
 }
 
 export const ApplicationForm = (props: Props) => {
+  const [isNtnuEmail, setIsNtnuEmail] = useState<boolean>(false);
   const availableCommittees = [["Ingen", ""]];
   const [selectedOptionalCommittees, setSelectedOptionalCommittees] = useState<
     string[]
@@ -48,9 +50,31 @@ export const ApplicationForm = (props: Props) => {
     });
   };
 
+  useEffect(() => {
+    if (
+      props.applicationData.email &&
+      props.applicationData.email.includes("ntnu.no")
+    ) {
+      setIsNtnuEmail(true);
+      // toast.error(
+      //   "Vi har problemer med å sende e-post til ntnu.no-adresser. Vennligst bruk en annen e-postadresse."
+      // );
+    } else {
+      setIsNtnuEmail(false);
+    }
+  }, [props.applicationData.email]);
+
   return (
     <div className="flex justify-center items-center">
       <form className="px-5 text-online-darkBlue dark:text-white max-w-sm w-full">
+        {isNtnuEmail && (
+          <div className="px-5">
+            <p className="text-red-500">
+              Vi har problemer med å sende e-post til NTNU e-poster. Vennligst
+              bruk en annen e-postadresse.
+            </p>
+          </div>
+        )}
         <TextInput
           label={"E-postadresse"}
           defaultValue={props.applicationData.email}

components/icons/icons/CheckIcon.tsx

@@ -8,9 +8,9 @@ const CheckIcon = ({ className }: { className: string }) => (
   >
     <path
       stroke="currentColor"
-      stroke-linecap="round"
-      stroke-linejoin="round"
-      stroke-width="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      strokeWidth="2"
       d="M1 5.917 5.724 10.5 15 1.5"
     />
   </svg>

components/icons/illustrations/FestivitiesIllustration.tsx

@@ -16,9 +16,9 @@ const FestivitiesIllustration = ({ className }: { className: string }) => {
           y2="677.2"
           gradientUnits="userSpaceOnUse"
         >
-          <stop offset="0" stop-color="gray" stop-opacity="0.25" />
-          <stop offset="0.54" stop-color="gray" stop-opacity="0.12" />
-          <stop offset="1" stop-color="gray" stop-opacity="0.1" />
+          <stop offset="0" stopColor="gray" stopOpacity="0.25" />
+          <stop offset="0.54" stopColor="gray" stopOpacity="0.12" />
+          <stop offset="1" stopColor="gray" stopOpacity="0.1" />
         </linearGradient>
       </defs>
       <path

lib/api/applicantApi.ts

@@ -0,0 +1,9 @@
+import { QueryFunctionContext } from '@tanstack/react-query';
+
+export const fetchApplicantByPeriodAndId = async (context: QueryFunctionContext) => {
+  const periodId = context.queryKey[1];
+  const applicantId = context.queryKey[2];
+  return fetch(`/api/applicants/${periodId}/${applicantId}`).then(res =>
+    res.json()
+  );
+}

lib/api/periodApi.ts

@@ -0,0 +1,8 @@
+import { QueryFunctionContext } from '@tanstack/react-query';
+
+export const fetchPeriodById = async (context: QueryFunctionContext) => {
+  const id = context.queryKey[1];
+  return fetch(`/api/periods/${id}`).then(res =>
+    res.json()
+  );
+}

lib/utils/validateApplication.ts

@@ -8,6 +8,14 @@ export const validateApplication = (applicationData: any) => {
     return false;
   }
 
+  // Check if ntnu email is used
+  if (applicationData.email.includes("ntnu.no")) {
+    toast.error(
+      "Vi har problemer med å sende e-post til NTNU e-poster. Vennligst bruk en annen e-postadresse."
+    );
+    return false;
+  }
+
   // Check if phone number is valid
   if (!validator.isMobilePhone(applicationData.phone, "nb-NO")) {
     toast.error("Fyll inn et gyldig mobilnummer");

package.json

@@ -19,6 +19,7 @@
     "@heroicons/react": "^2.1.3",
     "@tailwindcss/forms": "^0.5.7",
     "@tailwindcss/typography": "github:tailwindcss/typography",
+    "@tanstack/react-query": "^5.51.11",
     "@types/mongodb": "^4.0.7",
     "mongodb": "^6.1.0",
     "next": "^12.3.4",