import { useSearchParams } from "react-router-dom";
import { MessageStream } from "../../components/messageStream/MessageStream";
import { useI18n } from "../../i18n";

export function Browse() {
  const { t } = useI18n();
  const [sp] = useSearchParams();
  const q = sp.get("q") || "";
  return (
    <section className="space-y-3">
      <h1 className="mx-auto max-w-full px-3 text-2xl font-bold md:max-w-[820px] lg:max-w-[1080px] xl:max-w-[1180px]">
        {q ? `${t("search")}: ${q}` : t("all")}
      </h1>
      <MessageStream scope={{ kind: "all" }} />
    </section>
  );
}