"use client";
import React from "react";
import { useEffect } from "react";
import clipboard from "copy-to-clipboard";
import { Toast } from "antd-mobile";
function Error({ error, reset }) {
  useEffect(() => {
    // Log the error to an error reporting service
    console.error(reset);
  }, [error]);
  //保存内容到剪贴板
  const copy = (_data) => {
    // console.log("_data", _data);
    clipboard(_data);
    Toast.show({
      icon: "success",
      content: "已复制到剪贴板",
      position: "top",
    });
  };
  return (
    <section className="h-screen flex flex-col container justify-center items-center">
      <img
        className="w-full max-w-2xl -mt-12"
        src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL + "/svgs/illustatus.svg"}
        alt=""
      />
      <div className="p-4">
        <p className="text-lg text-center font-base text-white">
          糟糕，应用出现问题了。
        </p>
        <p className="mt-6 text-center font-base text-gray-500">
          <span>
            感谢您将问题反馈给我们，您可将相关使用场景或者录屏发送至邮箱：
          </span>
          <span
            onClick={() => copy("xinyidaole@outlook.com")}
            className="text-blue-500 underline underline-offset-1"
          >
            xinyidaole@outlook.com
          </span>
        </p>
      </div>
    </section>
  );
}

export default Error;