[Bug]: deletePack() only removes metadata, not tile data

[djangoamidala]

Mapbox Implementation

Mapbox

Mapbox Version

default

React Native Version

0.78.2

Platform

Android, iOS

@rnmapbox/maps version

10.1.39

Standalone component to reproduce

import React, { useEffect } from 'react';
import { View, Button, Alert } from 'react-native';
import Mapbox from '@rnmapbox/maps';

// Set your Mapbox access token here
Mapbox.setAccessToken('YOUR_MAPBOX_ACCESS_TOKEN');

const packName = 'test-pack';

export default function OfflineTest() {
  useEffect(() => {
    // Optional: Subscribe to download progress and errors
    Mapbox.offlineManager.subscribe(
      packName,
      (progress) => {
        console.log('Progress:', progress.percentage, '%');
      },
      (error) => {
        if (error) {
          console.error('Offline error:', error);
        }
      }
    );

    // Unsubscribe on cleanup
    return () => {
      Mapbox.offlineManager.unsubscribe(packName);
    };
  }, []);

  const createPack = async () => {
    try {
      const bounds = [[2.3, 48.8], [2.4, 48.9]]; // Paris area (lng, lat)
      const minZoom = 10;
      const maxZoom = 16;

      await Mapbox.offlineManager.createPack(
        {
          name: packName,
          styleURL: Mapbox.StyleURL.Street,
          bounds,
          minZoom,
          maxZoom,
        },
        (progress) => {
          console.log('Downloading:', progress.percentage, '%');
        },
        (error) => {
          if (error) {
            console.error('Download error:', error);
          }
        }
      );

      Alert.alert('Pack creation started');
    } catch (e) {
      console.error('CreatePack error:', e);
    }
  };

  const deletePack = async () => {
    try {
      await Mapbox.offlineManager.deletePack(packName);
      Alert.alert('Pack deleted');
    } catch (e) {
      console.error('DeletePack error:', e);
    }
  };

  return (
    <View style={{ flex: 1, justifyContent: 'center', padding: 20 }}>
      <Button title="Create Pack" onPress={createPack} />
      <View style={{ height: 20 }} />
      <Button title="Delete Pack" onPress={deletePack} />
    </View>
  );
}

Observed behavior and steps to reproduce

No response

Expected behavior

I expect a way to delete the data from the cache, actually the pack is deleted but not the tiles in cache so i can always use them in offline

Notes / preliminary analysis

Hi, I’ve been waiting for quite a while for a fix to the deletePack() behavior in offline mode. Currently, no matter what I try, the cached data remains — only the pack metadata is deleted.
I tried deleting the data using react-native-fs, but it doesn’t work properly since it only removes the files, not the database entries.
I tried every possible way in the documentation but nothing work

The only workaround I found is clearing the entire cache, but the issue is that we can’t selectively keep one or more packs — everything is removed. :/

Additional links and references

No response

[mfazekas]

You need to add
tileStore.setOption("disk-quota", Value(100 * 1024 * 1024))

import { TileStore } from '@rnmapbox/maps';

const tileStore = await TileStore.shared();
tileStore.setOption("disk-quota", 0)

https://docs.mapbox.com/android/maps/guides/offline/#tile-store-disk-quota