Function SettingsPage

client-next/src/app/settings/page.tsx:52–599

()

] as const;

export default function SettingsPage() {
  const { config, loading, saveConfig, refreshData } = useApp();
  const [pathsInfoBox, setPathsInfo] = useState<PathsInfo | null>(null);
  const [manualPath, setManualPath] = useState("");
  const fileInputRef = useRef<HTMLInputElement>(null);
  const [openSections, setOpenSections] = useState<Record<string, boolean>>({
    general: true,
    permissions: false,
    prompts: false,
    backup: false,
    sincronizado: false,
  });
  
const [systemPrompt, setSystemPrompt] = useState("");
  const [loadingPrompt, setLoadingPrompt] = useState(false);
  const [savingPrompt, setSavingPrompt] = useState(false);
  const { theme } = useTheme();

  const [ghBackupStatus, setGhBackupStatus] = useState<GitHubBackupStatus | null>(null);
  const [ghOwner, setGhOwner] = useState("");
  const [ghRepo, setGhRepo] = useState("opencode-backup");
  const [ghBranch, setGhBranch] = useState("main");
  const [backingUp, setBackingUp] = useState(false);
  const [restoring, setRestoring] = useState(false);


  const toggleSection = (section: string) => {
    setOpenSections(prev => ({ ...prev, [section]: !prev[section] }));
  };

  useEffect(() => {
    getPaths().then(setPathsInfo).catch(console.error);
    loadSystemPrompt();

    getGitHubBackupStatus().then(status => {
      setGhBackupStatus(status);
      if (status.config) {
        if (status.config.owner) setGhOwner(status.config.owner);
        if (status.config.repo) setGhRepo(status.config.repo);
        if (status.config.branch) setGhBranch(status.config.branch);
      }
      if (status.user && !status.config?.owner) setGhOwner(status.user);
    }).catch(console.error);
  }, []);

  const loadSystemPrompt = async () => {
    try {
      setLoadingPrompt(true);
      const res = await api.get('/prompts/global');
      setSystemPrompt(res.data.content);
    } catch (error) {
      console.error("Error loading prompt:", error);
    } finally {
      setLoadingPrompt(false);
    }
  };

  const handleSaveSystemPrompt = async () => {