feat(#59) Criação do Componente ProfileHeader

Co-authored-by: MarinaGaldi <[email protected]>

lib/ui/profile/view/ProfileView.dart

@@ -1,9 +1,5 @@
-import 'package:aranduapp/core/log/Log.dart';
 import 'package:aranduapp/ui/profile/viewModel/ProfileViewModel.dart';
-import 'package:aranduapp/ui/shared/ErrorPopUp.dart';
-import 'package:aranduapp/ui/shared/TextAndLink.dart';
-import 'package:aranduapp/ui/shared/TextEmail.dart';
-import 'package:aranduapp/ui/shared/TitleSlogan.dart';
+import 'package:aranduapp/ui/shared/ProfileHeader.dart';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 
@@ -13,32 +9,115 @@ class Profile extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      appBar: _appBar(), // Corrigido
+      appBar: ProfileAppBar(), // Widget de AppBar separado
       body: ChangeNotifierProvider(
         create: (context) => ProfileViewModel(context),
         builder: (context, child) {
-          return _buildPage(context);
+          return _buildPage(context); // Constrói a página principal
         },
       ),
     );
   }
+
+  Widget _buildPage(BuildContext context) {
+    return SingleChildScrollView(
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          ProfileHeaderSection(), // Widget para o cabeçalho do perfil
+          const SizedBox(height: 16),
+          ProfileContent(), // Widget para o conteúdo da página
+        ],
+      ),
+    );
+  }
+}
+
+/// 1. Widget para o AppBar
+class ProfileAppBar extends StatelessWidget implements PreferredSizeWidget {
+  @override
+  Size get preferredSize => const Size.fromHeight(56);
+
+  @override
+  Widget build(BuildContext context) {
+    return AppBar(
+      backgroundColor: Colors.white,
+      elevation: 0,
+      leading: Padding(
+        padding: const EdgeInsets.all(2.0),
+        child: Container(
+          decoration: BoxDecoration(
+            color: Colors.grey.shade100,
+            borderRadius: BorderRadius.circular(12),
+          ),
+          child: const Center(
+            child: Icon(
+              Icons.arrow_back_ios_new,
+              color: Colors.black,
+              size: 20,
+            ),
+          ),
+        ),
+      ),
+      title: const Text(
+        'Perfil',
+        style: TextStyle(
+          color: Colors.black,
+          fontSize: 30,
+          fontWeight: FontWeight.w600,
+        ),
+      ),
+      centerTitle: true,
+      actions: [
+        Padding(
+          padding: const EdgeInsets.all(2.0),
+          child: Container(
+            decoration: BoxDecoration(
+              color: Colors.grey.shade100,
+              borderRadius: BorderRadius.circular(12),
+            ),
+            child: const Center(
+              child: Icon(
+                Icons.notifications_none_outlined,
+                color: Colors.black,
+                size: 40,
+              ),
+            ),
+          ),
+        ),
+      ],
+    );
+  }
 }
 
-AppBar _appBar() {
-  return AppBar(
-    title: const Text("Profile"),
-    centerTitle: true,
-    backgroundColor: Colors.blue,
-  );
+/// 2. Widget para o Cabeçalho do Perfil
+class ProfileHeaderSection extends StatelessWidget {
+  const ProfileHeaderSection({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return ProfileHeader(
+      name: "Stefani",
+      role: "Estudante",
+      onEditPressed: null, // Botão sem ação no momento
+    );
+  }
 }
 
-Widget _buildPage(BuildContext context) {
-  return SingleChildScrollView(
-    child: Center(
-      child: const Text(
-        'This is the next page',
-        style: TextStyle(fontSize: 24),
+/// 3. Widget para o Conteúdo da Página
+class ProfileContent extends StatelessWidget {
+  const ProfileContent({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return const Center(
+      child: Text(
+        "Conteúdo da tela de perfil...",
+        style: TextStyle(
+          fontSize: 16,
+          color: Colors.black54,
+        ),
       ),
-    ),
-  );
+    );
+  }
 }

lib/ui/shared/ProfileHeader.dart

@@ -0,0 +1,84 @@
+import 'package:flutter/material.dart';
+
+class ProfileHeader extends StatelessWidget {
+  final String name;
+  final String role;
+  final VoidCallback? onEditPressed;
+
+  const ProfileHeader({
+    Key? key,
+    required this.name,
+    required this.role,
+    this.onEditPressed, // Botão pode não ter ação inicialmente
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      padding: const EdgeInsets.all(16.0),
+      child: Row(
+        crossAxisAlignment: CrossAxisAlignment.center,
+        mainAxisAlignment: MainAxisAlignment.spaceBetween,
+        children: [
+          // Imagem circular + texto
+          Row(
+            children: [
+              // Imagem circular
+              Container(
+                width: 80,
+                height: 80,
+                decoration: const BoxDecoration(
+                  color: Color(0xFFE5E1E1), // Cor cinza claro
+                  shape: BoxShape.circle,
+                ),
+              ),
+              const SizedBox(width: 16),
+              // Nome e descrição
+              Column(
+                crossAxisAlignment: CrossAxisAlignment.start,
+                children: [
+                  Text(
+                    name,
+                    style: const TextStyle(
+                      fontSize: 20,
+                      fontWeight: FontWeight.bold,
+                      color: Colors.black87,
+                    ),
+                  ),
+                  const SizedBox(height: 4),
+                  Text(
+                    role,
+                    style: const TextStyle(
+                      fontSize: 16,
+                      color: Colors.grey,
+                    ),
+                  ),
+                ],
+              ),
+            ],
+          ),
+          // Botão Editar
+          ElevatedButton(
+            onPressed: onEditPressed ?? () {}, // Não faz nada se nulo
+            style: ElevatedButton.styleFrom(
+              backgroundColor: const Color(0xFFD1410A), // Cor do botão
+              shape: RoundedRectangleBorder(
+                borderRadius: BorderRadius.circular(12),
+              ),
+              padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
+              elevation: 2,
+            ),
+            child: const Text(
+              "Editar",
+              style: TextStyle(
+                fontSize: 16,
+                color: Colors.white,
+                fontWeight: FontWeight.w400,
+              ),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}