Refactor ProfileSettings and SecuritySettings components to improve code clarity and add input types

app/src/App.test.tsx

@@ -1,16 +0,0 @@
-import { describe, it, expect } from 'vitest';
-import { render } from '@/test/utils';
-
-describe('Testing Setup Sanity Check', () => {
-  it('should render a basic component', () => {
-    const TestComponent = () => <div>Hello, World!</div>;
-
-    const { getByText } = render(<TestComponent />);
-
-    expect(getByText('Hello, World!')).toBeInTheDocument();
-  });
-
-  it('should have access to global API_BASE_URL', () => {
-    expect(window.API_BASE_URL).toBe('http://localhost:8080/api/v1');
-  });
-});

app/src/components/settings/account/ProfileSettings.tsx

@@ -7,7 +7,7 @@ interface ProfileSettingsProps {
   onInputChange: (key: keyof UserProfileSettings, value: string) => void;
 }
 
-const ProfileSettingsComponent: React.FC<ProfileSettingsProps> = ({
+const ProfileSettings: React.FC<ProfileSettingsProps> = ({
   settings,
   onInputChange,
 }) => (
@@ -15,18 +15,22 @@ const ProfileSettingsComponent: React.FC<ProfileSettingsProps> = ({
     <Stack gap="md">
       <TextInput
         label="Display Name"
+        type="text"
         value={settings.displayName || ''}
         onChange={(e) => onInputChange('displayName', e.currentTarget.value)}
         placeholder="Enter display name"
+        data-testid="display-name-input"
       />
       <TextInput
         label="Email"
+        type="email"
         value={settings.email || ''}
         onChange={(e) => onInputChange('email', e.currentTarget.value)}
         placeholder="Enter email"
+        data-testid="email-input"
       />
     </Stack>
   </Box>
 );
 
-export default ProfileSettingsComponent;
+export default ProfileSettings;

app/src/components/settings/account/SecuritySettings.tsx

@@ -41,6 +41,7 @@ const SecuritySettings: React.FC<SecuritySettingsProps> = ({
       <Stack gap="md">
         <PasswordInput
           label="Current Password"
+          type="password"
           value={settings.currentPassword || ''}
           onChange={(e) =>
             handlePasswordChange('currentPassword', e.currentTarget.value)
@@ -49,6 +50,7 @@ const SecuritySettings: React.FC<SecuritySettingsProps> = ({
         />
         <PasswordInput
           label="New Password"
+          type="password"
           value={settings.newPassword || ''}
           onChange={(e) =>
             handlePasswordChange('newPassword', e.currentTarget.value)
@@ -57,6 +59,7 @@ const SecuritySettings: React.FC<SecuritySettingsProps> = ({
         />
         <PasswordInput
           label="Confirm New Password"
+          type="password"
           value={confirmPassword}
           onChange={(e) =>
             handlePasswordChange('confirmNewPassword', e.currentTarget.value)