diff --git a/src/profile-v2/NotFoundPage.test.jsx b/src/profile-v2/NotFoundPage.test.jsx
new file mode 100644
index 0000000..f14021d
--- /dev/null
+++ b/src/profile-v2/NotFoundPage.test.jsx
@@ -0,0 +1,24 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import { IntlProvider } from '@edx/frontend-platform/i18n';
+import NotFoundPage from './NotFoundPage';
+
+describe('NotFoundPage Snapshot Tests', () => {
+  it('renders correctly', () => {
+    const { asFragment } = render(
+      <IntlProvider locale="en">
+        <NotFoundPage />
+      </IntlProvider>,
+    );
+    expect(asFragment()).toMatchSnapshot();
+  });
+
+  it('renders with custom props', () => {
+    const { asFragment } = render(
+      <IntlProvider locale="en">
+        <NotFoundPage message="Custom not found message" />
+      </IntlProvider>,
+    );
+    expect(asFragment()).toMatchSnapshot();
+  });
+});
diff --git a/src/profile-v2/ProfilePage.test.jsx b/src/profile-v2/ProfilePage.test.jsx
index d186c48..4374110 100644
--- a/src/profile-v2/ProfilePage.test.jsx
+++ b/src/profile-v2/ProfilePage.test.jsx
@@ -256,4 +256,261 @@ describe('<ProfilePage />', () => {
       expect(navigate).toHaveBeenCalledWith('/notfound');
     });
   });
+
+  describe('form fields', () => {
+    it('renders all form fields for own profile', () => {
+      const contextValue = {
+        authenticatedUser: { userId: 123, username: 'staff', administrator: true },
+        config: getConfig(),
+      };
+      const { getByText } = render(
+        <ProfilePageWrapper
+          contextValue={contextValue}
+          store={mockStore(storeMocks.viewOwnProfile)}
+        />,
+      );
+
+      expect(getByText('Full name')).toBeInTheDocument();
+      expect(getByText('Country')).toBeInTheDocument();
+      expect(getByText('Bio')).toBeInTheDocument();
+      expect(getByText('Education')).toBeInTheDocument();
+      expect(getByText('Primary language spoken')).toBeInTheDocument();
+    });
+  });
+
+  describe('handles invalid user', () => {
+    it('navigates to not found page for invalid user', () => {
+      const contextValue = {
+        authenticatedUser: { userId: 123, username: 'staff', administrator: true },
+        config: getConfig(),
+      };
+      const navigate = jest.fn();
+      useNavigate.mockReturnValue(navigate);
+      render(
+        <ProfilePageWrapper
+          contextValue={contextValue}
+          store={mockStore(storeMocks.invalidUser)}
+          params={{ username: 'invalidUser' }}
+        />,
+      );
+
+      expect(navigate).toHaveBeenCalledWith('/notfound');
+    });
+  });
+
+  describe('handles empty profile', () => {
+    it('renders empty profile state', () => {
+      const contextValue = {
+        authenticatedUser: { userId: 123, username: 'staff', administrator: true },
+        config: getConfig(),
+      };
+      const component = (
+        <ProfilePageWrapper
+          contextValue={contextValue}
+          store={mockStore(storeMocks.viewOtherProfile)}
+          params={{ username: 'empty' }}
+        />
+      );
+      const { container: tree } = render(component);
+      expect(tree).toMatchSnapshot();
+    });
+  });
+
+  describe('handles profile with only username', () => {
+    it('renders profile with only username', () => {
+      const contextValue = {
+        authenticatedUser: { userId: 123, username: 'staff', administrator: true },
+        config: getConfig(),
+      };
+      const component = (
+        <ProfilePageWrapper
+          contextValue={contextValue}
+          store={mockStore(storeMocks.viewOtherProfile)}
+          params={{ username: 'onlyUsername' }}
+        />
+      );
+      const { container: tree } = render(component);
+      expect(tree).toMatchSnapshot();
+    });
+  });
+
+  describe('handles profile with no social links', () => {
+    it('renders profile without social links', () => {
+      const contextValue = {
+        authenticatedUser: { userId: 123, username: 'staff', administrator: true },
+        config: getConfig(),
+      };
+      const component = (
+        <ProfilePageWrapper
+          contextValue={contextValue}
+          store={mockStore(storeMocks.viewOtherProfile)}
+          params={{ username: 'noSocialLinks' }}
+        />
+      );
+      const { container: tree } = render(component);
+      expect(tree).toMatchSnapshot();
+    });
+  });
+
+  describe('handles profile with only social links', () => {
+    it('renders profile with only social links', () => {
+      const contextValue = {
+        authenticatedUser: { userId: 123, username: 'staff', administrator: true },
+        config: getConfig(),
+      };
+      const component = (
+        <ProfilePageWrapper
+          contextValue={contextValue}
+          store={mockStore(storeMocks.viewOtherProfile)}
+          params={{ username: 'onlySocialLinks' }}
+        />
+      );
+      const { container: tree } = render(component);
+      expect(tree).toMatchSnapshot();
+    });
+  });
+
+  describe('handles profile with only bio', () => {
+    it('renders profile with only bio', () => {
+      const contextValue = {
+        authenticatedUser: { userId: 123, username: 'staff', administrator: true },
+        config: getConfig(),
+      };
+      const component = (
+        <ProfilePageWrapper
+          contextValue={contextValue}
+          store={mockStore(storeMocks.viewOtherProfile)}
+          params={{ username: 'onlyBio' }}
+        />
+      );
+      const { container: tree } = render(component);
+      expect(tree).toMatchSnapshot();
+    });
+  });
+
+  describe('handles profile with only country', () => {
+    it('renders profile with only country', () => {
+      const contextValue = {
+        authenticatedUser: { userId: 123, username: 'staff', administrator: true },
+        config: getConfig(),
+      };
+      const component = (
+        <ProfilePageWrapper
+          contextValue={contextValue}
+          store={mockStore(storeMocks.viewOtherProfile)}
+          params={{ username: 'onlyCountry' }}
+        />
+      );
+      const { container: tree } = render(component);
+      expect(tree).toMatchSnapshot();
+    });
+  });
+
+  describe('handles profile with only level of education', () => {
+    it('renders profile with only level of education', () => {
+      const contextValue = {
+        authenticatedUser: { userId: 123, username: 'staff', administrator: true },
+        config: getConfig(),
+      };
+      const component = (
+        <ProfilePageWrapper
+          contextValue={contextValue}
+          store={mockStore(storeMocks.viewOtherProfile)}
+          params={{ username: 'onlyLevelOfEducation' }}
+        />
+      );
+      const { container: tree } = render(component);
+      expect(tree).toMatchSnapshot();
+    });
+  });
+
+  describe('handles profile with only language proficiencies', () => {
+    it('renders profile with only language proficiencies', () => {
+      const contextValue = {
+        authenticatedUser: { userId: 123, username: 'staff', administrator: true },
+        config: getConfig(),
+      };
+      const component = (
+        <ProfilePageWrapper
+          contextValue={contextValue}
+          store={mockStore(storeMocks.viewOtherProfile)}
+          params={{ username: 'onlyLanguageProficiencies' }}
+        />
+      );
+      const { container: tree } = render(component);
+      expect(tree).toMatchSnapshot();
+    });
+  });
+
+  describe('handles profile with only course certificates', () => {
+    it('renders profile with only course certificates', () => {
+      const contextValue = {
+        authenticatedUser: { userId: 123, username: 'staff', administrator: true },
+        config: getConfig(),
+      };
+      const component = (
+        <ProfilePageWrapper
+          contextValue={contextValue}
+          store={mockStore(storeMocks.viewOtherProfile)}
+          params={{ username: 'onlyCourseCertificates' }}
+        />
+      );
+      const { container: tree } = render(component);
+      expect(tree).toMatchSnapshot();
+    });
+  });
+
+  describe('handles profile with only name', () => {
+    it('renders profile with only name', () => {
+      const contextValue = {
+        authenticatedUser: { userId: 123, username: 'staff', administrator: true },
+        config: getConfig(),
+      };
+      const component = (
+        <ProfilePageWrapper
+          contextValue={contextValue}
+          store={mockStore(storeMocks.viewOtherProfile)}
+          params={{ username: 'onlyName' }}
+        />
+      );
+      const { container: tree } = render(component);
+      expect(tree).toMatchSnapshot();
+    });
+  });
+
+  describe('handles profile with only username and no other fields', () => {
+    it('renders profile with only username', () => {
+      const contextValue = {
+        authenticatedUser: { userId: 123, username: 'staff', administrator: true },
+        config: getConfig(),
+      };
+      const component = (
+        <ProfilePageWrapper
+          contextValue={contextValue}
+          store={mockStore(storeMocks.viewOtherProfile)}
+          params={{ username: 'onlyUsernameNoFields' }}
+        />
+      );
+      const { container: tree } = render(component);
+      expect(tree).toMatchSnapshot();
+    });
+  });
+
+  describe('handles profile with no fields and no username', () => {
+    it('renders empty profile state', () => {
+      const contextValue = {
+        authenticatedUser: { userId: 123, username: 'staff', administrator: true },
+        config: getConfig(),
+      };
+      const component = (
+        <ProfilePageWrapper
+          contextValue={contextValue}
+          store={mockStore(storeMocks.viewOtherProfile)}
+          params={{ username: '' }}
+        />
+      );
+      const { container: tree } = render(component);
+      expect(tree).toMatchSnapshot();
+    });
+  });
 });
diff --git a/src/profile-v2/__snapshots__/NotFoundPage.test.jsx.snap b/src/profile-v2/__snapshots__/NotFoundPage.test.jsx.snap
new file mode 100644
index 0000000..60bc1d4
--- /dev/null
+++ b/src/profile-v2/__snapshots__/NotFoundPage.test.jsx.snap
@@ -0,0 +1,29 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`NotFoundPage Snapshot Tests renders correctly 1`] = `
+<DocumentFragment>
+  <div
+    class="container-fluid d-flex py-5 justify-content-center align-items-start text-center"
+  >
+    <p
+      class="my-0 py-5 text-muted max-width-32em"
+    >
+      The page you're looking for is unavailable or there's an error in the URL. Please check the URL and try again.
+    </p>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`NotFoundPage Snapshot Tests renders with custom props 1`] = `
+<DocumentFragment>
+  <div
+    class="container-fluid d-flex py-5 justify-content-center align-items-start text-center"
+  >
+    <p
+      class="my-0 py-5 text-muted max-width-32em"
+    >
+      The page you're looking for is unavailable or there's an error in the URL. Please check the URL and try again.
+    </p>
+  </div>
+</DocumentFragment>
+`;
diff --git a/src/profile-v2/__snapshots__/ProfilePage.test.jsx.snap b/src/profile-v2/__snapshots__/ProfilePage.test.jsx.snap
index 2280c10..377fb63 100644
--- a/src/profile-v2/__snapshots__/ProfilePage.test.jsx.snap
+++ b/src/profile-v2/__snapshots__/ProfilePage.test.jsx.snap
@@ -2017,3 +2017,1655 @@ exports[`<ProfilePage /> Renders correctly in various states without credentials
   </div>
 </div>
 `;
+
+exports[`<ProfilePage /> handles empty profile renders empty profile state 1`] = `
+<div>
+  <div
+    class="profile-page"
+  >
+    <div
+      class="profile-page-bg-banner bg-primary d-md-block align-items-center h-100 w-100 px-120px py-5.5"
+    >
+      <div
+        class="col container-fluid w-100 h-100 bg-white py-0 rounded-75 px-40px"
+      >
+        <div
+          class="col h-100 w-100 px-0 justify-content-start g-15rem py-36px"
+        >
+          <div
+            class="row-auto d-flex flex-wrap align-items-center h-100 w-100 justify-content-start g-15rem flex-row"
+          >
+            <div
+              class="profile-avatar-wrap position-relative"
+            >
+              <div
+                class="profile-avatar rounded-circle bg-light"
+              >
+                <div
+                  aria-hidden="true"
+                  class="text-muted"
+                  data-testid="IconMock"
+                  focusable="false"
+                  role="img"
+                  viewbox="0 0 24 24"
+                />
+              </div>
+              <form
+                enctype="multipart/form-data"
+              >
+                <input
+                  accept=".jpg, .jpeg, .png"
+                  class="d-none form-control-file"
+                  id="photo-file"
+                  name="file"
+                  type="file"
+                />
+              </form>
+            </div>
+            <div
+              class="col h-100 w-100 m-0 p-0 justify-content-start align-items-start"
+            >
+              <p
+                class="row m-0 font-weight-bold text-truncate text-primary-500 h3"
+              >
+                empty
+              </p>
+              <div
+                class="row pt-2 m-0 g-1rem"
+              >
+                <span
+                  class="small mb-0 text-gray-800"
+                >
+                  Member since 
+                  <span
+                    class="font-weight-bold"
+                  >
+                     
+                    2017
+                     
+                  </span>
+                </span>
+              </div>
+            </div>
+            <div
+              class="p-0  col-auto"
+            />
+          </div>
+        </div>
+        <div
+          class="ml-auto"
+        />
+      </div>
+    </div>
+    <div
+      class="col d-inline-flex h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    >
+      <div
+        class="w-100 p-0"
+      >
+        <div
+          class="col justify-content-start align-items-start p-0"
+        >
+          <div
+            class="col align-self-stretch height-42px justify-content-start align-items-start p-0"
+          >
+            <p
+              class="font-weight-bold text-primary-500 m-0 h2"
+            >
+              Profile information
+            </p>
+          </div>
+        </div>
+        <div
+          class="row m-0 px-0 w-100 d-inline-flex align-items-start justify-content-start pt-5.5"
+        >
+          <div
+            class="col p-0 col-6"
+          >
+            <div
+              class="m-0"
+            >
+              <div
+                class="row m-0 pb-1.5 align-items-center"
+              >
+                <p
+                  class="h5 font-weight-bold m-0"
+                  data-hj-suppress="true"
+                >
+                  Username
+                </p>
+                <svg
+                  class="m-0 info-icon"
+                  fill="none"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  width="24"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M11 7h2v2h-2V7Zm0 4h2v6h-2v-6Zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2Zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </div>
+              <h4
+                class="edit-section-header text-gray-700"
+              >
+                empty
+              </h4>
+            </div>
+          </div>
+          <div
+            class="col m-0 pr-0 pl-40px col-6"
+          />
+        </div>
+      </div>
+    </div>
+    <div
+      class="col container-fluid d-inline-flex bg-color-grey-FBFAF9 h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    />
+  </div>
+</div>
+`;
+
+exports[`<ProfilePage /> handles profile with no fields and no username renders empty profile state 1`] = `<div />`;
+
+exports[`<ProfilePage /> handles profile with no social links renders profile without social links 1`] = `
+<div>
+  <div
+    class="profile-page"
+  >
+    <div
+      class="profile-page-bg-banner bg-primary d-md-block align-items-center h-100 w-100 px-120px py-5.5"
+    >
+      <div
+        class="col container-fluid w-100 h-100 bg-white py-0 rounded-75 px-40px"
+      >
+        <div
+          class="col h-100 w-100 px-0 justify-content-start g-15rem py-36px"
+        >
+          <div
+            class="row-auto d-flex flex-wrap align-items-center h-100 w-100 justify-content-start g-15rem flex-row"
+          >
+            <div
+              class="profile-avatar-wrap position-relative"
+            >
+              <div
+                class="profile-avatar rounded-circle bg-light"
+              >
+                <div
+                  aria-hidden="true"
+                  class="text-muted"
+                  data-testid="IconMock"
+                  focusable="false"
+                  role="img"
+                  viewbox="0 0 24 24"
+                />
+              </div>
+              <form
+                enctype="multipart/form-data"
+              >
+                <input
+                  accept=".jpg, .jpeg, .png"
+                  class="d-none form-control-file"
+                  id="photo-file"
+                  name="file"
+                  type="file"
+                />
+              </form>
+            </div>
+            <div
+              class="col h-100 w-100 m-0 p-0 justify-content-start align-items-start"
+            >
+              <p
+                class="row m-0 font-weight-bold text-truncate text-primary-500 h3"
+              >
+                noSocialLinks
+              </p>
+              <div
+                class="row pt-2 m-0 g-1rem"
+              >
+                <span
+                  class="small mb-0 text-gray-800"
+                >
+                  Member since 
+                  <span
+                    class="font-weight-bold"
+                  >
+                     
+                    2017
+                     
+                  </span>
+                </span>
+              </div>
+            </div>
+            <div
+              class="p-0  col-auto"
+            />
+          </div>
+        </div>
+        <div
+          class="ml-auto"
+        />
+      </div>
+    </div>
+    <div
+      class="col d-inline-flex h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    >
+      <div
+        class="w-100 p-0"
+      >
+        <div
+          class="col justify-content-start align-items-start p-0"
+        >
+          <div
+            class="col align-self-stretch height-42px justify-content-start align-items-start p-0"
+          >
+            <p
+              class="font-weight-bold text-primary-500 m-0 h2"
+            >
+              Profile information
+            </p>
+          </div>
+        </div>
+        <div
+          class="row m-0 px-0 w-100 d-inline-flex align-items-start justify-content-start pt-5.5"
+        >
+          <div
+            class="col p-0 col-6"
+          >
+            <div
+              class="m-0"
+            >
+              <div
+                class="row m-0 pb-1.5 align-items-center"
+              >
+                <p
+                  class="h5 font-weight-bold m-0"
+                  data-hj-suppress="true"
+                >
+                  Username
+                </p>
+                <svg
+                  class="m-0 info-icon"
+                  fill="none"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  width="24"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M11 7h2v2h-2V7Zm0 4h2v6h-2v-6Zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2Zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </div>
+              <h4
+                class="edit-section-header text-gray-700"
+              >
+                noSocialLinks
+              </h4>
+            </div>
+          </div>
+          <div
+            class="col m-0 pr-0 pl-40px col-6"
+          />
+        </div>
+      </div>
+    </div>
+    <div
+      class="col container-fluid d-inline-flex bg-color-grey-FBFAF9 h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    />
+  </div>
+</div>
+`;
+
+exports[`<ProfilePage /> handles profile with only bio renders profile with only bio 1`] = `
+<div>
+  <div
+    class="profile-page"
+  >
+    <div
+      class="profile-page-bg-banner bg-primary d-md-block align-items-center h-100 w-100 px-120px py-5.5"
+    >
+      <div
+        class="col container-fluid w-100 h-100 bg-white py-0 rounded-75 px-40px"
+      >
+        <div
+          class="col h-100 w-100 px-0 justify-content-start g-15rem py-36px"
+        >
+          <div
+            class="row-auto d-flex flex-wrap align-items-center h-100 w-100 justify-content-start g-15rem flex-row"
+          >
+            <div
+              class="profile-avatar-wrap position-relative"
+            >
+              <div
+                class="profile-avatar rounded-circle bg-light"
+              >
+                <div
+                  aria-hidden="true"
+                  class="text-muted"
+                  data-testid="IconMock"
+                  focusable="false"
+                  role="img"
+                  viewbox="0 0 24 24"
+                />
+              </div>
+              <form
+                enctype="multipart/form-data"
+              >
+                <input
+                  accept=".jpg, .jpeg, .png"
+                  class="d-none form-control-file"
+                  id="photo-file"
+                  name="file"
+                  type="file"
+                />
+              </form>
+            </div>
+            <div
+              class="col h-100 w-100 m-0 p-0 justify-content-start align-items-start"
+            >
+              <p
+                class="row m-0 font-weight-bold text-truncate text-primary-500 h3"
+              >
+                onlyBio
+              </p>
+              <div
+                class="row pt-2 m-0 g-1rem"
+              >
+                <span
+                  class="small mb-0 text-gray-800"
+                >
+                  Member since 
+                  <span
+                    class="font-weight-bold"
+                  >
+                     
+                    2017
+                     
+                  </span>
+                </span>
+              </div>
+            </div>
+            <div
+              class="p-0  col-auto"
+            />
+          </div>
+        </div>
+        <div
+          class="ml-auto"
+        />
+      </div>
+    </div>
+    <div
+      class="col d-inline-flex h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    >
+      <div
+        class="w-100 p-0"
+      >
+        <div
+          class="col justify-content-start align-items-start p-0"
+        >
+          <div
+            class="col align-self-stretch height-42px justify-content-start align-items-start p-0"
+          >
+            <p
+              class="font-weight-bold text-primary-500 m-0 h2"
+            >
+              Profile information
+            </p>
+          </div>
+        </div>
+        <div
+          class="row m-0 px-0 w-100 d-inline-flex align-items-start justify-content-start pt-5.5"
+        >
+          <div
+            class="col p-0 col-6"
+          >
+            <div
+              class="m-0"
+            >
+              <div
+                class="row m-0 pb-1.5 align-items-center"
+              >
+                <p
+                  class="h5 font-weight-bold m-0"
+                  data-hj-suppress="true"
+                >
+                  Username
+                </p>
+                <svg
+                  class="m-0 info-icon"
+                  fill="none"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  width="24"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M11 7h2v2h-2V7Zm0 4h2v6h-2v-6Zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2Zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </div>
+              <h4
+                class="edit-section-header text-gray-700"
+              >
+                onlyBio
+              </h4>
+            </div>
+          </div>
+          <div
+            class="col m-0 pr-0 pl-40px col-6"
+          />
+        </div>
+      </div>
+    </div>
+    <div
+      class="col container-fluid d-inline-flex bg-color-grey-FBFAF9 h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    />
+  </div>
+</div>
+`;
+
+exports[`<ProfilePage /> handles profile with only country renders profile with only country 1`] = `
+<div>
+  <div
+    class="profile-page"
+  >
+    <div
+      class="profile-page-bg-banner bg-primary d-md-block align-items-center h-100 w-100 px-120px py-5.5"
+    >
+      <div
+        class="col container-fluid w-100 h-100 bg-white py-0 rounded-75 px-40px"
+      >
+        <div
+          class="col h-100 w-100 px-0 justify-content-start g-15rem py-36px"
+        >
+          <div
+            class="row-auto d-flex flex-wrap align-items-center h-100 w-100 justify-content-start g-15rem flex-row"
+          >
+            <div
+              class="profile-avatar-wrap position-relative"
+            >
+              <div
+                class="profile-avatar rounded-circle bg-light"
+              >
+                <div
+                  aria-hidden="true"
+                  class="text-muted"
+                  data-testid="IconMock"
+                  focusable="false"
+                  role="img"
+                  viewbox="0 0 24 24"
+                />
+              </div>
+              <form
+                enctype="multipart/form-data"
+              >
+                <input
+                  accept=".jpg, .jpeg, .png"
+                  class="d-none form-control-file"
+                  id="photo-file"
+                  name="file"
+                  type="file"
+                />
+              </form>
+            </div>
+            <div
+              class="col h-100 w-100 m-0 p-0 justify-content-start align-items-start"
+            >
+              <p
+                class="row m-0 font-weight-bold text-truncate text-primary-500 h3"
+              >
+                onlyCountry
+              </p>
+              <div
+                class="row pt-2 m-0 g-1rem"
+              >
+                <span
+                  class="small mb-0 text-gray-800"
+                >
+                  Member since 
+                  <span
+                    class="font-weight-bold"
+                  >
+                     
+                    2017
+                     
+                  </span>
+                </span>
+              </div>
+            </div>
+            <div
+              class="p-0  col-auto"
+            />
+          </div>
+        </div>
+        <div
+          class="ml-auto"
+        />
+      </div>
+    </div>
+    <div
+      class="col d-inline-flex h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    >
+      <div
+        class="w-100 p-0"
+      >
+        <div
+          class="col justify-content-start align-items-start p-0"
+        >
+          <div
+            class="col align-self-stretch height-42px justify-content-start align-items-start p-0"
+          >
+            <p
+              class="font-weight-bold text-primary-500 m-0 h2"
+            >
+              Profile information
+            </p>
+          </div>
+        </div>
+        <div
+          class="row m-0 px-0 w-100 d-inline-flex align-items-start justify-content-start pt-5.5"
+        >
+          <div
+            class="col p-0 col-6"
+          >
+            <div
+              class="m-0"
+            >
+              <div
+                class="row m-0 pb-1.5 align-items-center"
+              >
+                <p
+                  class="h5 font-weight-bold m-0"
+                  data-hj-suppress="true"
+                >
+                  Username
+                </p>
+                <svg
+                  class="m-0 info-icon"
+                  fill="none"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  width="24"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M11 7h2v2h-2V7Zm0 4h2v6h-2v-6Zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2Zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </div>
+              <h4
+                class="edit-section-header text-gray-700"
+              >
+                onlyCountry
+              </h4>
+            </div>
+          </div>
+          <div
+            class="col m-0 pr-0 pl-40px col-6"
+          />
+        </div>
+      </div>
+    </div>
+    <div
+      class="col container-fluid d-inline-flex bg-color-grey-FBFAF9 h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    />
+  </div>
+</div>
+`;
+
+exports[`<ProfilePage /> handles profile with only course certificates renders profile with only course certificates 1`] = `
+<div>
+  <div
+    class="profile-page"
+  >
+    <div
+      class="profile-page-bg-banner bg-primary d-md-block align-items-center h-100 w-100 px-120px py-5.5"
+    >
+      <div
+        class="col container-fluid w-100 h-100 bg-white py-0 rounded-75 px-40px"
+      >
+        <div
+          class="col h-100 w-100 px-0 justify-content-start g-15rem py-36px"
+        >
+          <div
+            class="row-auto d-flex flex-wrap align-items-center h-100 w-100 justify-content-start g-15rem flex-row"
+          >
+            <div
+              class="profile-avatar-wrap position-relative"
+            >
+              <div
+                class="profile-avatar rounded-circle bg-light"
+              >
+                <div
+                  aria-hidden="true"
+                  class="text-muted"
+                  data-testid="IconMock"
+                  focusable="false"
+                  role="img"
+                  viewbox="0 0 24 24"
+                />
+              </div>
+              <form
+                enctype="multipart/form-data"
+              >
+                <input
+                  accept=".jpg, .jpeg, .png"
+                  class="d-none form-control-file"
+                  id="photo-file"
+                  name="file"
+                  type="file"
+                />
+              </form>
+            </div>
+            <div
+              class="col h-100 w-100 m-0 p-0 justify-content-start align-items-start"
+            >
+              <p
+                class="row m-0 font-weight-bold text-truncate text-primary-500 h3"
+              >
+                onlyCourseCertificates
+              </p>
+              <div
+                class="row pt-2 m-0 g-1rem"
+              >
+                <span
+                  class="small mb-0 text-gray-800"
+                >
+                  Member since 
+                  <span
+                    class="font-weight-bold"
+                  >
+                     
+                    2017
+                     
+                  </span>
+                </span>
+              </div>
+            </div>
+            <div
+              class="p-0  col-auto"
+            />
+          </div>
+        </div>
+        <div
+          class="ml-auto"
+        />
+      </div>
+    </div>
+    <div
+      class="col d-inline-flex h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    >
+      <div
+        class="w-100 p-0"
+      >
+        <div
+          class="col justify-content-start align-items-start p-0"
+        >
+          <div
+            class="col align-self-stretch height-42px justify-content-start align-items-start p-0"
+          >
+            <p
+              class="font-weight-bold text-primary-500 m-0 h2"
+            >
+              Profile information
+            </p>
+          </div>
+        </div>
+        <div
+          class="row m-0 px-0 w-100 d-inline-flex align-items-start justify-content-start pt-5.5"
+        >
+          <div
+            class="col p-0 col-6"
+          >
+            <div
+              class="m-0"
+            >
+              <div
+                class="row m-0 pb-1.5 align-items-center"
+              >
+                <p
+                  class="h5 font-weight-bold m-0"
+                  data-hj-suppress="true"
+                >
+                  Username
+                </p>
+                <svg
+                  class="m-0 info-icon"
+                  fill="none"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  width="24"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M11 7h2v2h-2V7Zm0 4h2v6h-2v-6Zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2Zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </div>
+              <h4
+                class="edit-section-header text-gray-700"
+              >
+                onlyCourseCertificates
+              </h4>
+            </div>
+          </div>
+          <div
+            class="col m-0 pr-0 pl-40px col-6"
+          />
+        </div>
+      </div>
+    </div>
+    <div
+      class="col container-fluid d-inline-flex bg-color-grey-FBFAF9 h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    />
+  </div>
+</div>
+`;
+
+exports[`<ProfilePage /> handles profile with only language proficiencies renders profile with only language proficiencies 1`] = `
+<div>
+  <div
+    class="profile-page"
+  >
+    <div
+      class="profile-page-bg-banner bg-primary d-md-block align-items-center h-100 w-100 px-120px py-5.5"
+    >
+      <div
+        class="col container-fluid w-100 h-100 bg-white py-0 rounded-75 px-40px"
+      >
+        <div
+          class="col h-100 w-100 px-0 justify-content-start g-15rem py-36px"
+        >
+          <div
+            class="row-auto d-flex flex-wrap align-items-center h-100 w-100 justify-content-start g-15rem flex-row"
+          >
+            <div
+              class="profile-avatar-wrap position-relative"
+            >
+              <div
+                class="profile-avatar rounded-circle bg-light"
+              >
+                <div
+                  aria-hidden="true"
+                  class="text-muted"
+                  data-testid="IconMock"
+                  focusable="false"
+                  role="img"
+                  viewbox="0 0 24 24"
+                />
+              </div>
+              <form
+                enctype="multipart/form-data"
+              >
+                <input
+                  accept=".jpg, .jpeg, .png"
+                  class="d-none form-control-file"
+                  id="photo-file"
+                  name="file"
+                  type="file"
+                />
+              </form>
+            </div>
+            <div
+              class="col h-100 w-100 m-0 p-0 justify-content-start align-items-start"
+            >
+              <p
+                class="row m-0 font-weight-bold text-truncate text-primary-500 h3"
+              >
+                onlyLanguageProficiencies
+              </p>
+              <div
+                class="row pt-2 m-0 g-1rem"
+              >
+                <span
+                  class="small mb-0 text-gray-800"
+                >
+                  Member since 
+                  <span
+                    class="font-weight-bold"
+                  >
+                     
+                    2017
+                     
+                  </span>
+                </span>
+              </div>
+            </div>
+            <div
+              class="p-0  col-auto"
+            />
+          </div>
+        </div>
+        <div
+          class="ml-auto"
+        />
+      </div>
+    </div>
+    <div
+      class="col d-inline-flex h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    >
+      <div
+        class="w-100 p-0"
+      >
+        <div
+          class="col justify-content-start align-items-start p-0"
+        >
+          <div
+            class="col align-self-stretch height-42px justify-content-start align-items-start p-0"
+          >
+            <p
+              class="font-weight-bold text-primary-500 m-0 h2"
+            >
+              Profile information
+            </p>
+          </div>
+        </div>
+        <div
+          class="row m-0 px-0 w-100 d-inline-flex align-items-start justify-content-start pt-5.5"
+        >
+          <div
+            class="col p-0 col-6"
+          >
+            <div
+              class="m-0"
+            >
+              <div
+                class="row m-0 pb-1.5 align-items-center"
+              >
+                <p
+                  class="h5 font-weight-bold m-0"
+                  data-hj-suppress="true"
+                >
+                  Username
+                </p>
+                <svg
+                  class="m-0 info-icon"
+                  fill="none"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  width="24"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M11 7h2v2h-2V7Zm0 4h2v6h-2v-6Zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2Zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </div>
+              <h4
+                class="edit-section-header text-gray-700"
+              >
+                onlyLanguageProficiencies
+              </h4>
+            </div>
+          </div>
+          <div
+            class="col m-0 pr-0 pl-40px col-6"
+          />
+        </div>
+      </div>
+    </div>
+    <div
+      class="col container-fluid d-inline-flex bg-color-grey-FBFAF9 h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    />
+  </div>
+</div>
+`;
+
+exports[`<ProfilePage /> handles profile with only level of education renders profile with only level of education 1`] = `
+<div>
+  <div
+    class="profile-page"
+  >
+    <div
+      class="profile-page-bg-banner bg-primary d-md-block align-items-center h-100 w-100 px-120px py-5.5"
+    >
+      <div
+        class="col container-fluid w-100 h-100 bg-white py-0 rounded-75 px-40px"
+      >
+        <div
+          class="col h-100 w-100 px-0 justify-content-start g-15rem py-36px"
+        >
+          <div
+            class="row-auto d-flex flex-wrap align-items-center h-100 w-100 justify-content-start g-15rem flex-row"
+          >
+            <div
+              class="profile-avatar-wrap position-relative"
+            >
+              <div
+                class="profile-avatar rounded-circle bg-light"
+              >
+                <div
+                  aria-hidden="true"
+                  class="text-muted"
+                  data-testid="IconMock"
+                  focusable="false"
+                  role="img"
+                  viewbox="0 0 24 24"
+                />
+              </div>
+              <form
+                enctype="multipart/form-data"
+              >
+                <input
+                  accept=".jpg, .jpeg, .png"
+                  class="d-none form-control-file"
+                  id="photo-file"
+                  name="file"
+                  type="file"
+                />
+              </form>
+            </div>
+            <div
+              class="col h-100 w-100 m-0 p-0 justify-content-start align-items-start"
+            >
+              <p
+                class="row m-0 font-weight-bold text-truncate text-primary-500 h3"
+              >
+                onlyLevelOfEducation
+              </p>
+              <div
+                class="row pt-2 m-0 g-1rem"
+              >
+                <span
+                  class="small mb-0 text-gray-800"
+                >
+                  Member since 
+                  <span
+                    class="font-weight-bold"
+                  >
+                     
+                    2017
+                     
+                  </span>
+                </span>
+              </div>
+            </div>
+            <div
+              class="p-0  col-auto"
+            />
+          </div>
+        </div>
+        <div
+          class="ml-auto"
+        />
+      </div>
+    </div>
+    <div
+      class="col d-inline-flex h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    >
+      <div
+        class="w-100 p-0"
+      >
+        <div
+          class="col justify-content-start align-items-start p-0"
+        >
+          <div
+            class="col align-self-stretch height-42px justify-content-start align-items-start p-0"
+          >
+            <p
+              class="font-weight-bold text-primary-500 m-0 h2"
+            >
+              Profile information
+            </p>
+          </div>
+        </div>
+        <div
+          class="row m-0 px-0 w-100 d-inline-flex align-items-start justify-content-start pt-5.5"
+        >
+          <div
+            class="col p-0 col-6"
+          >
+            <div
+              class="m-0"
+            >
+              <div
+                class="row m-0 pb-1.5 align-items-center"
+              >
+                <p
+                  class="h5 font-weight-bold m-0"
+                  data-hj-suppress="true"
+                >
+                  Username
+                </p>
+                <svg
+                  class="m-0 info-icon"
+                  fill="none"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  width="24"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M11 7h2v2h-2V7Zm0 4h2v6h-2v-6Zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2Zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </div>
+              <h4
+                class="edit-section-header text-gray-700"
+              >
+                onlyLevelOfEducation
+              </h4>
+            </div>
+          </div>
+          <div
+            class="col m-0 pr-0 pl-40px col-6"
+          />
+        </div>
+      </div>
+    </div>
+    <div
+      class="col container-fluid d-inline-flex bg-color-grey-FBFAF9 h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    />
+  </div>
+</div>
+`;
+
+exports[`<ProfilePage /> handles profile with only name renders profile with only name 1`] = `
+<div>
+  <div
+    class="profile-page"
+  >
+    <div
+      class="profile-page-bg-banner bg-primary d-md-block align-items-center h-100 w-100 px-120px py-5.5"
+    >
+      <div
+        class="col container-fluid w-100 h-100 bg-white py-0 rounded-75 px-40px"
+      >
+        <div
+          class="col h-100 w-100 px-0 justify-content-start g-15rem py-36px"
+        >
+          <div
+            class="row-auto d-flex flex-wrap align-items-center h-100 w-100 justify-content-start g-15rem flex-row"
+          >
+            <div
+              class="profile-avatar-wrap position-relative"
+            >
+              <div
+                class="profile-avatar rounded-circle bg-light"
+              >
+                <div
+                  aria-hidden="true"
+                  class="text-muted"
+                  data-testid="IconMock"
+                  focusable="false"
+                  role="img"
+                  viewbox="0 0 24 24"
+                />
+              </div>
+              <form
+                enctype="multipart/form-data"
+              >
+                <input
+                  accept=".jpg, .jpeg, .png"
+                  class="d-none form-control-file"
+                  id="photo-file"
+                  name="file"
+                  type="file"
+                />
+              </form>
+            </div>
+            <div
+              class="col h-100 w-100 m-0 p-0 justify-content-start align-items-start"
+            >
+              <p
+                class="row m-0 font-weight-bold text-truncate text-primary-500 h3"
+              >
+                onlyName
+              </p>
+              <div
+                class="row pt-2 m-0 g-1rem"
+              >
+                <span
+                  class="small mb-0 text-gray-800"
+                >
+                  Member since 
+                  <span
+                    class="font-weight-bold"
+                  >
+                     
+                    2017
+                     
+                  </span>
+                </span>
+              </div>
+            </div>
+            <div
+              class="p-0  col-auto"
+            />
+          </div>
+        </div>
+        <div
+          class="ml-auto"
+        />
+      </div>
+    </div>
+    <div
+      class="col d-inline-flex h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    >
+      <div
+        class="w-100 p-0"
+      >
+        <div
+          class="col justify-content-start align-items-start p-0"
+        >
+          <div
+            class="col align-self-stretch height-42px justify-content-start align-items-start p-0"
+          >
+            <p
+              class="font-weight-bold text-primary-500 m-0 h2"
+            >
+              Profile information
+            </p>
+          </div>
+        </div>
+        <div
+          class="row m-0 px-0 w-100 d-inline-flex align-items-start justify-content-start pt-5.5"
+        >
+          <div
+            class="col p-0 col-6"
+          >
+            <div
+              class="m-0"
+            >
+              <div
+                class="row m-0 pb-1.5 align-items-center"
+              >
+                <p
+                  class="h5 font-weight-bold m-0"
+                  data-hj-suppress="true"
+                >
+                  Username
+                </p>
+                <svg
+                  class="m-0 info-icon"
+                  fill="none"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  width="24"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M11 7h2v2h-2V7Zm0 4h2v6h-2v-6Zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2Zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </div>
+              <h4
+                class="edit-section-header text-gray-700"
+              >
+                onlyName
+              </h4>
+            </div>
+          </div>
+          <div
+            class="col m-0 pr-0 pl-40px col-6"
+          />
+        </div>
+      </div>
+    </div>
+    <div
+      class="col container-fluid d-inline-flex bg-color-grey-FBFAF9 h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    />
+  </div>
+</div>
+`;
+
+exports[`<ProfilePage /> handles profile with only social links renders profile with only social links 1`] = `
+<div>
+  <div
+    class="profile-page"
+  >
+    <div
+      class="profile-page-bg-banner bg-primary d-md-block align-items-center h-100 w-100 px-120px py-5.5"
+    >
+      <div
+        class="col container-fluid w-100 h-100 bg-white py-0 rounded-75 px-40px"
+      >
+        <div
+          class="col h-100 w-100 px-0 justify-content-start g-15rem py-36px"
+        >
+          <div
+            class="row-auto d-flex flex-wrap align-items-center h-100 w-100 justify-content-start g-15rem flex-row"
+          >
+            <div
+              class="profile-avatar-wrap position-relative"
+            >
+              <div
+                class="profile-avatar rounded-circle bg-light"
+              >
+                <div
+                  aria-hidden="true"
+                  class="text-muted"
+                  data-testid="IconMock"
+                  focusable="false"
+                  role="img"
+                  viewbox="0 0 24 24"
+                />
+              </div>
+              <form
+                enctype="multipart/form-data"
+              >
+                <input
+                  accept=".jpg, .jpeg, .png"
+                  class="d-none form-control-file"
+                  id="photo-file"
+                  name="file"
+                  type="file"
+                />
+              </form>
+            </div>
+            <div
+              class="col h-100 w-100 m-0 p-0 justify-content-start align-items-start"
+            >
+              <p
+                class="row m-0 font-weight-bold text-truncate text-primary-500 h3"
+              >
+                onlySocialLinks
+              </p>
+              <div
+                class="row pt-2 m-0 g-1rem"
+              >
+                <span
+                  class="small mb-0 text-gray-800"
+                >
+                  Member since 
+                  <span
+                    class="font-weight-bold"
+                  >
+                     
+                    2017
+                     
+                  </span>
+                </span>
+              </div>
+            </div>
+            <div
+              class="p-0  col-auto"
+            />
+          </div>
+        </div>
+        <div
+          class="ml-auto"
+        />
+      </div>
+    </div>
+    <div
+      class="col d-inline-flex h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    >
+      <div
+        class="w-100 p-0"
+      >
+        <div
+          class="col justify-content-start align-items-start p-0"
+        >
+          <div
+            class="col align-self-stretch height-42px justify-content-start align-items-start p-0"
+          >
+            <p
+              class="font-weight-bold text-primary-500 m-0 h2"
+            >
+              Profile information
+            </p>
+          </div>
+        </div>
+        <div
+          class="row m-0 px-0 w-100 d-inline-flex align-items-start justify-content-start pt-5.5"
+        >
+          <div
+            class="col p-0 col-6"
+          >
+            <div
+              class="m-0"
+            >
+              <div
+                class="row m-0 pb-1.5 align-items-center"
+              >
+                <p
+                  class="h5 font-weight-bold m-0"
+                  data-hj-suppress="true"
+                >
+                  Username
+                </p>
+                <svg
+                  class="m-0 info-icon"
+                  fill="none"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  width="24"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M11 7h2v2h-2V7Zm0 4h2v6h-2v-6Zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2Zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </div>
+              <h4
+                class="edit-section-header text-gray-700"
+              >
+                onlySocialLinks
+              </h4>
+            </div>
+          </div>
+          <div
+            class="col m-0 pr-0 pl-40px col-6"
+          />
+        </div>
+      </div>
+    </div>
+    <div
+      class="col container-fluid d-inline-flex bg-color-grey-FBFAF9 h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    />
+  </div>
+</div>
+`;
+
+exports[`<ProfilePage /> handles profile with only username and no other fields renders profile with only username 1`] = `
+<div>
+  <div
+    class="profile-page"
+  >
+    <div
+      class="profile-page-bg-banner bg-primary d-md-block align-items-center h-100 w-100 px-120px py-5.5"
+    >
+      <div
+        class="col container-fluid w-100 h-100 bg-white py-0 rounded-75 px-40px"
+      >
+        <div
+          class="col h-100 w-100 px-0 justify-content-start g-15rem py-36px"
+        >
+          <div
+            class="row-auto d-flex flex-wrap align-items-center h-100 w-100 justify-content-start g-15rem flex-row"
+          >
+            <div
+              class="profile-avatar-wrap position-relative"
+            >
+              <div
+                class="profile-avatar rounded-circle bg-light"
+              >
+                <div
+                  aria-hidden="true"
+                  class="text-muted"
+                  data-testid="IconMock"
+                  focusable="false"
+                  role="img"
+                  viewbox="0 0 24 24"
+                />
+              </div>
+              <form
+                enctype="multipart/form-data"
+              >
+                <input
+                  accept=".jpg, .jpeg, .png"
+                  class="d-none form-control-file"
+                  id="photo-file"
+                  name="file"
+                  type="file"
+                />
+              </form>
+            </div>
+            <div
+              class="col h-100 w-100 m-0 p-0 justify-content-start align-items-start"
+            >
+              <p
+                class="row m-0 font-weight-bold text-truncate text-primary-500 h3"
+              >
+                onlyUsernameNoFields
+              </p>
+              <div
+                class="row pt-2 m-0 g-1rem"
+              >
+                <span
+                  class="small mb-0 text-gray-800"
+                >
+                  Member since 
+                  <span
+                    class="font-weight-bold"
+                  >
+                     
+                    2017
+                     
+                  </span>
+                </span>
+              </div>
+            </div>
+            <div
+              class="p-0  col-auto"
+            />
+          </div>
+        </div>
+        <div
+          class="ml-auto"
+        />
+      </div>
+    </div>
+    <div
+      class="col d-inline-flex h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    >
+      <div
+        class="w-100 p-0"
+      >
+        <div
+          class="col justify-content-start align-items-start p-0"
+        >
+          <div
+            class="col align-self-stretch height-42px justify-content-start align-items-start p-0"
+          >
+            <p
+              class="font-weight-bold text-primary-500 m-0 h2"
+            >
+              Profile information
+            </p>
+          </div>
+        </div>
+        <div
+          class="row m-0 px-0 w-100 d-inline-flex align-items-start justify-content-start pt-5.5"
+        >
+          <div
+            class="col p-0 col-6"
+          >
+            <div
+              class="m-0"
+            >
+              <div
+                class="row m-0 pb-1.5 align-items-center"
+              >
+                <p
+                  class="h5 font-weight-bold m-0"
+                  data-hj-suppress="true"
+                >
+                  Username
+                </p>
+                <svg
+                  class="m-0 info-icon"
+                  fill="none"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  width="24"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M11 7h2v2h-2V7Zm0 4h2v6h-2v-6Zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2Zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </div>
+              <h4
+                class="edit-section-header text-gray-700"
+              >
+                onlyUsernameNoFields
+              </h4>
+            </div>
+          </div>
+          <div
+            class="col m-0 pr-0 pl-40px col-6"
+          />
+        </div>
+      </div>
+    </div>
+    <div
+      class="col container-fluid d-inline-flex bg-color-grey-FBFAF9 h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    />
+  </div>
+</div>
+`;
+
+exports[`<ProfilePage /> handles profile with only username renders profile with only username 1`] = `
+<div>
+  <div
+    class="profile-page"
+  >
+    <div
+      class="profile-page-bg-banner bg-primary d-md-block align-items-center h-100 w-100 px-120px py-5.5"
+    >
+      <div
+        class="col container-fluid w-100 h-100 bg-white py-0 rounded-75 px-40px"
+      >
+        <div
+          class="col h-100 w-100 px-0 justify-content-start g-15rem py-36px"
+        >
+          <div
+            class="row-auto d-flex flex-wrap align-items-center h-100 w-100 justify-content-start g-15rem flex-row"
+          >
+            <div
+              class="profile-avatar-wrap position-relative"
+            >
+              <div
+                class="profile-avatar rounded-circle bg-light"
+              >
+                <div
+                  aria-hidden="true"
+                  class="text-muted"
+                  data-testid="IconMock"
+                  focusable="false"
+                  role="img"
+                  viewbox="0 0 24 24"
+                />
+              </div>
+              <form
+                enctype="multipart/form-data"
+              >
+                <input
+                  accept=".jpg, .jpeg, .png"
+                  class="d-none form-control-file"
+                  id="photo-file"
+                  name="file"
+                  type="file"
+                />
+              </form>
+            </div>
+            <div
+              class="col h-100 w-100 m-0 p-0 justify-content-start align-items-start"
+            >
+              <p
+                class="row m-0 font-weight-bold text-truncate text-primary-500 h3"
+              >
+                onlyUsername
+              </p>
+              <div
+                class="row pt-2 m-0 g-1rem"
+              >
+                <span
+                  class="small mb-0 text-gray-800"
+                >
+                  Member since 
+                  <span
+                    class="font-weight-bold"
+                  >
+                     
+                    2017
+                     
+                  </span>
+                </span>
+              </div>
+            </div>
+            <div
+              class="p-0  col-auto"
+            />
+          </div>
+        </div>
+        <div
+          class="ml-auto"
+        />
+      </div>
+    </div>
+    <div
+      class="col d-inline-flex h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    >
+      <div
+        class="w-100 p-0"
+      >
+        <div
+          class="col justify-content-start align-items-start p-0"
+        >
+          <div
+            class="col align-self-stretch height-42px justify-content-start align-items-start p-0"
+          >
+            <p
+              class="font-weight-bold text-primary-500 m-0 h2"
+            >
+              Profile information
+            </p>
+          </div>
+        </div>
+        <div
+          class="row m-0 px-0 w-100 d-inline-flex align-items-start justify-content-start pt-5.5"
+        >
+          <div
+            class="col p-0 col-6"
+          >
+            <div
+              class="m-0"
+            >
+              <div
+                class="row m-0 pb-1.5 align-items-center"
+              >
+                <p
+                  class="h5 font-weight-bold m-0"
+                  data-hj-suppress="true"
+                >
+                  Username
+                </p>
+                <svg
+                  class="m-0 info-icon"
+                  fill="none"
+                  height="24"
+                  viewBox="0 0 24 24"
+                  width="24"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M11 7h2v2h-2V7Zm0 4h2v6h-2v-6Zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2Zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </div>
+              <h4
+                class="edit-section-header text-gray-700"
+              >
+                onlyUsername
+              </h4>
+            </div>
+          </div>
+          <div
+            class="col m-0 pr-0 pl-40px col-6"
+          />
+        </div>
+      </div>
+    </div>
+    <div
+      class="col container-fluid d-inline-flex bg-color-grey-FBFAF9 h-100 w-100 align-items-start justify-content-start g-3rem px-120px py-6"
+    />
+  </div>
+</div>
+`;