diff --git a/.github/workflows/frontend-gh-pages-build.yaml b/.github/workflows/frontend-gh-pages-build.yaml
index d8e7500..1155062 100644
--- a/.github/workflows/frontend-gh-pages-build.yaml
+++ b/.github/workflows/frontend-gh-pages-build.yaml
@@ -4,7 +4,7 @@ name: Deploy frontend to Pages
 on:
   # Runs on pushes targeting the default branch
   push:
-    branches: ["main"]
+    branches: ["main", "IDS-957-display-information-retrieved-from-backend"]
 
   # Allows you to run this workflow manually from the Actions tab
   workflow_dispatch:
diff --git a/web/src/App.vue b/web/src/App.vue
index c0a03ce..8cf081e 100644
--- a/web/src/App.vue
+++ b/web/src/App.vue
@@ -1,7 +1,10 @@
 <script setup lang="ts">
 import { RouterView } from 'vue-router'
-import { formState } from './store';
+import { formState, requestInfo } from './store';
 import { client } from './client';
+import { loadRequestInfo } from './client/requestInfo';
+import { onErrorCaptured } from 'vue';
+import router from './router';
 
 window.addEventListener('beforeunload', (event) => {
   // If the user has started the form but hasn't finished it, give a warning before
@@ -12,6 +15,7 @@ window.addEventListener('beforeunload', (event) => {
   }
 });
 
+// Set up API client.
 client.setConfig({
   baseUrl: import.meta.env.VITE_API_BASE_URL
 });
@@ -20,6 +24,14 @@ client.interceptors.request.use((request, _) => {
   request.headers.set('x-api-key', import.meta.env.VITE_API_KEY);
   return request;
 });
+
+// Load initial request information - project and drive.
+loadRequestInfo().then((hasLoadedRequestInfo: boolean) => {
+  if (!hasLoadedRequestInfo) {
+    // If loading the request info wasn't successful, redirect to error page.
+    router.replace("/service-error");
+  }
+});
 </script>
 
 <template>
diff --git a/web/src/client/requestInfo.ts b/web/src/client/requestInfo.ts
new file mode 100644
index 0000000..6f111da
--- /dev/null
+++ b/web/src/client/requestInfo.ts
@@ -0,0 +1,62 @@
+/**
+ * Functions for loading information about the archive request.
+ */
+import { requestInfo } from "@/store";
+import { getDriveInfoApiV1ResdriveinfoGet } from "./sdk.gen";
+import type { ProjectWithDriveMember, ResearchDriveService } from "./types.gen";
+
+/**
+ * Retrieves project information based on project code in URL.
+ * @returns Project information from server.
+ * @throws Exception if server did not return data or received an error status code.
+ */
+async function getProject(): Promise<ProjectWithDriveMember> {
+    const params = new URLSearchParams(window.location.search);
+    const driveId = params.get("drive");
+    if (driveId === null) {
+        throw new Error("No drive name found in parameter.");
+    }
+    const response = await getDriveInfoApiV1ResdriveinfoGet({
+        query: {
+            drive_id: driveId
+        }
+    });
+    if (response.error || !response.response.ok || response.data === undefined) {
+        throw response.error;
+    }
+    return response.data;
+}
+
+/**
+ * Retrieves drive information from server.
+ * @returns Drive information from server.
+ * @throws Exception if server did not return data.
+ */
+async function getDrive(): Promise<ResearchDriveService> {
+    const project = await getProject();
+    if (!project) {
+        throw new Error("Project is not loaded.");
+    }
+    return project.research_drives[0];
+}
+
+/**
+ * Retrieves archive information from server and stores it in the requestInfo store.
+* @returns True if request was loaded successfully, false if not.
+ */
+export async function loadRequestInfo(): Promise<boolean> {
+    // Pre-populate archive request info.
+    try {
+        requestInfo.isLoading = true;
+        requestInfo.project = await getProject();
+        requestInfo.drive = await getDrive();
+        requestInfo.isLoading = false;
+        return true;
+    } catch (e) {
+        requestInfo.isLoading = false;
+        requestInfo.error = e;
+        console.error("Could not retrieve request information. Bad invite link?");
+        console.error(e);
+        return false;
+    }
+}
\ No newline at end of file
diff --git a/web/src/client/types.gen.ts b/web/src/client/types.gen.ts
index 919f41b..457a03a 100644
--- a/web/src/client/types.gen.ts
+++ b/web/src/client/types.gen.ts
@@ -77,6 +77,32 @@ export type InputServices = {
     research_drive: Array<ResearchDriveService>;
 };
 
+/**
+ * SQL model for storing simple file manifests
+ */
+export type Manifest = {
+    id: number;
+    manifest: string;
+};
+
+/**
+ * Public model for project members.
+ */
+export type MemberPublic = {
+    role: Role;
+    person: Person;
+};
+
+/**
+ * Data class for a Person model in database.
+ */
+export type Person = {
+    id?: (number | null);
+    email: (string | null);
+    full_name: string;
+    username: string;
+};
+
 /**
  * Project model for data stored in database
  */
@@ -97,19 +123,49 @@ export type ProjectChanges = {
     description?: (string | null);
 };
 
+/**
+ * Public model for project with drive and member information.
+ */
+export type ProjectWithDriveMember = {
+    title: string;
+    description: string;
+    division: string;
+    start_date: string;
+    end_date: string;
+    id: number;
+    codes: Array<Code>;
+    research_drives: Array<ResearchDriveServicePublic>;
+    members: Array<MemberPublic>;
+};
+
 /**
  * Object describing a research drive service.
  */
 export type ResearchDriveService = {
+    name: string;
     allocated_gb: number;
+    free_gb: number;
+    used_gb: number;
+    percentage_used: number;
     date: string;
     first_day: string;
-    free_gb: number;
-    id: (number | null);
     last_day: (string | null);
+    id?: (number | null);
+};
+
+/**
+ * Public model for Research Drive Service.
+ */
+export type ResearchDriveServicePublic = {
     name: string;
-    percentage_used: number;
+    allocated_gb: number;
+    free_gb: number;
     used_gb: number;
+    percentage_used: number;
+    date: string;
+    first_day: string;
+    last_day: (string | null);
+    manifest: Manifest;
 };
 
 /**
@@ -144,9 +200,7 @@ export type GetDriveInfoApiV1ResdriveinfoGetData = {
     };
 };
 
-export type GetDriveInfoApiV1ResdriveinfoGetResponse = ({
-    [key: string]: (string);
-});
+export type GetDriveInfoApiV1ResdriveinfoGetResponse = (ProjectWithDriveMember);
 
 export type GetDriveInfoApiV1ResdriveinfoGetError = (HTTPValidationError);
 
diff --git a/web/src/fixtures.ts b/web/src/fixtures.ts
deleted file mode 100644
index 5447a12..0000000
--- a/web/src/fixtures.ts
+++ /dev/null
@@ -1,62 +0,0 @@
-/**
- * Fixtures containing a sample project and drive. TODO replace with an API client.
- */
-import type { ResearchDriveService, Project, Member, Role } from "./project";
-
-export function getDrive(): ResearchDriveService {
-    return {
-        name: "reslig202200001-Tītoki-metabolomics",
-        allocated_gb: 25600.0,
-        used_gb: 1596.0
-    };
-}
-
-export function getProject(): Project {
-    return {
-        title: "Tītoki metabolomics",
-        description: "Stress in plants could be defined as any change in growth condition(s) that disrupts metabolic homeostasis and requires an adjustment of metabolic pathways in a process that is usually referred to as acclimation. Metabolomics could contribute significantly to the study of stress biology in plants and other organisms by identifying different compounds, such as by-products of stress metabolism, stress signal transduction molecules or molecules that are part of the acclimation response of plants.",
-        division: "Liggins Institute",
-        members: [
-            {
-                person: {
-                    full_name: "Samina Nicholas",
-                    email: "s.nicholas@test.auckland.ac.nz",
-                    username: "snic021"
-                },
-                roles: [{
-                    name: "Project Owner"
-                }]
-            },
-            {
-                person: {
-                    full_name: "Zach Luther",
-                    email: "z.luther@test.auckland.ac.nz",
-                    username: "zlut014"
-                },
-                roles: [{
-                    name: "Project Team Member"
-                }]
-            },
-            {
-                person: {
-                    full_name: "Jarrod Hossam",
-                    email: "j.hossam@test.auckland.ac.nz",
-                    username: "jhos225"
-                },
-                roles: [{
-                    name: "Project Team Member"
-                }]
-            },
-            {
-                person: {
-                    full_name: "Melisa Edric",
-                    email: "m.edric@test.auckland.ac.nz",
-                    username: "medr894"
-                },
-                roles: [{
-                    name: "Project Team Member"
-                }]
-            }
-        ]
-    };
-}
diff --git a/web/src/main.ts b/web/src/main.ts
index 5a5dbdb..71d3cc3 100644
--- a/web/src/main.ts
+++ b/web/src/main.ts
@@ -8,4 +8,15 @@ const app = createApp(App)
 
 app.use(router)
 
+// Global error handler
+app.config.errorHandler = (err, instance, info) => {
+
+    // Handle the error globally
+    console.error("Global error:", err);
+    console.log("Vue instance:", instance);
+    console.log("Error info:", info);
+
+    router.replace("/service-error");
+};
+
 app.mount('#app')
diff --git a/web/src/models/helpers.ts b/web/src/models/helpers.ts
new file mode 100644
index 0000000..5f4c189
--- /dev/null
+++ b/web/src/models/helpers.ts
@@ -0,0 +1,43 @@
+/**
+ * Additional methods for Members.
+ */
+
+import type { MemberPublic } from "@/client";
+
+
+/**
+ * Given a list of members, filter for project owners.
+ * @param members List of members to search through
+ * @returns Members who are project owners.
+ */
+export function getProjectOwners(members: MemberPublic[]): MemberPublic[] {
+    return members.filter(member =>
+        member.role.name === "Project Owner"
+    );
+}
+
+/**
+ * Given a list of project members, filter for ordinary members.
+ * @param members List of members to search through
+ * @returns Members who are not project owners.
+ */
+export function getProjectMembers(members: MemberPublic[]): MemberPublic[] {
+    return members.filter(member =>
+        member.role.name !== "Project Owner"
+    );
+}
+
+/**
+ * Given a list of members, return a string of their names.
+ * @param members Members to return names for.
+ * @returns A string representing all member names.
+ */
+export function membersToString(members: MemberPublic[]): string {
+
+    return members.filter((_, idx, arr) =>
+        // Filter for unique members
+        arr.findIndex(member => member.person.email) === idx
+    ).map(member =>
+        member.person.full_name
+    ).join(", ");
+}
\ No newline at end of file
diff --git a/web/src/project.ts b/web/src/project.ts
deleted file mode 100644
index dcf351d..0000000
--- a/web/src/project.ts
+++ /dev/null
@@ -1,80 +0,0 @@
-/**
- * Type definitions for project information. TODO - generate based on output types in Python.
- */
-export interface Person {
-    email: string | null;
-    full_name: string;
-    username: string;
-}
-
-export interface Role {
-    name: string
-}
-
-export interface Member {
-    person: Person;
-    roles: Role[]
-}
-
-export interface Project {
-    title: string
-    description: string
-    division: string
-    members: Member[]
-}
-
-export interface ResearchDriveService {
-    allocated_gb: number
-    name: string
-    used_gb: number
-}
-
-/**
- * Makes and returns an empty Project.
- * @returns An empty Project.
- */
-export function makeProject(): Project {
-    return {
-        title: "",
-        description: "",
-        division: "",
-        members: []
-    }
-}
-
-/**
- * Given a list of members, filter for project owners.
- * @param members List of members to search through
- * @returns Members who are project owners.
- */
-export function getProjectOwners(members: Member[]): Member[] {
-    return members.filter(member =>
-        member.roles.some(
-            (role: Role) => role.name === "Project Owner"
-        )
-    );
-}
-
-/**
- * Given a list of project members, filter for ordinary members.
- * @param members List of members to search through
- * @returns Members who are not project owners.
- */
-export function getProjectMembers(members: Member[]): Member[] {
-    return members.filter(member =>
-        !member.roles.some(
-            (role: Role) => role.name === "Project Owner"
-        )
-    );
-}
-
-/**
- * Given a list of members, return a string of their names.
- * @param members Members to return names for.
- * @returns A string representing all member names.
- */
-export function membersToString(members: Member[]): string {
-    return members.map(member =>
-        member.person.full_name
-    ).join(", ");
-}
\ No newline at end of file
diff --git a/web/src/store.ts b/web/src/store.ts
index ddc1885..3212004 100644
--- a/web/src/store.ts
+++ b/web/src/store.ts
@@ -1,18 +1,15 @@
 import { reactive } from 'vue';
-import { makeProject, type Project } from './project';
-import { getDrive } from "./fixtures"
-import { type DataClassification, type InputDriveOffboardSubmission } from './client';
+import { type DataClassification, type InputDriveOffboardSubmission, type ProjectChanges, type ProjectWithDriveMember, type ResearchDriveService } from './client';
 
 interface FormStateStore {
     hasStartedForm: boolean;
     hasFinishedForm: boolean;
     isCorrectDrive: boolean | null;
     areProjectDetailsCorrect: boolean | null;
-    project: Project;
+    projectChanges: ProjectChanges;
     dataClassification: DataClassification | null;
     retentionPeriod: number | null;
     isRetentionPeriodCustom: boolean | null;
-    getSubmission: () => InputDriveOffboardSubmission | null;
 }
 
 export const formState: FormStateStore = reactive({
@@ -20,24 +17,41 @@ export const formState: FormStateStore = reactive({
     hasFinishedForm: false,
     isCorrectDrive: null,
     areProjectDetailsCorrect: null,
-    project: makeProject(),
+    projectChanges: {},
     dataClassification: null,
     isRetentionPeriodCustom: null,
-    retentionPeriod: null,
-    getSubmission: function () {
-        if (!this.dataClassification || !this.retentionPeriod) {
-            return null;
-        } else {
-            return {
-                dataClassification: this.dataClassification,
-                retentionPeriodYears: this.retentionPeriod,
-                isCompleted: true,
-                driveName: getDrive().name,
-                projectChanges: {
-                    title: this.project.title,
-                    description: this.project.description
-                }
-            }
-        }
+    retentionPeriod: null
+});
+
+interface ArchiveRequestInfoStore {
+    isLoading: boolean,
+    error: any,
+    project: ProjectWithDriveMember,
+    drive: ResearchDriveService
+}
+
+export const requestInfo: ArchiveRequestInfoStore = reactive({
+    isLoading: false,
+    error: undefined,
+    project: {
+        title: "",
+        description: "",
+        division: "",
+        start_date: "",
+        end_date: "",
+        id: 0,
+        research_drives: [],
+        members: [],
+        codes: []
+    },
+    drive: {
+        allocated_gb: 0,
+        date: "",
+        first_day: "",
+        last_day: "",
+        free_gb: 0,
+        name: "",
+        percentage_used: 0,
+        used_gb: 0
     }
-});
\ No newline at end of file
+}) 
\ No newline at end of file
diff --git a/web/src/views/CheckDetailsView.vue b/web/src/views/CheckDetailsView.vue
index c162529..53a645b 100644
--- a/web/src/views/CheckDetailsView.vue
+++ b/web/src/views/CheckDetailsView.vue
@@ -1,7 +1,6 @@
 <script setup lang="ts">
-import { getDrive, getProject } from '@/fixtures';
-import { membersToString, getProjectMembers, getProjectOwners } from '@/project';
-import { formState } from '@/store';
+import { membersToString, getProjectMembers, getProjectOwners } from '@/models/helpers';
+import { formState, requestInfo } from '@/store';
 import { ref } from 'vue';
 import { useRouter } from 'vue-router';
 
@@ -11,18 +10,14 @@ document.title = DOCUMENT_TITLE;
 
 const error =ref("");
 const router = useRouter();
-const driveInfo = getDrive();
-const project = getProject();
-const owners = membersToString(getProjectOwners(project.members));
-const members = membersToString(getProjectMembers(project.members));
+const owners = membersToString(getProjectOwners(requestInfo.project.members));
+const members = membersToString(getProjectMembers(requestInfo.project.members));
 
 function tryContinue() {
     if (formState.areProjectDetailsCorrect === null){
         document.title = "Error: " + DOCUMENT_TITLE;
         error.value = "Select Yes if the project information is still correct.";
     } else if (formState.areProjectDetailsCorrect) {
-            // Copy project details over as they are correct.
-            formState.project = Object.assign({}, getProject());
             router.push("/data-classification");
     } else {
         router.push("/update-details");
@@ -40,18 +35,18 @@ function tryContinue() {
             <p>Correct project information is important for archiving. If required, the information is used to find the right archived files and determine whether to grant or deny access requests.</p> 
         </div> 
     <section class="project-details-card box">
-        <h3 class="h2">Project information for {{ driveInfo.name }}</h3>
+        <h3 class="h2">Project information for {{ requestInfo.drive.name }}</h3>
         <dl class="other-details">
             <dt>Title</dt>
-            <dl>{{ project.title}}</dl>
+            <dl>{{ requestInfo.project.title}}</dl>
             <dt>Description</dt>
-            <dl>{{ project.description}}</dl>
+            <dl>{{ requestInfo.project.description}}</dl>
             <dt>Project owner</dt>
             <dl>{{ owners }}</dl>
             <dt>Project members</dt>
             <dl>{{ members }}</dl>
             <dt>Department</dt>
-            <dl>{{ project.division }}</dl>
+            <dl>{{ requestInfo.project.division }}</dl>
         </dl>
     </section>
     <form novalidate @submit.prevent="tryContinue()" :class="{ error : error }">
diff --git a/web/src/views/ConfirmArchiveView.vue b/web/src/views/ConfirmArchiveView.vue
index eec9c66..0d7a3cd 100644
--- a/web/src/views/ConfirmArchiveView.vue
+++ b/web/src/views/ConfirmArchiveView.vue
@@ -1,26 +1,39 @@
 <script lang="ts" setup>
 import { appendDriveInfoApiV1SubmissionPost } from '@/client';
-import { getProjectMembers, getProjectOwners, membersToString } from '@/project';
-import { formState } from '@/store';
+import { getProjectMembers, getProjectOwners, membersToString } from '@/models/helpers';
+import { formState, requestInfo } from '@/store';
 import { useRouter } from 'vue-router';
 
 const DOCUMENT_TITLE = "Check your answers - Archive your research drive";
 document.title = DOCUMENT_TITLE;
 
 const router = useRouter();
-const projectOwners = membersToString(getProjectOwners(formState.project.members));
-const projectMembers = membersToString(getProjectMembers(formState.project.members));
+const projectOwners = membersToString(getProjectOwners(requestInfo.project.members));
+const projectMembers = membersToString(getProjectMembers(requestInfo.project.members));
+
+// Display changed title and description if available, original if not.
+const projectTitle = formState.projectChanges.title || requestInfo.project.title;
+const projectDescription = formState.projectChanges.description || requestInfo.project.description;
 
 // If the user has stated the details aren't correct, the Change links should go to the Update page. 
 const projectInfoChangeLink = formState.areProjectDetailsCorrect ? "/check-details" : "/update-details"; 
 
 async function submit(){
-    const submission = formState.getSubmission();
-    if (!submission) {
+    const dataClassification = formState.dataClassification;
+    const retentionPeriod = formState.retentionPeriod;
+    if (dataClassification === null || retentionPeriod === null ){
         // Form is not yet complete!
         // This should not happen.
         return;
     }
+    const submission = {
+        dataClassification,
+        retentionPeriodYears: retentionPeriod,
+        isCompleted: true,
+        driveName: requestInfo.drive.name,
+        projectChanges: formState.projectChanges
+
+    }
     const req = await appendDriveInfoApiV1SubmissionPost({
         body: submission
     });
@@ -47,12 +60,12 @@ async function submit(){
         <tbody>
             <tr>
                 <td>Project name</td>
-                <td>{{  formState.project.title  }}</td>
+                <td>{{  projectTitle  }}</td>
                 <td><RouterLink :to="projectInfoChangeLink">Change</RouterLink></td>
             </tr>
             <tr>
                 <td>Project description</td>
-                <td> {{ formState.project.description }}</td>
+                <td> {{ projectDescription }}</td>
                 <td><RouterLink :to="projectInfoChangeLink">Change</RouterLink></td>
             </tr>
             <tr>
@@ -67,7 +80,7 @@ async function submit(){
             </tr>
             <tr>
                 <td>Department</td>
-                <td>{{  formState.project.division }}</td>
+                <td>{{  requestInfo.project.division }}</td>
                 <td><!--<a href="#" class="btn-link">Change</a>--></td>
             </tr>
         </tbody>
diff --git a/web/src/views/HomeView.vue b/web/src/views/HomeView.vue
index 8139160..d806977 100644
--- a/web/src/views/HomeView.vue
+++ b/web/src/views/HomeView.vue
@@ -20,10 +20,9 @@ function nextStep() {
     <p>Use this service if you have a research storage drive you no longer use.</p>
     <p>You can use this service to:</p>
     <ul>
-      <li>Confirm you want to archive the research drive. </li>
       <li>Check and update research storage drive details.</li>
       <li>Declare data classification and retention period for the stored files.</li>
-      <li>Add additional metadata to annotate your files.</li>
+      <li>Confirm you want to archive the research drive. </li>
     </ul>
     <section class="forward-btn">
       <a @click="nextStep()" class="btn btn-primary">Start</a>
@@ -42,10 +41,6 @@ function nextStep() {
     </ul>
   </section>
   </section>
-    <!-- <section class="before-you-start">
-      <h2>Before you start</h2>
-      <p>This service will ask you to confirm details such as .  Ensure you and your collaborators no longer actively use this drive. </p>
-    </section> -->
   </main>
 </template>
 
diff --git a/web/src/views/SummaryView.vue b/web/src/views/SummaryView.vue
index cb513d9..4a44817 100644
--- a/web/src/views/SummaryView.vue
+++ b/web/src/views/SummaryView.vue
@@ -1,17 +1,14 @@
 <script setup lang="ts">
 import { useRouter } from 'vue-router';
 import { ref } from 'vue';
-import { formState } from '@/store';
-import { getDrive } from '@/fixtures';
+import { formState, requestInfo } from '@/store';
 
 
 const DOCUMENT_TITLE = "Confirm research drive - Archive your research drive"; 
 document.title = DOCUMENT_TITLE;
 
-// const isCorrectDrive = ref();
 const error = ref("");
 const router = useRouter();
-const driveInfo = getDrive();
 
 function tryContinue() {
     if (formState.isCorrectDrive === null){
@@ -40,11 +37,11 @@ function tryContinue() {
             <h3 class="h2">Drive information</h3>
             <dl class="details">
                 <dt>Name</dt>
-                <dl>{{ driveInfo.name }}</dl>
+                <dl>{{ requestInfo.drive.name }}</dl>
                 <dt>Total space</dt>
-                <dl>{{ driveInfo.allocated_gb }}GB</dl>
+                <dl>{{ requestInfo.drive.allocated_gb }}GB</dl>
                 <dt>Used space</dt>
-                <dl>{{ driveInfo.used_gb }}GB</dl>
+                <dl>{{ requestInfo.drive.used_gb }}GB</dl>
             </dl>
         </section>
         <form novalidate @submit.prevent="tryContinue()">
diff --git a/web/src/views/UpdateDetailsView.vue b/web/src/views/UpdateDetailsView.vue
index 83b014d..1761eae 100644
--- a/web/src/views/UpdateDetailsView.vue
+++ b/web/src/views/UpdateDetailsView.vue
@@ -1,32 +1,30 @@
 <script lang="ts" setup>
-import { getProject } from "@/fixtures";
-import { formState } from "@/store";
+import { formState, requestInfo } from "@/store";
 import { ref } from "vue";
 import { useRouter } from "vue-router";
 
 const DOCUMENT_TITLE = "Update project title and description - Archive your research drive"; 
 document.title = DOCUMENT_TITLE;
 
-
+const title = ref("");
 const titleError = ref("");
+const description = ref("");
 const descriptionError = ref("");
-// If no value from user input yet, set default title and description. 
-if (formState.project.title === "") {
-    formState.project.title = getProject().title;
-}
-if (formState.project.description === "") {
-    formState.project.description = getProject().description;
-}
+
+// Set default title and description based on previous user input or original info. 
+title.value = formState.projectChanges.title || requestInfo.project.title;
+description.value = formState.projectChanges.description || 
+                    requestInfo.project.description;
 const router = useRouter();
 
 
 function tryContinue() {
-    if (formState.project.title.trim() === ""){
+    if (title.value.trim() === ""){
         titleError.value = "Enter a title for the project."
     } else {
         titleError.value = "";
     }
-    if (formState.project.description.trim() === "") {
+    if (description.value.trim() === "") {
         descriptionError.value = "Enter a description for the project."
     } else {
         descriptionError.value = "";
@@ -36,10 +34,9 @@ function tryContinue() {
         document.title = "Error: " + DOCUMENT_TITLE;
         return;
     }
-    // Otherwise, copy over members, division and go to the next page
-    formState.project.members = getProject().members;
-    formState.project.division = getProject().division;
-
+    // If everything is ok, set project changes with title and description.
+    formState.projectChanges.title = title.value;
+    formState.projectChanges.description = description.value;
     router.push("data-classification");
 }
 </script>
@@ -53,12 +50,12 @@ function tryContinue() {
             <div class="form-group" :class="{ error : titleError }">
                 <label for="project-title" class="h2">Title</label>
                 <p v-if="titleError" class="error-msg">{{ titleError }}</p>
-                <input type="text" id="project-title" v-model="formState.project.title">
+                <input type="text" id="project-title" v-model="title">
             </div>
             <div class="form-group" :class="{ error : descriptionError }">
                 <label for="project-description" class="h2">Description</label>
                 <p v-if="descriptionError" class="error-msg">{{ descriptionError }}</p>
-                <textarea id="project-description" v-model="formState.project.description"></textarea>
+                <textarea id="project-description" v-model="description"></textarea>
             </div>
         </form>
         <section class="forward-btn">