Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Make confirm popup for adult consent #2419

Merged
merged 25 commits into from
Apr 18, 2024
Merged

Make confirm popup for adult consent #2419

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
25 commits
Select commit Hold shift + click to select a range
fff198a
Make confirm popup for adult consent
SleeplessOne1917 Apr 12, 2024
d51cf75
Fix import
SleeplessOne1917 Apr 12, 2024
588bacb
Merge branch 'main' into content-warning
SleeplessOne1917 Apr 12, 2024
b1fc470
Fix blur and adjust user settings
SleeplessOne1917 Apr 13, 2024
e98d1c9
Merge branch 'content-warning' of https://github.com/LemmyNet/lemmy-u…
SleeplessOne1917 Apr 13, 2024
3cae1b5
Merge branch 'main' into content-warning
SleeplessOne1917 Apr 13, 2024
0413fd6
Make confirmation popup more stylish
SleeplessOne1917 Apr 13, 2024
fea5ff1
Add setting to site settings form
SleeplessOne1917 Apr 13, 2024
fb38faf
Fix modal bug
SleeplessOne1917 Apr 14, 2024
c430678
Put adult consent logic all in one place
SleeplessOne1917 Apr 14, 2024
4fc425b
Make modal use markdown
SleeplessOne1917 Apr 14, 2024
b6d7efd
Fix consent modal showing up for currently logged in admin
SleeplessOne1917 Apr 14, 2024
42bc4ab
Add go-back redirect countdown
SleeplessOne1917 Apr 14, 2024
9869b00
Center modal title
SleeplessOne1917 Apr 14, 2024
afae55c
Handle enable_nsfw correctly
SleeplessOne1917 Apr 15, 2024
1e76395
Blur background of modal to hide spicy things
SleeplessOne1917 Apr 16, 2024
160048c
Add translations
SleeplessOne1917 Apr 16, 2024
5197206
Remove delay between page loading and being blurred
SleeplessOne1917 Apr 16, 2024
f97f396
Merge branch 'main' into content-warning
SleeplessOne1917 Apr 16, 2024
bbce909
Merge branch 'main' into content-warning
SleeplessOne1917 Apr 17, 2024
8e5599e
Revert "Remove delay between page loading and being blurred"
matc-pub Apr 18, 2024
1b4903d
Blur SSR by default when content warning is set
matc-pub Apr 18, 2024
ce72377
Make blur work correctly
SleeplessOne1917 Apr 18, 2024
3cbe7e1
Prevent images from downloading without consent
SleeplessOne1917 Apr 18, 2024
d5cfc73
Autoexpand
SleeplessOne1917 Apr 18, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion .eslintrc.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,7 @@
"prettier/prettier": "error",
"quote-props": 0,
"unicorn/filename-case": 0,
"jsx-a11y/media-has-caption": 0
"jsx-a11y/media-has-caption": 0,
"jsx-a11y/label-has-associated-control": 0
}
}
2 changes: 1 addition & 1 deletion lemmy-translations
Open in desktop
Submodule lemmy-translations updated 6 files
+8 −1 translations/bg.json
+9 −1 translations/da.json
+10 −1 translations/en.json
+12 −1 translations/eo.json
+17 −1 translations/es.json
+22 −3 translations/fr.json
2 changes: 2 additions & 0 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@
"classnames": "^2.5.1",
"clean-webpack-plugin": "^4.0.0",
"cookie": "^0.6.0",
"cookie-parser": "^1.4.6",
"copy-webpack-plugin": "^12.0.2",
"css-loader": "^6.10.0",
"date-fns": "^3.6.0",
Expand Down Expand Up @@ -94,6 +95,7 @@
"@types/autosize": "^4.0.3",
"@types/bootstrap": "^5.2.10",
"@types/cookie": "^0.6.0",
"@types/cookie-parser": "^1.4.7",
"@types/express": "^4.17.21",
"@types/html-to-text": "^9.0.4",
"@types/lodash.isequal": "^4.5.8",
Expand Down
28 changes: 28 additions & 0 deletions pnpm-lock.yaml
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 3 additions & 0 deletions src/assets/symbols.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 1 addition & 1 deletion src/client/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { initializeSite } from "@utils/app";
import { hydrate } from "inferno-hydrate";
import { BrowserRouter } from "inferno-router";
import { App } from "../shared/components/app/app";
import App from "../shared/components/app/app";
import { lazyHighlightjs } from "../shared/lazy-highlightjs";
import { loadUserLanguage } from "../shared/services/I18NextService";
import { verifyDynamicImports } from "../shared/dynamic-imports";
Expand Down
6 changes: 5 additions & 1 deletion src/server/handlers/catch-all-handler.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import { StaticRouter, matchPath } from "inferno-router";
import { Match } from "inferno-router/dist/Route";
import { renderToString } from "inferno-server";
import { GetSiteResponse, LemmyHttp } from "lemmy-js-client";
import { App } from "../../shared/components/app/app";
import App from "../../shared/components/app/app";
import {
InitialFetchRequest,
IsoDataOptionalSite,
Expand All @@ -28,6 +28,7 @@ import {
} from "../../shared/services/";
import { parsePath } from "history";
import { getQueryString } from "@utils/helpers";
import { adultConsentCookieKey } from "../../shared/config";

export default async (req: Request, res: Response) => {
try {
Expand Down Expand Up @@ -142,6 +143,9 @@ export default async (req: Request, res: Response) => {
site_res: site,
routeData,
errorPageData,
showAdultConsentModal:
!!site?.site_view.site.content_warning &&
!(site.my_user || req.cookies[adultConsentCookieKey]),
};

const wrapper = (
Expand Down
2 changes: 2 additions & 0 deletions src/server/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,10 @@ import ThemesListHandler from "./handlers/themes-list-handler";
import { setCacheControl, setDefaultCsp } from "./middleware";
import CodeThemeHandler from "./handlers/code-theme-handler";
import { verifyDynamicImports } from "../shared/dynamic-imports";
import cookieParser from "cookie-parser";

const server = express();
server.use(cookieParser());

const [hostname, port] = process.env["LEMMY_UI_HOST"]
? process.env["LEMMY_UI_HOST"].split(":")
Expand Down
13 changes: 12 additions & 1 deletion src/server/utils/create-ssr-html.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -80,13 +80,14 @@ export async function createSsrHtml(
<html ${helmet.htmlAttributes.toString()}>
<head>
<script nonce="${cspNonce}">
window.isoData = ${serialize(isoData)};

if (!document.documentElement.hasAttribute("data-bs-theme")) {
const light = window.matchMedia("(prefers-color-scheme: light)").matches;
document.documentElement.setAttribute("data-bs-theme", light ? "light" : "dark");
}
</script>
${lazyScripts}
<script nonce="${cspNonce}">window.isoData = ${serialize(isoData)}</script>

<!-- A remote debugging utility for mobile -->
${erudaStr}
Expand All @@ -97,6 +98,16 @@ export async function createSsrHtml(
${helmet.title.toString()}
${helmet.meta.toString()}

<style>
#app[data-adult-consent] {
filter: blur(10px);
-webkit-filter: blur(10px);
-moz-filter: blur(10px);
-o-filter: blur(10px);
-ms-filter: blur(10px);
}
</style>

<!-- Required meta tags -->
<meta name="Description" content="Lemmy">
<meta charset="utf-8">
Expand Down
51 changes: 24 additions & 27 deletions src/shared/components/app/app.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { isAnonymousPath, isAuthPath, setIsoData } from "@utils/app";
import { Component, RefObject, createRef, linkEvent } from "inferno";
import { Component, createRef, linkEvent } from "inferno";
import { Provider } from "inferno-i18next-dess";
import { Route, Switch } from "inferno-router";
import { IsoDataOptionalSite } from "../../interfaces";
Expand All @@ -13,42 +13,39 @@ import { Navbar } from "./navbar";
import "./styles.scss";
import { Theme } from "./theme";
import AnonymousGuard from "../common/anonymous-guard";
import { destroyTippy, setupTippy } from "../../tippy";
import AdultConsentModal from "../common/adult-consent-modal";

export class App extends Component<any, any> {
function handleJumpToContent(event) {
event.preventDefault();
}

export default class App extends Component<any, any> {
private isoData: IsoDataOptionalSite = setIsoData(this.context);
private readonly mainContentRef: RefObject<HTMLElement>;
private readonly rootRef = createRef<HTMLDivElement>();
constructor(props: any, context: any) {
super(props, context);
this.mainContentRef = createRef();
}

componentDidMount(): void {
setupTippy(this.rootRef);
}

componentWillUnmount(): void {
destroyTippy();
}

handleJumpToContent(event) {
event.preventDefault();
this.mainContentRef.current?.focus();
}

render() {
const siteRes = this.isoData.site_res;
const siteView = siteRes?.site_view;

return (
<>
<Provider i18next={I18NextService.i18n}>
<div id="app" className="lemmy-site" ref={this.rootRef}>
<Provider i18next={I18NextService.i18n}>
{/* This fragment is required to avoid an SSR error*/}
<>
{this.isoData.showAdultConsentModal && (
<AdultConsentModal
contentWarning={siteView!.site.content_warning!}
/>
)}
<div
id="app"
className="lemmy-site"
ref={this.rootRef}
data-adult-consent={this.isoData.showAdultConsentModal || null}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Much cleaner.

>
<button
type="button"
className="btn skip-link bg-light position-absolute start-0 z-3"
onClick={linkEvent(this, this.handleJumpToContent)}
onClick={linkEvent(this, handleJumpToContent)}
>
{I18NextService.i18n.t("jump_to_content", "Jump to content")}
</button>
Expand Down Expand Up @@ -115,8 +112,8 @@ export class App extends Component<any, any> {
</div>
<Footer site={siteRes} />
</div>
</Provider>
</>
</>
</Provider>
);
}
}
Loading