MirrorFrame Backup

Required keys.

Add these in your Lovable project under Settings → Secrets before pasting the prompt below.

Paste into a fresh Lovable project. Make sure all five secrets above are set first. read the build strategy →

Build "MirrorFrame Backup" in ONE Lovable message. Single-page demo.

CONCEPT
Create decentralized backups of photos pinned on IPFS to protect against data loss permanently.
Discipline: Photography (image backup).
Onchain primitive: IPFS via Pinata. Why this primitive: Pinata JWT offers permanent, redundant IPFS storage for safe off-site photo backup.

5-CREDIT BUDGET (HARD LIMIT):
- ONE single-page app. No router, no Lovable Cloud, no database, no auth flows beyond Privy drop-in.
- ONE Solidity contract, <=80 lines, deployed to Polygon Amoy (chainId 80002), verified on PolygonScan.
- Privy is always the auth + sponsored-tx layer (Google login, embedded wallet).
- Pinata/IPFS only if the idea genuinely needs to store a file or metadata.
- At most ONE AI call per user action (use Lovable AI Gateway with LOVABLE_API_KEY if AI is part of the idea).
- Skip tests, skip CI, skip docs pages. Ship the demo, nothing else.

STACK
- React + Vite single page (the index route).
- Privy embedded wallet wraps `<App />` in src/main.tsx:
    <PrivyProvider appId={import.meta.env.VITE_PRIVY_APP_ID}
      config={{ loginMethods:['google'], embeddedWallets:{ethereum:{createOnLogin:'users-without-wallets'}},
                defaultChain:{ id: 80002, name:'Polygon Amoy' } }}>

SPONSORED TX (required — zero-gas UX):
- Get the embedded wallet: `const { wallets } = useWallets(); const embedded = wallets.find(w => w.walletClientType === 'privy');`
- Send with BOTH `address` and `sponsor: true`, otherwise Privy falls back to user-paid and pops "Add funds on Polygon Amoy":
    const { sendTransaction } = useSendTransaction();
    await sendTransaction(
      { to: CONTRACT_ADDRESS, data, chainId: 80002 },
      { address: embedded.address, sponsor: true },
    );
- `sponsor: true` alone is not enough — the Privy dashboard sponsorship policy must be enabled for Polygon Amoy (see PRIVY DASHBOARD SETUP).

PRIVY DASHBOARD SETUP (one-time, at https://dashboard.privy.io for the app matching PRIVY_APP_ID):
1. Gas Sponsorship -> Add chain -> Polygon Amoy (chainId 80002).
2. Toggle "App pays" for that chain.
3. Enable "Allow transactions from the client".
4. Fund the sponsorship balance with a small amount of MATIC on Amoy (Privy shows the deposit address).
Without these four steps every `sponsor: true` call falls back to user-paid gas.

- src/lib/pinata.ts uploads via `fetch('https://api.pinata.cloud/pinning/pinFileToIPFS', { method:'POST', headers:{ Authorization: `Bearer ${import.meta.env.VITE_PINATA_JWT}` }, body: fd })`.
- Hardhat in /contracts (kept outside the Vite bundle). Install
  `@nomicfoundation/hardhat-ethers` AND `@nomicfoundation/hardhat-verify` (>=2.x).
  DO NOT install `@nomicfoundation/hardhat-toolbox` — it drags Hardhat 3 peers.
- hardhat.config.cjs — Polygon Amoy + Etherscan v2 single-key:
    require("@nomicfoundation/hardhat-ethers");
    require("@nomicfoundation/hardhat-verify");
    const pk = process.env.METAMASK_PRIVATE_KEY;
    module.exports = {
      solidity: { version: "0.8.24", settings: { optimizer: { enabled: true, runs: 200 } } },
      networks: { polygonAmoy: {
        url: process.env.POLYGON_AMOY_RPC_URL || "https://rpc-amoy.polygon.technology",
        accounts: pk ? [pk.startsWith("0x") ? pk : "0x" + pk] : [],
        chainId: 80002,
      } },
      etherscan: {
        apiKey: process.env.ETHERSCAN_API_KEY,          // single Etherscan v2 key covers PolygonScan
        customChains: [{
          network: "polygonAmoy", chainId: 80002,
          urls: {
            apiURL: "https://api.etherscan.io/v2/api?chainid=80002",
            browserURL: "https://amoy.polygonscan.com",
          },
        }],
      },
      sourcify: { enabled: false },
    };
- Deploy: `npx hardhat run scripts/deploy.cjs --network polygonAmoy`.
- Verify (run RIGHT AFTER deploy, no constructor args for these contracts):
  `npx hardhat verify --network polygonAmoy <address>`
  On success it prints "Successfully verified contract … on the block explorer"
  and the source becomes readable at
  `https://amoy.polygonscan.com/address/<address>#code`.
- Frontend reads: create a viem public client with the Polygon Amoy RPC too —
  `createPublicClient({ chain: polygonAmoy, transport: http(import.meta.env.VITE_POLYGON_AMOY_RPC_URL) })`
  (import `polygonAmoy` from `viem/chains`).
  Expose the RPC to the client by also setting VITE_POLYGON_AMOY_RPC_URL to the same value.
- Write the deployed address to `src/data/contract.json` so the UI links to
  `https://amoy.polygonscan.com/address/<address>`.

CONTRACT (contracts/MirrorFrameBackup.sol):
```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.24;
/// @title CIDLogMirrorFrameBackup
/// @notice Create decentralized backups of photos pinned on IPFS to protect against data loss permanently.
/// @notice Built during the Creative AI & Quantum Hackathon organised by StreetKode Fam during Indian Krump Festival 14
contract CIDLogMirrorFrameBackup {
    event Logged(address indexed author, string cid, uint256 at);
    /// @notice Built during the Creative AI & Quantum Hackathon organised by StreetKode Fam during Indian Krump Festival 14
    function log(string calldata cid) external {
        emit Logged(msg.sender, cid, block.timestamp);
    }
}
```

USER FLOW
1. Land on page -> 'Sign in with Google' (Privy) -> embedded wallet auto-provisioned on Polygon Amoy.
2. On submit, pin the image backup artefact to Pinata, then call `log(cid)` on the contract via Privy sponsored tx. Render the CID, IPFS gateway preview, and PolygonScan tx link.
3. Footer renders: "Built during the Creative AI & Quantum Hackathon organised by StreetKode Fam during Indian Krump Festival 14"

REQUIRED SECRETS (Lovable -> Project Settings -> Secrets):
- METAMASK_PRIVATE_KEY  Polygon Amoy deployer key. Fund it: https://faucet.polygon.technology/
                        (alt: https://faucet.polygon.technology/)
- POLYGON_AMOY_RPC_URL  Alchemy Polygon Amoy HTTPS endpoint (https://polygon-amoy.g.alchemy.com/v2/<key>)
                        OR the public default https://rpc-amoy.polygon.technology. Create a free app: https://dashboard.alchemy.com/
- ETHERSCAN_API_KEY     Single Etherscan v2 key — verifies on PolygonScan (chainId 80002) with no extra key.
                        Get: https://etherscan.io/myapikey
- PRIVY_APP_ID          Google sign-in + sponsored tx. See PRIVY DASHBOARD SETUP below to enable Polygon Amoy sponsorship.
                        Docs: https://docs.privy.io/llms-full.txt
- PINATA_JWT            IPFS uploads (only if app pins media). Docs: https://docs.pinata.cloud/llms-full.txt

CREDIT (must appear in UI footer AND as NatSpec on every deployed contract):
Built during the Creative AI & Quantum Hackathon organised by StreetKode Fam during Indian Krump Festival 14

Market sizing.

Indicative figures for hackathon pitches — refine with your own research before raising.