148 lines
3.7 KiB
TypeScript
148 lines
3.7 KiB
TypeScript
import { Fragment, h, VNode } from "preact";
|
|
import { useState } from "preact/hooks";
|
|
import {
|
|
Button,
|
|
ButtonSuccess,
|
|
ButtonWarning,
|
|
Title,
|
|
} from "../components/styled/index.js";
|
|
import { useTranslationContext } from "../context/translation.js";
|
|
import { TermsOfServiceSection } from "../cta/TermsOfServiceSection.js";
|
|
import { useAsyncAsHook } from "../hooks/useAsyncAsHook.js";
|
|
import { buildTermsOfServiceState, TermsState } from "../utils/index.js";
|
|
import * as wxApi from "../wxApi.js";
|
|
|
|
export interface Props {
|
|
url: string;
|
|
onCancel: () => void;
|
|
onConfirm: () => void;
|
|
}
|
|
|
|
export function ExchangeAddConfirmPage({
|
|
url,
|
|
onCancel,
|
|
onConfirm,
|
|
}: Props): VNode {
|
|
const detailsHook = useAsyncAsHook(async () => {
|
|
const tos = await wxApi.getExchangeTos(url, ["text/xml"]);
|
|
|
|
const tosState = buildTermsOfServiceState(tos);
|
|
|
|
return { tos: tosState };
|
|
});
|
|
|
|
const termsNotFound: TermsState = {
|
|
status: "notfound",
|
|
version: "",
|
|
content: undefined,
|
|
};
|
|
const terms = !detailsHook
|
|
? undefined
|
|
: detailsHook.hasError
|
|
? termsNotFound
|
|
: detailsHook.response.tos;
|
|
|
|
// const [errorAccepting, setErrorAccepting] = useState<string | undefined>(
|
|
// undefined,
|
|
// );
|
|
|
|
const onAccept = async (): Promise<void> => {
|
|
if (!terms) return;
|
|
try {
|
|
await wxApi.setExchangeTosAccepted(url, terms.version);
|
|
} catch (e) {
|
|
if (e instanceof Error) {
|
|
// setErrorAccepting(e.message);
|
|
}
|
|
}
|
|
};
|
|
return (
|
|
<View
|
|
url={url}
|
|
onAccept={onAccept}
|
|
onCancel={onCancel}
|
|
onConfirm={onConfirm}
|
|
terms={terms}
|
|
/>
|
|
);
|
|
}
|
|
|
|
export interface ViewProps {
|
|
url: string;
|
|
terms: TermsState | undefined;
|
|
onAccept: (b: boolean) => Promise<void>;
|
|
onCancel: () => void;
|
|
onConfirm: () => void;
|
|
}
|
|
|
|
export function View({
|
|
url,
|
|
terms,
|
|
onAccept: doAccept,
|
|
onConfirm,
|
|
onCancel,
|
|
}: ViewProps): VNode {
|
|
const { i18n } = useTranslationContext();
|
|
const needsReview =
|
|
!terms || terms.status === "changed" || terms.status === "new";
|
|
const [reviewed, setReviewed] = useState<boolean>(false);
|
|
|
|
return (
|
|
<Fragment>
|
|
<section>
|
|
<Title>
|
|
<i18n.Translate>Review terms of service</i18n.Translate>
|
|
</Title>
|
|
<div>
|
|
<i18n.Translate>Exchange URL</i18n.Translate>:
|
|
<a href={url} target="_blank" rel="noreferrer">
|
|
{url}
|
|
</a>
|
|
</div>
|
|
</section>
|
|
{terms && (
|
|
<TermsOfServiceSection
|
|
reviewed={reviewed}
|
|
reviewing={true}
|
|
terms={terms}
|
|
onAccept={(value) =>
|
|
doAccept(value).then(() => {
|
|
setReviewed(value);
|
|
})
|
|
}
|
|
/>
|
|
)}
|
|
|
|
<footer>
|
|
<Button onClick={onCancel}>
|
|
<i18n.Translate>Cancel</i18n.Translate>
|
|
</Button>
|
|
{!terms && (
|
|
<Button disabled>
|
|
<i18n.Translate>Loading terms..</i18n.Translate>
|
|
</Button>
|
|
)}
|
|
{terms && (
|
|
<Fragment>
|
|
{needsReview && !reviewed && (
|
|
<ButtonSuccess disabled upperCased onClick={onConfirm}>
|
|
<i18n.Translate>Add exchange</i18n.Translate>
|
|
</ButtonSuccess>
|
|
)}
|
|
{(terms.status === "accepted" || (needsReview && reviewed)) && (
|
|
<ButtonSuccess upperCased onClick={onConfirm}>
|
|
<i18n.Translate>Add exchange</i18n.Translate>
|
|
</ButtonSuccess>
|
|
)}
|
|
{terms.status === "notfound" && (
|
|
<ButtonWarning upperCased onClick={onConfirm}>
|
|
<i18n.Translate>Add exchange anyway</i18n.Translate>
|
|
</ButtonWarning>
|
|
)}
|
|
</Fragment>
|
|
)}
|
|
</footer>
|
|
</Fragment>
|
|
);
|
|
}
|