Function ProjectsPage

frontend/src/react/pages/settings/ProjectsPage.tsx:228–756

()

// ============================================================

export function ProjectsPage() {
  const { t } = useTranslation();
  const isLoggedIn = useAppStore((s) => s.isLoggedIn());

  // Search state — managed as SearchParams (query + scopes)
  const [searchParams, setSearchParams] = useState<SearchParams>(() => {
    const currentRoute = router.currentRoute.value;
    // Migrate old URL format
    const queryState = currentRoute.query.state as string;
    if (queryState === "archived" || queryState === "all") {
      const stateValue = queryState === "archived" ? "DELETED" : "ALL";
      return { query: "", scopes: [{ id: "state", value: stateValue }] };
    }
    const queryString = currentRoute.query.q as string;
    if (queryString) {
      const scopes: { id: string; value: string }[] = [];
      const queryParts: string[] = [];
      for (const token of queryString.split(/\s+/).filter(Boolean)) {
        const colonIdx = token.indexOf(":");
        if (colonIdx > 0) {
          const id = token.substring(0, colonIdx);
          const value = token.substring(colonIdx + 1);
          if (value && (id === "state" || id === "label")) {
            scopes.push({ id, value });
            continue;
          }
        }
        queryParts.push(token);
      }
      return { query: queryParts.join(" "), scopes };
    }
    return { query: "", scopes: [] };
  });

  // Scope options for the AdvancedSearch
  const canUndelete = hasWorkspacePermissionV2("bb.projects.undelete");
  const scopeOptions: ScopeOption[] = useMemo(() => {
    const stateOption: ScopeOption = {
      id: "state",
      title: t("common.state"),
      description: t("issue.advanced-search.scope.state.description"),
      options: [
        { value: "ACTIVE", keywords: ["active"] },
        ...(canUndelete
          ? [
              { value: "DELETED", keywords: ["archived", "deleted"] },
              { value: "ALL", keywords: ["all"] },
            ]
          : []),
      ],
    };
    const labelOption: ScopeOption = {
      id: "label",
      title: t("common.labels"),
      description: t("issue.advanced-search.scope.label.description"),
      allowMultiple: true,
    };
    return [labelOption, stateOption];