abner
/
for-legacy-web
mirror of https://github.com/stoatchat/for-legacy-web
1
0
Fork 1
Code Issues Packages Projects Releases Wiki Activity

feat: geoblock age restricted content 

https://www.ofcom.org.uk/online-safety/protecting-children/online-age-checks-must-be-in-force-from-tomorrow
https://petition.parliament.uk/petitions/722903
https://wikimediafoundation.org/news/2025/07/17/wikimedia-foundation-challenges-uk-online-safety-act-regulations/
pull/1139/head
izzy 2025-07-25 19:49:00 +01:00
parent 2a1f7cb8bb
commit 3dc9f6b045
No known key found for this signature in database
1 changed files with 69 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

89
src/components/common/AgeGate.tsx
View File

@ -4,9 +4,9 @@ import { Channel } from "revolt.js";
import styled from "styled-components/macro"; import styled from "styled-components/macro";
import { Text } from "preact-i18n"; import { Text } from "preact-i18n";
import { useState } from "preact/hooks"; import { useEffect, useState } from "preact/hooks";
import { Button, Checkbox } from "@revoltchat/ui"; import { Button, Checkbox, Preloader } from "@revoltchat/ui";
import { useApplicationState } from "../../mobx/State"; import { useApplicationState } from "../../mobx/State";
import { SECTION_NSFW } from "../../mobx/stores/Layout"; import { SECTION_NSFW } from "../../mobx/stores/Layout";
@ -45,14 +45,36 @@ type Props = {
channel: Channel; channel: Channel;
}; };
let geoBlock:
| undefined
| {
countryCode: string;
isAgeRestrictedGeo: true;
};
export default observer((props: Props) => { export default observer((props: Props) => {
const history = useHistory(); const history = useHistory();
const layout = useApplicationState().layout; const layout = useApplicationState().layout;
const [geoLoaded, setGeoLoaded] = useState(typeof geoBlock !== "undefined");
const [ageGate, setAgeGate] = useState(false); const [ageGate, setAgeGate] = useState(false);
if (ageGate || !props.gated) { useEffect(() => {
if (!geoLoaded) {
fetch("https://geo.revolt.chat")
.then((res) => res.json())
.then((data) => {
geoBlock = data;
setGeoLoaded(true);
});
}
}, []);
if (!geoBlock) return <Preloader type="spinner" />;
if ((ageGate && !geoBlock.isAgeRestrictedGeo) || !props.gated) {
return <>{props.children}</>; return <>{props.children}</>;
} }
if ( if (
!( !(
props.channel.channel_type === "Group" || props.channel.channel_type === "Group" ||
@ -76,23 +98,50 @@ export default observer((props: Props) => {
</a> </a>
</span> </span>
<Checkbox {geoBlock.isAgeRestrictedGeo ? (
title={<Text id="app.main.channel.nsfw.confirm" />} <div style={{ maxWidth: "420px", textAlign: "center" }}>
value={layout.getSectionState(SECTION_NSFW, false)} This content is not available in your country.
onChange={() => layout.toggleSectionState(SECTION_NSFW, false)} {geoBlock.countryCode === "GB" && (
/> <>
<div className="actions"> <br />
<Button palette="secondary" onClick={() => history.goBack()}> <br />
<Text id="app.special.modals.actions.back" /> Ofcom sets a legal requirement for platforms to
</Button> verify the age of users to access age restricted
<Button content. Revolt neither has the ability to implement
palette="secondary" nor currently intends to implement these measures as
onClick={() => the current available solutions come with privacy
layout.getSectionState(SECTION_NSFW) && setAgeGate(true) and cost concerns.
}> </>
<Text id={`app.main.channel.nsfw.${props.type}.confirm`} /> )}
</Button> </div>
</div> ) : (
<>
<Checkbox
title={<Text id="app.main.channel.nsfw.confirm" />}
value={layout.getSectionState(SECTION_NSFW, false)}
onChange={() =>
layout.toggleSectionState(SECTION_NSFW, false)
}
/>
<div className="actions">
<Button
palette="secondary"
onClick={() => history.goBack()}>
<Text id="app.special.modals.actions.back" />
</Button>
<Button
palette="secondary"
onClick={() =>
layout.getSectionState(SECTION_NSFW) &&
setAgeGate(true)
}>
<Text
id={`app.main.channel.nsfw.${props.type}.confirm`}
/>
</Button>
</div>
</>
)}
</Base> </Base>
); );
}); });