remove front end errors

apps/dashboard/features/dao-overview/components/CountdownDaoInfo.tsx

@@ -27,8 +27,8 @@ export const CountdownDaoInfo = ({
   if (!formattedCountdown) return null;
 
   return (
-    <div className="text-primary text-sm font-normal leading-5">
+    <p className="text-primary text-sm font-normal leading-5">
       {formattedCountdown.days}d {formattedCountdown.hours}h left
-    </div>
+    </p>
   );
 };

apps/dashboard/features/dao-overview/components/ProgressBar.tsx

@@ -68,9 +68,7 @@ export const ProgressBar = ({
           </div>
           <div className="flex flex-col items-end justify-center">
             <p className="text-secondary text-xs font-medium">Expiration</p>
-            <p className="text-primary text-sm font-normal">
-              <CountdownDaoInfo daoOverview={daoOverview} />
-            </p>
+            <CountdownDaoInfo daoOverview={daoOverview} />
           </div>
         </div>
       </div>

apps/dashboard/features/resilience-stages/components/StageContent.tsx

@@ -76,10 +76,8 @@ export const StageContent = ({
             ))}
 
           {type === "requirements" ? (
-            <div className="flex flex-row gap-2">
-              <p className="text-secondary flex flex-wrap text-sm font-normal">
-                {requirementText}
-              </p>
+            <div className="text-secondary flex flex-row flex-wrap gap-2 text-sm font-normal">
+              {requirementText}
             </div>
           ) : (
             issues?.map((issue, index) => (

apps/dashboard/shared/components/buttons/CopyAndPasteButton.tsx

@@ -46,7 +46,7 @@ export const CopyAndPasteButton = ({
       : "Copy to clipboard";
 
   return (
-    <Tooltip tooltipContent={tooltipText}>
+    <Tooltip asChild tooltipContent={tooltipText}>
       <IconButton
         onClick={handleCopy}
         disabled={disabled || !textToCopy}

apps/dashboard/shared/components/design-system/table/Table.tsx

@@ -106,11 +106,16 @@ export const Table = <TData, TValue>({
   const [sorting, setSorting] = useState<SortingState>([]);
   const [columnFilters, setColumnFilters] = useState<ColumnFiltersState>([]);
   const [expanded, setExpanded] = useState<ExpandedState>({});
+  const [isMounted, setIsMounted] = useState(false);
   const router = useRouter();
 
   const wrapperRef = useRef<HTMLDivElement | null>(null);
   const sentinelRef = useRef<HTMLDivElement | null>(null);
 
+  useEffect(() => {
+    setIsMounted(true);
+  }, []);
+
   useEffect(() => {
     if (!onLoadMore || !hasMore) return;
 
@@ -347,7 +352,12 @@ export const Table = <TData, TValue>({
                 );
               })}
 
-              <div ref={sentinelRef} />
+              {/* Sentinel for infinite scrolling */}
+              <tr>
+                <td colSpan={columns.length}>
+                  <div ref={sentinelRef} />
+                </td>
+              </tr>
 
               {isLoadingMore && (
                 <TableRow>
@@ -382,7 +392,7 @@ export const Table = <TData, TValue>({
           )}
         </TableBody>
       </TableContainer>
-      {withDownloadCSV && data.length > 0 && (
+      {withDownloadCSV && data.length > 0 && isMounted && (
         <p className="text-secondary mt-2 flex font-mono text-[13px] tracking-wider">
           [DOWNLOAD AS{" "}
           <CSVLink

apps/dashboard/shared/components/design-system/tooltips/Tooltip.tsx

@@ -11,13 +11,15 @@ interface TooltipProps {
   tooltipContent: ReactNode;
   className?: string;
   title?: ReactNode;
+  asChild?: boolean;
 }
 
 export function Tooltip({
   children,
   tooltipContent,
   className,
   title,
+  asChild = false,
 }: TooltipProps) {
   const [open, setOpen] = useState<boolean>(false);
   const { isMobile } = useScreenSize();
@@ -42,7 +44,12 @@ export function Tooltip({
       onOpenChange={handleOpenChange}
       disableHoverableContent
     >
-      <Trigger role="button" aria-label="tooltip-info" onClick={onClick}>
+      <Trigger
+        asChild={asChild}
+        role="button"
+        aria-label="tooltip-info"
+        onClick={onClick}
+      >
         {children}
       </Trigger>
       <Portal>

apps/dashboard/shared/components/icons/CompoundIcon.tsx

@@ -1,6 +1,9 @@
-import { SVGProps } from "react";
+import { DaoIconProps } from "@/shared/components/icons/types";
 
-export const CompoundIcon = (props: SVGProps<SVGSVGElement>) => {
+export const CompoundIcon = ({
+  showBackground = true,
+  ...props
+}: DaoIconProps) => {
   return (
     // TODO: Compound
     <svg
@@ -11,7 +14,7 @@ export const CompoundIcon = (props: SVGProps<SVGSVGElement>) => {
       fill="none"
       xmlns="http://www.w3.org/2000/svg"
     >
-      <rect width="40" height="40" fill="#070A0E" />
+      {showBackground && <rect width="40" height="40" fill="#070A0E" />}
       <path
         fillRule="evenodd"
         clipRule="evenodd"

apps/dashboard/shared/components/icons/GitcoinIcon.tsx

@@ -1,6 +1,9 @@
-import { SVGProps } from "react";
+import { DaoIconProps } from "@/shared/components/icons/types";
 
-export const GitcoinIcon = (props: SVGProps<SVGSVGElement>) => {
+export const GitcoinIcon = ({
+  showBackground = true,
+  ...props
+}: DaoIconProps) => {
   return (
     <svg
       {...props}
@@ -10,7 +13,7 @@ export const GitcoinIcon = (props: SVGProps<SVGSVGElement>) => {
       fill="none"
       xmlns="http://www.w3.org/2000/svg"
     >
-      <rect width="40" height="40" fill="#1E443F" />
+      {showBackground && <rect width="40" height="40" fill="#1E443F" />}
       <path
         fillRule="evenodd"
         clipRule="evenodd"

apps/dashboard/shared/components/icons/ScrollIcon.tsx

@@ -1,6 +1,9 @@
-import { SVGProps } from "react";
+import { DaoIconProps } from "@/shared/components/icons/types";
 
-export const ScrollIcon = (props: SVGProps<SVGSVGElement>) => {
+export const ScrollIcon = ({
+  showBackground = true,
+  ...props
+}: DaoIconProps) => {
   return (
     <svg
       {...props}
@@ -10,7 +13,7 @@ export const ScrollIcon = (props: SVGProps<SVGSVGElement>) => {
       fill="none"
       xmlns="http://www.w3.org/2000/svg"
     >
-      <rect width="444" height="444" fill="#FFEEDA" />
+      {showBackground && <rect width="444" height="444" fill="#FFEEDA" />}
       <path
         fill="#FFEEDA"
         d="M333.4,262V110.6c-0.2-12.7-10.3-22.9-23-22.9h-158c-34.1,0.5-61.5,28.4-61.5,62.6c0,11.5,3.1,21.4,7.8,30.1

apps/dashboard/shared/dao-config/types.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from "react";
+import { ReactNode, SVGProps } from "react";
 import { Address, Chain } from "viem";
 import { DaoIdEnum } from "@/shared/types/daos";
 import { MetricTypesEnum } from "@/shared/types/enums/metric-type";
@@ -60,7 +60,7 @@ interface BaseInfo {
 }
 
 export interface ChainWithIcon extends Chain {
-  icon: (props: DaoIconProps) => ReactNode;
+  icon: (props: SVGProps<SVGSVGElement>) => ReactNode;
   blockTime: number;
 }