complete project using prettier!

src/features/charts/TopDeals.tsx

@@ -7,10 +7,9 @@ interface TopDealsProps {
 }
 
 export const TopDeals: React.FC<TopDealsProps> = ({ items }) => {
-    
   const topDeals = useMemo(() => {
     return [...items]
-      .filter(item => item.price_in_cents !== null) // Only include items with a parseable price
+      .filter((item) => item.price_in_cents !== null) // Only include items with a parseable price
       .sort((a, b) => (a.price_in_cents ?? Infinity) - (b.price_in_cents ?? Infinity))
       .slice(0, 10);
   }, [items]);
@@ -25,8 +24,13 @@ export const TopDeals: React.FC<TopDealsProps> = ({ items }) => {
       </h3>
       <ul className="space-y-2">
         {topDeals.map((item, index) => (
-          <li key={index} className="grid grid-cols-3 gap-2 items-center text-sm bg-white dark:bg-gray-800 p-2 rounded">
-            <span className="font-semibold text-gray-800 dark:text-gray-200 col-span-2 truncate">{item.item}</span>
+          <li
+            key={index}
+            className="grid grid-cols-3 gap-2 items-center text-sm bg-white dark:bg-gray-800 p-2 rounded"
+          >
+            <span className="font-semibold text-gray-800 dark:text-gray-200 col-span-2 truncate">
+              {item.item}
+            </span>
             <span className="font-bold text-brand-primary text-right">{item.price_display}</span>
             <span className="text-xs text-gray-500 dark:text-gray-400 col-span-3 truncate italic">
               (Qty: {item.quantity})
@@ -36,4 +40,4 @@ export const TopDeals: React.FC<TopDealsProps> = ({ items }) => {
       </ul>
     </div>
   );
-};
+};