pequenas mudanças

src/components/CandidatePage/IncomeExpenseComponent.tsx

@@ -11,12 +11,23 @@ interface IncomeExpenseComponentProps {
   isLoadingIncome: boolean;
 }
 
+const hasIncomeData = (income: CandidateIncome | null) => {
+  if (!income || income.receitas.length === 0) return false;
+};
+
+const hasExpenseData = (expenses: CandidateExpenses | null) => {
+  if (!expenses || expenses.despesas.length === 0) return false;
+};
+
 const IncomeExpenseComponent: React.FC<IncomeExpenseComponentProps> = ({ 
   expenses, 
   income, 
   isLoadingExpenses, 
   isLoadingIncome 
 }) => {
+  const showIncome = hasIncomeData(income);
+  const showExpenses = hasExpenseData(expenses);
+  if (!showIncome && !showExpenses) return null;
   return (
     <div className="bg-white/95 backdrop-blur-sm rounded-xl shadow-lg hover:shadow-xl transform hover:scale-[1.01] transition-all duration-200 p-6">
       <div className="flex items-center mb-6">
@@ -25,25 +36,31 @@ const IncomeExpenseComponent: React.FC<IncomeExpenseComponentProps> = ({
       </div>
 
       {/* Income Section */}
-      <IncomeSection 
+      {showIncome && (
-        income={income}
+        <IncomeSection 
-        isLoadingIncome={isLoadingIncome}
+          income={income}
-      />
+          isLoadingIncome={isLoadingIncome}
+        />
+      )}
 
       {/* Separator */}
-      <div className="flex items-center my-8">
+      {showIncome && showExpenses && (
-        <div className="flex-grow border-t border-gray-300"></div>
+        <div className="flex items-center my-8">
-        <div className="flex-shrink-0 px-4">
+          <div className="flex-grow border-t border-gray-300"></div>
-          <div className="w-3 h-3 bg-gray-300 rounded-full"></div>
+          <div className="flex-shrink-0 px-4">
+            <div className="w-3 h-3 bg-gray-300 rounded-full"></div>
+          </div>
+          <div className="flex-grow border-t border-gray-300"></div>
         </div>
-        <div className="flex-grow border-t border-gray-300"></div>
+      )}
-      </div>
 
       {/* Expenses Section */}
-      <ExpenseSection 
+      {showExpenses && (
-        expenses={expenses}
+        <ExpenseSection 
-        isLoadingExpenses={isLoadingExpenses}
+          expenses={expenses}
-      />
+          isLoadingExpenses={isLoadingExpenses}
+        />
+      )}
     </div>
   );
 };

src/components/FeaturesSection.tsx

@@ -14,7 +14,7 @@ const FeatureCard: React.FC<{ icon: React.ElementType, title: string, children:
 
 const FeaturesSection: React.FC = () => {
   return (
-    <section id="features" className="py-20">
+    <section id="recursos" className="py-20">
       <div className="container mx-auto px-4">
         <h2 className="text-3xl font-bold text-center text-white mb-12">
           Por que OpenCand?

src/components/Navbar.tsx

@@ -16,8 +16,8 @@ const Navbar: React.FC = () => {
             <div className="space-x-4">
               <Button href="/dados-disponiveis">Dados Disponíveis</Button>
               <Button href="/estatisticas">Estatíscas</Button>
-              <Button href="/#features">Recursos</Button>
+              <Button href="/#recursos">Recursos</Button>
-              <Button href="/about">Sobre</Button>
+              <Button href="/sobre">Sobre</Button>
             </div>
           </div>
         </div>