Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 | 4x 4x 1x 3x 3x | import { useParams } from "react-router-dom"; import { useQuery } from "react-query"; import { Strip, Icon } from "@canonical/react-components"; import SectionNav from "../../components/SectionNav"; import PublisherSettingsForm from "./PublisherSettingsForm"; import { setPageTitle } from "../../utils"; function PublisherSettings() { const { snapId } = useParams(); const { data, isLoading, isFetched } = useQuery({ queryKey: ["settingsData"], queryFn: async () => { const response = await fetch(`/api/${snapId}/settings`); if (!response.ok) { throw new Error("There was a problem fetching settings data"); } const data = await response.json(); return data.data; }, }); setPageTitle(`Settings for ${snapId}`); return ( <> <h1 className="p-heading--4" aria-live="polite"> <a href="/snaps">My snaps</a> / <a href={`/${snapId}`}>{snapId}</a> / Settings </h1> <SectionNav snapName={snapId} activeTab="settings" /> {isLoading && ( <Strip shallow> <p> <Icon name="spinner" className="u-animate--spin" /> Loading... </p> </Strip> )} {!isLoading && isFetched && data && ( <PublisherSettingsForm settings={data} /> )} </> ); } export default PublisherSettings; |