Connect Expo Drizzle Studio with op-sqlite

drizzle-studio-op-sqlite.ts

import { useDevToolsPluginClient } from "expo/devtools";
import { useEffect } from "react";
import { type DB } from "@op-engineering/op-sqlite";

export function DrizzleStudio(db:DB) {
  const client = useDevToolsPluginClient("expo-drizzle-studio-plugin");
  const transferData = async (e: {
    sql: string;
    params: (string | number)[];
    arrayMode: boolean;
    id: string;
  }) => {
    if (!db) return;
    try {
      if (e.arrayMode) {
        const data = await db.executeRaw(e.sql, e.params);
        client?.sendMessage(`transferData-${e.id}`, {
          from: "app",
          data: data,
        });
      } else {
        const data = await db.execute(e.sql, e.params);
        client?.sendMessage(`transferData-${e.id}`, {
          from: "app",
          data: data.rows,
        });
      }

    } catch (error) {
      console.error(error);
    }
  };
  useEffect(() => {
    const subscriptions: any[] = [];
    subscriptions.push(client?.addMessageListener("getData", transferData));
    return () => {
      for (const subscription of subscriptions) {
        subscription?.remove();
      }
    };
  }, [client]);

  return null;
}