Sampling, global locations, and UI improvements

docs/plans/replacement.md

@@ -0,0 +1 @@
+Okay, we want to add an additional replacement pixel. So for every time we select a pixel, we want to take one pixel that falls within the ring of the quad key. So basically, you know, the one right above, below, to the right, to the left, or to like top right, you know, northeast, southeast, etc. So kind of like the nine, sorry, one, two, three, four, five, six, seven. The eight pixels that go around a pixel are candidates. Then you would randomly select one of those. The only criteria would be that that that has the necessary amount of buildings. So five buildings or whatever the threshold is, you pick one of those, and then we're going to make that a replacement sample in the coverage database. And then, so we have to mark that separately, and then, second, we will make it blue so it's visible as a different color option. And then the idea is they can then pick that as a replacement if the primary one is uh not does it provide enough children.

truecover-app/src/components/AddCampaignAreaModal.tsx

@@ -19,6 +19,7 @@ interface AddCampaignAreaModalProps {
     name: string;
   } | null;
   drawnGeometry?: any;
+  existingBuildingCount?: number;
   onAreaAdded?: (result?: { areaId: string; buildingWorkflowId?: string }) => void;
 }
 
@@ -29,6 +30,7 @@ const AddCampaignAreaModal: React.FC<AddCampaignAreaModalProps> = ({
   mode,
   adminBoundary,
   drawnGeometry,
+  existingBuildingCount = 0,
   onAreaAdded
 }) => {
   const { getToken } = useAuth();
@@ -177,6 +179,14 @@ const AddCampaignAreaModal: React.FC<AddCampaignAreaModalProps> = ({
           </p>
         </div>
 
+        {existingBuildingCount > 0 && (
+          <div className="p-3 border border-tactical-border-medium bg-tactical-bg-secondary">
+            <span className="text-sm text-tactical-text-secondary">
+              This area already has <span className="font-bold text-tactical-text-primary">{existingBuildingCount.toLocaleString()}</span> buildings imported.
+            </span>
+          </div>
+        )}
+
         <div className="flex items-center gap-2">
           <input
             type="checkbox"
@@ -186,11 +196,15 @@ const AddCampaignAreaModal: React.FC<AddCampaignAreaModalProps> = ({
             className="w-4 h-4"
           />
           <label htmlFor="extractBuildings" className="text-sm text-tactical-text-secondary">
-            Extract buildings from Overture Maps
+            {existingBuildingCount > 0
+              ? 'Re-extract buildings from Overture Maps'
+              : 'Extract buildings from Overture Maps'}
           </label>
         </div>
         <p className="text-xs text-tactical-text-muted -mt-2 ml-6">
-          Import building footprints from Overture Maps for this area
+          {existingBuildingCount > 0
+            ? 'This will re-import building footprints (duplicates are skipped)'
+            : 'Import building footprints from Overture Maps for this area'}
         </p>
 
         <div className="flex gap-3 justify-end pt-2">

truecover-app/src/components/CampaignAreasManager.tsx

@@ -68,6 +68,7 @@ const CampaignAreasManager: React.FC<CampaignAreasManagerProps> = ({
   const [isDeleting, setIsDeleting] = useState(false);
   const [areaToEdit, setAreaToEdit] = useState<CampaignArea | null>(null);
   const [sampleCount, setSampleCount] = useState<number>(50);
+  const [buildingsPerPixel, setBuildingsPerPixel] = useState<number>(5);
   const [selectedRoundId, setSelectedRoundId] = useState<string>('');
   const [sampleTarget, setSampleTarget] = useState<SampleTarget>('pixels');
   const [isSampling, setIsSampling] = useState(false);
@@ -296,7 +297,8 @@ const CampaignAreasManager: React.FC<CampaignAreasManagerProps> = ({
           sample_count: sampleCount,
           resample,
           round_id: selectedRoundId,
-          sample_target: sampleTarget
+          sample_target: sampleTarget,
+          ...(sampleTarget === 'pixels' && buildingsPerPixel > 0 ? { buildings_per_pixel: buildingsPerPixel } : {}),
         },
         token
       );
@@ -765,6 +767,25 @@ const CampaignAreasManager: React.FC<CampaignAreasManagerProps> = ({
                     className="w-full px-3 py-2 bg-tactical-bg-tertiary border border-tactical-border-medium text-tactical-text-primary font-mono text-sm focus:border-tactical-accent-primary focus:outline-none"
                   />
                 </div>
+
+                {/* Buildings per Pixel (only for pixel sampling) */}
+                {sampleTarget === 'pixels' && (
+                  <div>
+                    <label className="block text-xs text-tactical-text-muted mb-1">
+                      Buildings per Pixel
+                    </label>
+                    <input
+                      type="number"
+                      value={buildingsPerPixel}
+                      onChange={(e) => setBuildingsPerPixel(Math.max(0, parseInt(e.target.value) || 0))}
+                      min={0}
+                      className="w-full px-3 py-2 bg-tactical-bg-tertiary border border-tactical-border-medium text-tactical-text-primary font-mono text-sm focus:border-tactical-accent-primary focus:outline-none"
+                    />
+                    <p className="text-xs text-tactical-text-muted mt-1">
+                      {buildingsPerPixel === 0 ? 'No building sampling' : `Up to ${buildingsPerPixel} buildings selected per sampled pixel`}
+                    </p>
+                  </div>
+                )}
               </div>
             )}