/* eslint-disable class-methods-use-this */
import React from "react";
import { render, screen } from "@testing-library/react";
import { describe, expect, it } from "vitest";
import LocalLogicClient from "@local-logic/client";
import { scoresData } from "./test-data";
import { Badge, BarChart, Root } from "./index";
import { LocalLogicProvider } from "../../context";

const client = LocalLogicClient("123");

Object.defineProperty(window, "ResizeObserver", {
  value: class ResizeObserver {
    observe() {
      // do nothing
    }

    unobserve() {
      // do nothing
    }

    disconnect() {
      // do nothing
    }
  },
});

describe("Score", () => {
  it("renders badge", () => {
    render(
      <Root
        options={{
          score: "groceries",
          scoresData,
        }}
      >
        <Badge />
      </Root>
    );
    const score = screen.getByTestId("score-badge");
    expect(score).toBeDefined();
  });

  it("renders BarChart with location", () => {
    render(
      <LocalLogicProvider client={client}>
        <Root
          options={{
            score: "groceries",
            scoresData,
          }}
        >
          <BarChart />
        </Root>
      </LocalLogicProvider>
    );
    const locationText = screen.getByText("This Location");
    expect(locationText).toBeDefined();
  });
});