UI: #334 add config page language setting (#374)

* UI: #334 add config page language setting

* temporary remove logout button

* Unify fullscreen view class for dialog expanded and settings view

- Replace dialog-expanded and settings-view with single fullscreen-view class
- Update ResponsiveDialog to use fullscreen-view class
- Update CalendarLayout to use fullscreen-view class for settings view
- Consolidate CSS rules in Menubar.styl to use fullscreen-view
- Update test cases to use new class name

---------

Co-authored-by: Lê Nhân Phụng <lenhanphung@Phung-Mac-M4.local>

__test__/utils/userUtils.test.ts

@@ -0,0 +1,92 @@
+import { getUserDisplayName } from "../../src/utils/userUtils";
+import { userData } from "../../src/features/User/userDataTypes";
+
+describe("userUtils", () => {
+  describe("getUserDisplayName", () => {
+    it("returns full name when user has name and family_name", () => {
+      const user: userData = {
+        sub: "test",
+        email: "test@test.com",
+        family_name: "Doe",
+        given_name: "John",
+        name: "John",
+        sid: "mockSid",
+      };
+
+      expect(getUserDisplayName(user)).toBe("John Doe");
+    });
+
+    it("returns email when user does not have name and family_name", () => {
+      const user: userData = {
+        sub: "test",
+        email: "test@test.com",
+        family_name: "",
+        given_name: "",
+        name: "",
+        sid: "mockSid",
+      };
+
+      expect(getUserDisplayName(user)).toBe("test@test.com");
+    });
+
+    it("returns email when user has only email", () => {
+      const user: userData = {
+        sub: "test",
+        email: "user@example.com",
+        family_name: "",
+        given_name: "",
+        name: "",
+        sid: "mockSid",
+      };
+
+      expect(getUserDisplayName(user)).toBe("user@example.com");
+    });
+
+    it("returns empty string when user is null", () => {
+      expect(getUserDisplayName(null)).toBe("");
+    });
+
+    it("returns empty string when user is undefined", () => {
+      expect(getUserDisplayName(undefined)).toBe("");
+    });
+
+    it("returns empty string when user has no name, family_name, or email", () => {
+      const user: userData = {
+        sub: "test",
+        email: "",
+        family_name: "",
+        given_name: "",
+        name: "",
+        sid: "mockSid",
+      };
+
+      expect(getUserDisplayName(user)).toBe("");
+    });
+
+    it("handles user with only name (no family_name)", () => {
+      const user: userData = {
+        sub: "test",
+        email: "test@test.com",
+        family_name: "",
+        given_name: "John",
+        name: "John",
+        sid: "mockSid",
+      };
+
+      expect(getUserDisplayName(user)).toBe("test@test.com");
+    });
+
+    it("handles user with only family_name (no name)", () => {
+      const user: userData = {
+        sub: "test",
+        email: "test@test.com",
+        family_name: "Doe",
+        given_name: "",
+        name: "",
+        sid: "mockSid",
+      };
+
+      expect(getUserDisplayName(user)).toBe("test@test.com");
+    });
+  });
+});