Gun React Example

gun-react.jsx

import React, { useEffect } from "react";
import { useGunState, useGunSetState } from "./utils/gun-hooks.js";

const session = new Date().toISOString();
const gun = window.Gun({ peers: ["http://127.0.0.1:8765/gun"] }).get(100 * 1);

export default () => {
  const [set, setSet] = useGunSetState(gun);
  const [lock, setLock] = useGunState(gun.get("locked"));
  const add = () => setSet("hello" + Math.random());
  return !lock ? (
    <>
      {set.map(({ data, remove }) => (
        <>
          <div>{data}</div>
          <button onClick={remove}>Remove</button>
        </>
      ))}
      <button onClick={add}>Add</button>
      <button onClick={() => setLock(!lock)}>Lock</button>
    </>
  ) : (
    set.map(({ data }) => <div>{data}</div>)
  );
};