From e452b234d247719c42659257013b924890883cd4 Mon Sep 17 00:00:00 2001
From: afuro <infoafuro@gmail.com>
Date: Mon, 20 Jan 2025 11:38:49 -0500
Subject: [PATCH 1/2] apply export to function

---
 src/pixels.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pixels.ts b/src/pixels.ts
index d7297f8..694bb5c 100644
--- a/src/pixels.ts
+++ b/src/pixels.ts
@@ -1,7 +1,7 @@
 type FlatPoint = number;
 type Point2D = { x: number; y: number };
 
-function flatPoint({ x, y }: Point2D) {
+export function flatPoint({ x, y }: Point2D) {
   return x + y * 10_000;
 }
 

From 47bd987a682cb9232c72f478eb4f9a6d9a8219f4 Mon Sep 17 00:00:00 2001
From: afuro <infoafuro@gmail.com>
Date: Mon, 20 Jan 2025 11:42:08 -0500
Subject: [PATCH 2/2] add proccess to clean duplicate pixels

---
 src/Canvas.tsx | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/Canvas.tsx b/src/Canvas.tsx
index a080318..e049b17 100644
--- a/src/Canvas.tsx
+++ b/src/Canvas.tsx
@@ -1,6 +1,6 @@
 import { memo } from "preact/compat";
 import { useEffect, useMemo, useReducer, useRef } from "preact/hooks";
-import Pixels from "./pixels";
+import Pixels, { flatPoint } from "./pixels";
 import {
   ArrowUpCircle,
   MagnifyingGlassMinus,
@@ -45,6 +45,16 @@ function Canvas({
   const background = useMemo(() => Pixels.fromString(pixels), [pixels]);
 
   async function save() {
+    const cleanPixels = new Pixels();
+
+    for (const { x, y, color } of state.pixels) {
+      const bgColor = background.storage.get(flatPoint({ x, y }));
+
+      if (color !== bgColor) {
+        cleanPixels.storage.set(flatPoint({ x, y }), color);
+      }
+    }
+
     const chainId = await client.getChainId();
     if (chainId !== client.chain.id) {
       await client.switchChain(client.chain);
@@ -105,7 +115,7 @@ function Canvas({
       ]),
       functionName: "paint",
       address: BASEPAINT_ADDRESS,
-      args: [BigInt(day), brushId, `0x${state.pixels}`],
+      args: [BigInt(day), brushId, `0x${cleanPixels.toString()}`],
     });
   }