mirror of
https://github.com/LemmyNet/lemmy-ui.git
synced 2024-12-23 03:11:25 +00:00
Merge branch 'main' into rate-limiting-tab
This commit is contained in:
commit
2a4f75b539
18 changed files with 337 additions and 377 deletions
6
.babelrc
6
.babelrc
|
@ -10,11 +10,11 @@
|
|||
}
|
||||
}
|
||||
],
|
||||
["@babel/typescript", {"isTSX": true, "allExtensions": true}]
|
||||
["@babel/typescript", { "isTSX": true, "allExtensions": true }]
|
||||
],
|
||||
"plugins": [
|
||||
"@babel/plugin-transform-runtime",
|
||||
["babel-plugin-inferno", { "imports": true }],
|
||||
["@babel/plugin-proposal-class-properties", { "loose": true }],
|
||||
["babel-plugin-inferno", { "imports": true }],
|
||||
["@babel/plugin-proposal-class-properties", { "loose": true }]
|
||||
]
|
||||
}
|
||||
|
|
|
@ -1,3 +1,7 @@
|
|||
generate_translations.js
|
||||
webpack.config.js
|
||||
src/api_tests
|
||||
**/*.png
|
||||
**/*.svg
|
||||
**/*.css
|
||||
**/*.scss
|
|
@ -3,9 +3,7 @@
|
|||
"env": {
|
||||
"browser": true
|
||||
},
|
||||
"plugins": [
|
||||
"@typescript-eslint"
|
||||
],
|
||||
"plugins": ["@typescript-eslint"],
|
||||
"extends": [
|
||||
"eslint:recommended",
|
||||
"plugin:@typescript-eslint/recommended",
|
||||
|
|
12
.github/ISSUE_TEMPLATE/BUG_REPORT.md
vendored
12
.github/ISSUE_TEMPLATE/BUG_REPORT.md
vendored
|
@ -1,10 +1,9 @@
|
|||
---
|
||||
name: "\U0001F41E Bug Report"
|
||||
about: Create a report to help us improve Lemmy
|
||||
title: ''
|
||||
title: ""
|
||||
labels: bug
|
||||
assignees: ''
|
||||
|
||||
assignees: ""
|
||||
---
|
||||
|
||||
Found a bug? Please fill out the sections below. 👍
|
||||
|
@ -15,7 +14,6 @@ For backend issues, use [lemmy](https://github.com/LemmyNet/lemmy)
|
|||
|
||||
A summary of the bug.
|
||||
|
||||
|
||||
### Steps to Reproduce
|
||||
|
||||
1. (for example) I clicked login, and an endless spinner show up.
|
||||
|
@ -24,6 +22,6 @@ A summary of the bug.
|
|||
|
||||
### Technical details
|
||||
|
||||
* Please post your log: `sudo docker-compose logs > lemmy_log.out`.
|
||||
* What OS are you trying to install lemmy on?
|
||||
* Any browser console errors?
|
||||
- Please post your log: `sudo docker-compose logs > lemmy_log.out`.
|
||||
- What OS are you trying to install lemmy on?
|
||||
- Any browser console errors?
|
||||
|
|
5
.github/ISSUE_TEMPLATE/FEATURE_REQUEST.md
vendored
5
.github/ISSUE_TEMPLATE/FEATURE_REQUEST.md
vendored
|
@ -1,10 +1,9 @@
|
|||
---
|
||||
name: "\U0001F680 Feature request"
|
||||
about: Suggest an idea for improving Lemmy
|
||||
title: ''
|
||||
title: ""
|
||||
labels: enhancement
|
||||
assignees: ''
|
||||
|
||||
assignees: ""
|
||||
---
|
||||
|
||||
For backend issues, use [lemmy](https://github.com/LemmyNet/lemmy)
|
||||
|
|
5
.github/ISSUE_TEMPLATE/QUESTION.md
vendored
5
.github/ISSUE_TEMPLATE/QUESTION.md
vendored
|
@ -1,10 +1,9 @@
|
|||
---
|
||||
name: "? Question"
|
||||
about: General questions about Lemmy
|
||||
title: ''
|
||||
title: ""
|
||||
labels: question
|
||||
assignees: ''
|
||||
|
||||
assignees: ""
|
||||
---
|
||||
|
||||
What's the question you have about lemmy?
|
||||
|
|
5
.github/ISSUE_TEMPLATE/hexbear.md
vendored
5
.github/ISSUE_TEMPLATE/hexbear.md
vendored
|
@ -1,10 +1,9 @@
|
|||
---
|
||||
name: Hexbear
|
||||
about: For hexbear issues
|
||||
title: ''
|
||||
title: ""
|
||||
labels: hexbear
|
||||
assignees: ''
|
||||
|
||||
assignees: ""
|
||||
---
|
||||
|
||||
For hexbear-related issues
|
||||
|
|
|
@ -1 +1,2 @@
|
|||
src/shared/translations
|
||||
src/shared/translations
|
||||
lemmy-translations
|
|
@ -69,7 +69,7 @@ pipeline:
|
|||
|
||||
publish_release_docker_manifest:
|
||||
image: plugins/manifest
|
||||
settings:
|
||||
settings:
|
||||
username:
|
||||
from_secret: docker_username
|
||||
password:
|
||||
|
@ -85,7 +85,7 @@ pipeline:
|
|||
|
||||
publish_latest_release_docker_manifest:
|
||||
image: plugins/manifest
|
||||
settings:
|
||||
settings:
|
||||
username:
|
||||
from_secret: docker_username
|
||||
password:
|
||||
|
|
42
README.md
42
README.md
|
@ -1,21 +1,21 @@
|
|||
# lemmy-ui
|
||||
|
||||
The official web app for [Lemmy](https://github.com/LemmyNet/lemmy), written in inferno.
|
||||
|
||||
Based off of MrFoxPro's [inferno-isomorphic-template](https://github.com/MrFoxPro/inferno-isomorphic-template).
|
||||
|
||||
## Configuration
|
||||
|
||||
The following environment variables can be used to configure lemmy-ui:
|
||||
|
||||
`ENV_VAR` | type | default | description
|
||||
--- | --- | --- | ---
|
||||
`LEMMY_UI_HOST` | `string` | `0.0.0.0:1234` | The IP / port that the lemmy-ui isomorphic node server is hosted at.
|
||||
`LEMMY_UI_LEMMY_INTERNAL_HOST` | `string` | `0.0.0.0:8536` | The internal IP / port that lemmy is hosted at. Often `lemmy:8536` if using docker.
|
||||
`LEMMY_UI_LEMMY_EXTERNAL_HOST` | `string` | `0.0.0.0:8536` | The external IP / port that lemmy is hosted at. Often `DOMAIN.TLD`.
|
||||
`LEMMY_UI_LEMMY_WS_HOST` | `string` | `0.0.0.0:8536` | An alternate location for lemmy's websocket address. Not usually necessary.
|
||||
`LEMMY_UI_HTTPS` | `bool` | `false` | Whether to use https.
|
||||
`LEMMY_UI_EXTRA_THEMES_FOLDER` | `string` | `./extra_themes` | A location for additional lemmy css themes.
|
||||
`LEMMY_UI_DEBUG` | `bool` | `false` | Loads the [Eruda](https://github.com/liriliri/eruda) debugging utility.
|
||||
`LEMMY_UI_DISABLE_CSP` | `bool` | `false` | Disables CSP security headers
|
||||
`LEMMY_UI_CUSTOM_HTML_HEADER` | `string` | | Injects a custom script into `<head>`.
|
||||
# lemmy-ui
|
||||
|
||||
The official web app for [Lemmy](https://github.com/LemmyNet/lemmy), written in inferno.
|
||||
|
||||
Based off of MrFoxPro's [inferno-isomorphic-template](https://github.com/MrFoxPro/inferno-isomorphic-template).
|
||||
|
||||
## Configuration
|
||||
|
||||
The following environment variables can be used to configure lemmy-ui:
|
||||
|
||||
| `ENV_VAR` | type | default | description |
|
||||
| ------------------------------ | -------- | ---------------- | ----------------------------------------------------------------------------------- |
|
||||
| `LEMMY_UI_HOST` | `string` | `0.0.0.0:1234` | The IP / port that the lemmy-ui isomorphic node server is hosted at. |
|
||||
| `LEMMY_UI_LEMMY_INTERNAL_HOST` | `string` | `0.0.0.0:8536` | The internal IP / port that lemmy is hosted at. Often `lemmy:8536` if using docker. |
|
||||
| `LEMMY_UI_LEMMY_EXTERNAL_HOST` | `string` | `0.0.0.0:8536` | The external IP / port that lemmy is hosted at. Often `DOMAIN.TLD`. |
|
||||
| `LEMMY_UI_LEMMY_WS_HOST` | `string` | `0.0.0.0:8536` | An alternate location for lemmy's websocket address. Not usually necessary. |
|
||||
| `LEMMY_UI_HTTPS` | `bool` | `false` | Whether to use https. |
|
||||
| `LEMMY_UI_EXTRA_THEMES_FOLDER` | `string` | `./extra_themes` | A location for additional lemmy css themes. |
|
||||
| `LEMMY_UI_DEBUG` | `bool` | `false` | Loads the [Eruda](https://github.com/liriliri/eruda) debugging utility. |
|
||||
| `LEMMY_UI_DISABLE_CSP` | `bool` | `false` | Disables CSP security headers |
|
||||
| `LEMMY_UI_CUSTOM_HTML_HEADER` | `string` | | Injects a custom script into `<head>`. |
|
||||
|
|
|
@ -12,7 +12,7 @@
|
|||
"build:prod": "webpack --mode=production",
|
||||
"clean": "yarn run rimraf dist",
|
||||
"dev": "yarn start",
|
||||
"lint": "node generate_translations.js && tsc --noEmit && eslint --report-unused-disable-directives --ext .js,.ts,.tsx src && prettier --check \"src/**/*.{ts,tsx,js,css,scss}\"",
|
||||
"lint": "node generate_translations.js && tsc --noEmit && eslint --report-unused-disable-directives --ext .js,.ts,.tsx \"src/**\" && prettier --check \"src/**/*.{ts,tsx,js,css,scss}\"",
|
||||
"prepare": "husky install",
|
||||
"start": "yarn build:dev --watch"
|
||||
},
|
||||
|
@ -89,6 +89,7 @@
|
|||
"devDependencies": {
|
||||
"@babel/core": "^7.21.8",
|
||||
"@types/autosize": "^4.0.0",
|
||||
"@types/bootstrap": "^5.2.6",
|
||||
"@types/express": "^4.17.17",
|
||||
"@types/html-to-text": "^9.0.0",
|
||||
"@types/markdown-it": "^12.2.3",
|
||||
|
|
|
@ -1,7 +1,3 @@
|
|||
.navbar-toggler {
|
||||
border: 0px;
|
||||
}
|
||||
|
||||
.navbar-expand-lg .navbar-nav .nav-link {
|
||||
padding-right: 0.75rem !important;
|
||||
padding-left: 0.75rem !important;
|
||||
|
@ -201,14 +197,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.dropdown-content {
|
||||
position: absolute;
|
||||
background-color: var(--light);
|
||||
min-width: 160px;
|
||||
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
|
||||
z-index: 2000;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: 2px solid var(--secondary);
|
||||
margin: 0.5em 5px;
|
||||
|
|
|
@ -3,6 +3,7 @@ import { BrowserRouter } from "inferno-router";
|
|||
import { App } from "../shared/components/app/app";
|
||||
import { initializeSite } from "../shared/utils";
|
||||
|
||||
import "bootstrap/js/dist/collapse";
|
||||
import "bootstrap/js/dist/dropdown";
|
||||
|
||||
const site = window.isoData.site_res;
|
||||
|
|
|
@ -356,7 +356,7 @@ export async function generateManifestBase64(site: Site) {
|
|||
|
||||
async function fetchIconPng(iconUrl: string) {
|
||||
return await fetch(
|
||||
iconUrl.replace(/https?:\/\/localhost:\d+/g, getHttpBaseInternal())
|
||||
iconUrl.replace(/https?:\/\/[^\/]+/g, getHttpBaseInternal())
|
||||
)
|
||||
.then(res => res.blob())
|
||||
.then(blob => blob.arrayBuffer());
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import { Component, linkEvent } from "inferno";
|
||||
import { Component, createRef, linkEvent } from "inferno";
|
||||
import { NavLink } from "inferno-router";
|
||||
import {
|
||||
CommentResponse,
|
||||
|
@ -39,14 +39,22 @@ interface NavbarProps {
|
|||
}
|
||||
|
||||
interface NavbarState {
|
||||
expanded: boolean;
|
||||
unreadInboxCount: number;
|
||||
unreadReportCount: number;
|
||||
unreadApplicationCount: number;
|
||||
showDropdown: boolean;
|
||||
onSiteBanner?(url: string): any;
|
||||
}
|
||||
|
||||
function handleCollapseClick(i: Navbar) {
|
||||
if (i.collapseButtonRef.current?.ariaExpanded === "true") {
|
||||
i.collapseButtonRef.current?.click();
|
||||
}
|
||||
}
|
||||
|
||||
function handleLogOut() {
|
||||
UserService.Instance.logout();
|
||||
}
|
||||
|
||||
export class Navbar extends Component<NavbarProps, NavbarState> {
|
||||
private wsSub: Subscription;
|
||||
private userSub: Subscription;
|
||||
|
@ -57,10 +65,9 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
|
|||
unreadInboxCount: 0,
|
||||
unreadReportCount: 0,
|
||||
unreadApplicationCount: 0,
|
||||
expanded: false,
|
||||
showDropdown: false,
|
||||
};
|
||||
subscription: any;
|
||||
collapseButtonRef = createRef<HTMLButtonElement>();
|
||||
|
||||
constructor(props: any, context: any) {
|
||||
super(props, context);
|
||||
|
@ -113,85 +120,228 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
|
|||
this.unreadApplicationCountSub.unsubscribe();
|
||||
}
|
||||
|
||||
render() {
|
||||
return this.navbar();
|
||||
}
|
||||
|
||||
// TODO class active corresponding to current page
|
||||
navbar() {
|
||||
let siteView = this.props.siteRes.site_view;
|
||||
let person = UserService.Instance.myUserInfo?.local_user_view.person;
|
||||
render() {
|
||||
const siteView = this.props.siteRes.site_view;
|
||||
const person = UserService.Instance.myUserInfo?.local_user_view.person;
|
||||
return (
|
||||
<nav className="navbar navbar-expand-md navbar-light shadow-sm p-0 px-3">
|
||||
<div className="container-lg">
|
||||
<NavLink
|
||||
to="/"
|
||||
onMouseUp={linkEvent(this, this.handleHideExpandNavbar)}
|
||||
title={siteView.site.description ?? siteView.site.name}
|
||||
className="d-flex align-items-center navbar-brand mr-md-3"
|
||||
>
|
||||
{siteView.site.icon && showAvatars() && (
|
||||
<PictrsImage src={siteView.site.icon} icon />
|
||||
<nav className="navbar navbar-expand-md navbar-light shadow-sm p-0 px-3 container-lg">
|
||||
<NavLink
|
||||
to="/"
|
||||
title={siteView.site.description ?? siteView.site.name}
|
||||
className="d-flex align-items-center navbar-brand mr-md-3"
|
||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||
>
|
||||
{siteView.site.icon && showAvatars() && (
|
||||
<PictrsImage src={siteView.site.icon} icon />
|
||||
)}
|
||||
{siteView.site.name}
|
||||
</NavLink>
|
||||
{person && (
|
||||
<ul className="navbar-nav d-flex flex-row ml-auto d-md-none">
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
to="/inbox"
|
||||
className="p-1 nav-link border-0"
|
||||
title={i18n.t("unread_messages", {
|
||||
count: Number(this.state.unreadInboxCount),
|
||||
formattedCount: numToSI(this.state.unreadInboxCount),
|
||||
})}
|
||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||
>
|
||||
<Icon icon="bell" />
|
||||
{this.state.unreadInboxCount > 0 && (
|
||||
<span className="mx-1 badge badge-light">
|
||||
{numToSI(this.state.unreadInboxCount)}
|
||||
</span>
|
||||
)}
|
||||
</NavLink>
|
||||
</li>
|
||||
{this.moderatesSomething && (
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
to="/reports"
|
||||
className="p-1 nav-link border-0"
|
||||
title={i18n.t("unread_reports", {
|
||||
count: Number(this.state.unreadReportCount),
|
||||
formattedCount: numToSI(this.state.unreadReportCount),
|
||||
})}
|
||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||
>
|
||||
<Icon icon="shield" />
|
||||
{this.state.unreadReportCount > 0 && (
|
||||
<span className="mx-1 badge badge-light">
|
||||
{numToSI(this.state.unreadReportCount)}
|
||||
</span>
|
||||
)}
|
||||
</NavLink>
|
||||
</li>
|
||||
)}
|
||||
{siteView.site.name}
|
||||
</NavLink>
|
||||
{UserService.Instance.myUserInfo && (
|
||||
<>
|
||||
<ul className="navbar-nav ml-auto">
|
||||
{amAdmin() && (
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
to="/registration_applications"
|
||||
className="p-1 nav-link border-0"
|
||||
title={i18n.t("unread_registration_applications", {
|
||||
count: Number(this.state.unreadApplicationCount),
|
||||
formattedCount: numToSI(this.state.unreadApplicationCount),
|
||||
})}
|
||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||
>
|
||||
<Icon icon="clipboard" />
|
||||
{this.state.unreadApplicationCount > 0 && (
|
||||
<span className="mx-1 badge badge-light">
|
||||
{numToSI(this.state.unreadApplicationCount)}
|
||||
</span>
|
||||
)}
|
||||
</NavLink>
|
||||
</li>
|
||||
)}
|
||||
</ul>
|
||||
)}
|
||||
<button
|
||||
className="navbar-toggler border-0 p-1"
|
||||
type="button"
|
||||
aria-label="menu"
|
||||
data-tippy-content={i18n.t("expand_here")}
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#navbarDropdown"
|
||||
aria-controls="navbarDropdown"
|
||||
aria-expanded="false"
|
||||
ref={this.collapseButtonRef}
|
||||
>
|
||||
<Icon icon="menu" />
|
||||
</button>
|
||||
<div className="collapse navbar-collapse my-2" id="navbarDropdown">
|
||||
<ul className="mr-auto navbar-nav">
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
to="/communities"
|
||||
className="nav-link"
|
||||
title={i18n.t("communities")}
|
||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||
>
|
||||
{i18n.t("communities")}
|
||||
</NavLink>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
{/* TODO make sure this works: https://github.com/infernojs/inferno/issues/1608 */}
|
||||
<NavLink
|
||||
to={{
|
||||
pathname: "/create_post",
|
||||
search: "",
|
||||
hash: "",
|
||||
key: "",
|
||||
state: { prevPath: this.currentLocation },
|
||||
}}
|
||||
className="nav-link"
|
||||
title={i18n.t("create_post")}
|
||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||
>
|
||||
{i18n.t("create_post")}
|
||||
</NavLink>
|
||||
</li>
|
||||
{canCreateCommunity(this.props.siteRes) && (
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
to="/create_community"
|
||||
className="nav-link"
|
||||
title={i18n.t("create_community")}
|
||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||
>
|
||||
{i18n.t("create_community")}
|
||||
</NavLink>
|
||||
</li>
|
||||
)}
|
||||
<li className="nav-item">
|
||||
<a
|
||||
className="nav-link"
|
||||
title={i18n.t("support_lemmy")}
|
||||
href={donateLemmyUrl}
|
||||
>
|
||||
<Icon icon="heart" classes="small" />
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul className="navbar-nav">
|
||||
{!this.context.router.history.location.pathname.match(
|
||||
/^\/search/
|
||||
) && (
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
to="/search"
|
||||
className="nav-link"
|
||||
title={i18n.t("search")}
|
||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||
>
|
||||
<Icon icon="search" />
|
||||
</NavLink>
|
||||
</li>
|
||||
)}
|
||||
{amAdmin() && (
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
to="/admin"
|
||||
className="nav-link"
|
||||
title={i18n.t("admin_settings")}
|
||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||
>
|
||||
<Icon icon="settings" />
|
||||
</NavLink>
|
||||
</li>
|
||||
)}
|
||||
{person ? (
|
||||
<>
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
className="nav-link"
|
||||
to="/inbox"
|
||||
className="p-1 navbar-toggler nav-link border-0"
|
||||
onMouseUp={linkEvent(this, this.handleHideExpandNavbar)}
|
||||
title={i18n.t("unread_messages", {
|
||||
count: Number(this.state.unreadInboxCount),
|
||||
formattedCount: numToSI(this.state.unreadInboxCount),
|
||||
})}
|
||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||
>
|
||||
<Icon icon="bell" />
|
||||
{this.state.unreadInboxCount > 0 && (
|
||||
<span className="mx-1 badge badge-light">
|
||||
<span className="ml-1 badge badge-light">
|
||||
{numToSI(this.state.unreadInboxCount)}
|
||||
</span>
|
||||
)}
|
||||
</NavLink>
|
||||
</li>
|
||||
</ul>
|
||||
{this.moderatesSomething && (
|
||||
<ul className="navbar-nav ml-1">
|
||||
{this.moderatesSomething && (
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
className="nav-link"
|
||||
to="/reports"
|
||||
className="p-1 navbar-toggler nav-link border-0"
|
||||
onMouseUp={linkEvent(this, this.handleHideExpandNavbar)}
|
||||
title={i18n.t("unread_reports", {
|
||||
count: Number(this.state.unreadReportCount),
|
||||
formattedCount: numToSI(this.state.unreadReportCount),
|
||||
})}
|
||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||
>
|
||||
<Icon icon="shield" />
|
||||
{this.state.unreadReportCount > 0 && (
|
||||
<span className="mx-1 badge badge-light">
|
||||
<span className="ml-1 badge badge-light">
|
||||
{numToSI(this.state.unreadReportCount)}
|
||||
</span>
|
||||
)}
|
||||
</NavLink>
|
||||
</li>
|
||||
</ul>
|
||||
)}
|
||||
{amAdmin() && (
|
||||
<ul className="navbar-nav ml-1">
|
||||
)}
|
||||
{amAdmin() && (
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
to="/registration_applications"
|
||||
className="p-1 navbar-toggler nav-link border-0"
|
||||
onMouseUp={linkEvent(this, this.handleHideExpandNavbar)}
|
||||
className="nav-link"
|
||||
title={i18n.t("unread_registration_applications", {
|
||||
count: Number(this.state.unreadApplicationCount),
|
||||
formattedCount: numToSI(
|
||||
this.state.unreadApplicationCount
|
||||
),
|
||||
})}
|
||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||
>
|
||||
<Icon icon="clipboard" />
|
||||
{this.state.unreadApplicationCount > 0 && (
|
||||
|
@ -201,241 +351,70 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
|
|||
)}
|
||||
</NavLink>
|
||||
</li>
|
||||
</ul>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
<button
|
||||
className="navbar-toggler border-0 p-1"
|
||||
type="button"
|
||||
aria-label="menu"
|
||||
onClick={linkEvent(this, this.handleToggleExpandNavbar)}
|
||||
data-tippy-content={i18n.t("expand_here")}
|
||||
>
|
||||
<Icon icon="menu" />
|
||||
</button>
|
||||
<div
|
||||
className={`${!this.state.expanded && "collapse"} navbar-collapse`}
|
||||
>
|
||||
<ul className="navbar-nav my-2 mr-auto">
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
to="/communities"
|
||||
className="nav-link"
|
||||
onMouseUp={linkEvent(this, this.handleHideExpandNavbar)}
|
||||
title={i18n.t("communities")}
|
||||
>
|
||||
{i18n.t("communities")}
|
||||
</NavLink>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
{/* TODO make sure this works: https://github.com/infernojs/inferno/issues/1608 */}
|
||||
<NavLink
|
||||
to={{
|
||||
pathname: "/create_post",
|
||||
search: "",
|
||||
hash: "",
|
||||
key: "",
|
||||
state: { prevPath: this.currentLocation },
|
||||
}}
|
||||
className="nav-link"
|
||||
onMouseUp={linkEvent(this, this.handleHideExpandNavbar)}
|
||||
title={i18n.t("create_post")}
|
||||
>
|
||||
{i18n.t("create_post")}
|
||||
</NavLink>
|
||||
</li>
|
||||
{canCreateCommunity(this.props.siteRes) && (
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
to="/create_community"
|
||||
className="nav-link"
|
||||
onMouseUp={linkEvent(this, this.handleHideExpandNavbar)}
|
||||
title={i18n.t("create_community")}
|
||||
>
|
||||
{i18n.t("create_community")}
|
||||
</NavLink>
|
||||
</li>
|
||||
)}
|
||||
<li className="nav-item">
|
||||
<a
|
||||
className="nav-link"
|
||||
title={i18n.t("support_lemmy")}
|
||||
href={donateLemmyUrl}
|
||||
>
|
||||
<Icon icon="heart" classes="small" />
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul className="navbar-nav my-2">
|
||||
{amAdmin() && (
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
to="/admin"
|
||||
className="nav-link"
|
||||
onMouseUp={linkEvent(this, this.handleHideExpandNavbar)}
|
||||
title={i18n.t("admin_settings")}
|
||||
>
|
||||
<Icon icon="settings" />
|
||||
</NavLink>
|
||||
</li>
|
||||
)}
|
||||
</ul>
|
||||
{!this.context.router.history.location.pathname.match(
|
||||
/^\/search/
|
||||
) && (
|
||||
<ul className="navbar-nav">
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
to="/search"
|
||||
className="nav-link"
|
||||
title={i18n.t("search")}
|
||||
>
|
||||
<Icon icon="search" />
|
||||
</NavLink>
|
||||
</li>
|
||||
</ul>
|
||||
)}
|
||||
{UserService.Instance.myUserInfo ? (
|
||||
<>
|
||||
<ul className="navbar-nav my-2">
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
className="nav-link"
|
||||
to="/inbox"
|
||||
onMouseUp={linkEvent(this, this.handleHideExpandNavbar)}
|
||||
title={i18n.t("unread_messages", {
|
||||
count: Number(this.state.unreadInboxCount),
|
||||
formattedCount: numToSI(this.state.unreadInboxCount),
|
||||
})}
|
||||
>
|
||||
<Icon icon="bell" />
|
||||
{this.state.unreadInboxCount > 0 && (
|
||||
<span className="ml-1 badge badge-light">
|
||||
{numToSI(this.state.unreadInboxCount)}
|
||||
</span>
|
||||
)}
|
||||
</NavLink>
|
||||
</li>
|
||||
</ul>
|
||||
{this.moderatesSomething && (
|
||||
<ul className="navbar-nav my-2">
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
className="nav-link"
|
||||
to="/reports"
|
||||
onMouseUp={linkEvent(this, this.handleHideExpandNavbar)}
|
||||
title={i18n.t("unread_reports", {
|
||||
count: Number(this.state.unreadReportCount),
|
||||
formattedCount: numToSI(this.state.unreadReportCount),
|
||||
})}
|
||||
>
|
||||
<Icon icon="shield" />
|
||||
{this.state.unreadReportCount > 0 && (
|
||||
<span className="ml-1 badge badge-light">
|
||||
{numToSI(this.state.unreadReportCount)}
|
||||
</span>
|
||||
)}
|
||||
</NavLink>
|
||||
</li>
|
||||
</ul>
|
||||
)}
|
||||
{amAdmin() && (
|
||||
<ul className="navbar-nav my-2">
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
to="/registration_applications"
|
||||
className="nav-link"
|
||||
onMouseUp={linkEvent(this, this.handleHideExpandNavbar)}
|
||||
title={i18n.t("unread_registration_applications", {
|
||||
count: Number(this.state.unreadApplicationCount),
|
||||
formattedCount: numToSI(
|
||||
this.state.unreadApplicationCount
|
||||
),
|
||||
})}
|
||||
>
|
||||
<Icon icon="clipboard" />
|
||||
{this.state.unreadApplicationCount > 0 && (
|
||||
<span className="mx-1 badge badge-light">
|
||||
{numToSI(this.state.unreadApplicationCount)}
|
||||
</span>
|
||||
)}
|
||||
</NavLink>
|
||||
</li>
|
||||
</ul>
|
||||
)}
|
||||
{person && (
|
||||
<ul className="navbar-nav">
|
||||
<li className="nav-item dropdown">
|
||||
<button
|
||||
className="nav-link btn btn-link dropdown-toggle"
|
||||
onClick={linkEvent(this, this.handleToggleDropdown)}
|
||||
id="navbarDropdown"
|
||||
role="button"
|
||||
aria-expanded="false"
|
||||
>
|
||||
<span>
|
||||
{showAvatars() && person.avatar && (
|
||||
<PictrsImage src={person.avatar} icon />
|
||||
)}
|
||||
{person.display_name ?? person.name}
|
||||
</span>
|
||||
</button>
|
||||
{this.state.showDropdown && (
|
||||
<div
|
||||
className="dropdown-content"
|
||||
onMouseLeave={linkEvent(
|
||||
this,
|
||||
this.handleToggleDropdown
|
||||
)}
|
||||
>
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
to={`/u/${person.name}`}
|
||||
className="nav-link"
|
||||
title={i18n.t("profile")}
|
||||
>
|
||||
<Icon icon="user" classes="mr-1" />
|
||||
{i18n.t("profile")}
|
||||
</NavLink>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
to="/settings"
|
||||
className="nav-link"
|
||||
title={i18n.t("settings")}
|
||||
>
|
||||
<Icon icon="settings" classes="mr-1" />
|
||||
{i18n.t("settings")}
|
||||
</NavLink>
|
||||
</li>
|
||||
<li>
|
||||
<hr className="dropdown-divider" />
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
<button
|
||||
className="nav-link btn btn-link"
|
||||
onClick={linkEvent(this, this.handleLogoutClick)}
|
||||
title="test"
|
||||
>
|
||||
<Icon icon="log-out" classes="mr-1" />
|
||||
{i18n.t("logout")}
|
||||
</button>
|
||||
</li>
|
||||
</div>
|
||||
<div className="dropdown">
|
||||
<button
|
||||
className="btn dropdown-toggle"
|
||||
role="button"
|
||||
aria-expanded="false"
|
||||
data-bs-toggle="dropdown"
|
||||
>
|
||||
{showAvatars() && person.avatar && (
|
||||
<PictrsImage src={person.avatar} icon />
|
||||
)}
|
||||
</li>
|
||||
</ul>
|
||||
{person.display_name ?? person.name}
|
||||
</button>
|
||||
<ul
|
||||
className="dropdown-menu"
|
||||
style={{ "min-width": "fit-content" }}
|
||||
>
|
||||
<li>
|
||||
<NavLink
|
||||
to={`/u/${person.name}`}
|
||||
className="dropdown-item px-2"
|
||||
title={i18n.t("profile")}
|
||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||
>
|
||||
<Icon icon="user" classes="mr-1" />
|
||||
{i18n.t("profile")}
|
||||
</NavLink>
|
||||
</li>
|
||||
<li>
|
||||
<NavLink
|
||||
to="/settings"
|
||||
className="dropdown-item px-2"
|
||||
title={i18n.t("settings")}
|
||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||
>
|
||||
<Icon icon="settings" classes="mr-1" />
|
||||
{i18n.t("settings")}
|
||||
</NavLink>
|
||||
</li>
|
||||
<li>
|
||||
<hr className="dropdown-divider" />
|
||||
</li>
|
||||
<li>
|
||||
<button
|
||||
className="dropdown-item btn btn-link px-2"
|
||||
onClick={handleLogOut}
|
||||
>
|
||||
<Icon icon="log-out" classes="mr-1" />
|
||||
{i18n.t("logout")}
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
) : (
|
||||
<ul className="navbar-nav my-2">
|
||||
<>
|
||||
<li className="nav-item">
|
||||
<NavLink
|
||||
to="/login"
|
||||
className="nav-link"
|
||||
onMouseUp={linkEvent(this, this.handleHideExpandNavbar)}
|
||||
title={i18n.t("login")}
|
||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||
>
|
||||
{i18n.t("login")}
|
||||
</NavLink>
|
||||
|
@ -444,15 +423,15 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
|
|||
<NavLink
|
||||
to="/signup"
|
||||
className="nav-link"
|
||||
onMouseUp={linkEvent(this, this.handleHideExpandNavbar)}
|
||||
title={i18n.t("sign_up")}
|
||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||
>
|
||||
{i18n.t("sign_up")}
|
||||
</NavLink>
|
||||
</li>
|
||||
</ul>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
);
|
||||
|
@ -464,23 +443,6 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
|
|||
return amAdmin() || moderatesS;
|
||||
}
|
||||
|
||||
handleToggleExpandNavbar(i: Navbar) {
|
||||
i.setState({ expanded: !i.state.expanded });
|
||||
}
|
||||
|
||||
handleHideExpandNavbar(i: Navbar) {
|
||||
i.setState({ expanded: false, showDropdown: false });
|
||||
}
|
||||
|
||||
handleLogoutClick(i: Navbar) {
|
||||
i.setState({ showDropdown: false, expanded: false });
|
||||
UserService.Instance.logout();
|
||||
}
|
||||
|
||||
handleToggleDropdown(i: Navbar) {
|
||||
i.setState({ showDropdown: !i.state.showDropdown });
|
||||
}
|
||||
|
||||
parseMessage(msg: any) {
|
||||
let op = wsUserOp(msg);
|
||||
console.log(msg);
|
||||
|
|
|
@ -42,6 +42,7 @@ import {
|
|||
colorList,
|
||||
commentTreeMaxDepth,
|
||||
futureDaysToUnixTime,
|
||||
getCommentParentId,
|
||||
isAdmin,
|
||||
isBanned,
|
||||
isMod,
|
||||
|
@ -1051,11 +1052,14 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
|||
? i18n.t("show_context")
|
||||
: i18n.t("link");
|
||||
|
||||
// The context button should show the parent comment by default
|
||||
const parentCommentId = getCommentParentId(cv.comment) ?? cv.comment.id;
|
||||
|
||||
return (
|
||||
<>
|
||||
<Link
|
||||
className={classnames}
|
||||
to={`/comment/${cv.comment.id}`}
|
||||
to={`/comment/${parentCommentId}`}
|
||||
title={title}
|
||||
>
|
||||
<Icon icon="link" classes="icon-inline" />
|
||||
|
|
|
@ -1,29 +1,28 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"pretty": true,
|
||||
"target": "esnext",
|
||||
"module": "esnext",
|
||||
"allowSyntheticDefaultImports": true,
|
||||
"preserveConstEnums": true,
|
||||
"sourceMap": true,
|
||||
"moduleResolution": "node",
|
||||
"lib": ["es2017", "dom"],
|
||||
"types": [
|
||||
"inferno"
|
||||
],
|
||||
"jsx": "preserve",
|
||||
"noUnusedLocals": true,
|
||||
"baseUrl": "./src",
|
||||
"noEmit": true,
|
||||
"skipLibCheck": true,
|
||||
"noUnusedParameters": true,
|
||||
"noImplicitReturns": true,
|
||||
"experimentalDecorators": true,
|
||||
"strictNullChecks": true,
|
||||
"noFallthroughCasesInSwitch": true
|
||||
},
|
||||
"include": [
|
||||
"src/**/*",
|
||||
"node_modules/inferno/dist/index.d.ts"
|
||||
]
|
||||
}
|
||||
{
|
||||
"compilerOptions": {
|
||||
"pretty": true,
|
||||
"target": "esnext",
|
||||
"module": "esnext",
|
||||
"allowSyntheticDefaultImports": true,
|
||||
"preserveConstEnums": true,
|
||||
"sourceMap": true,
|
||||
"moduleResolution": "node",
|
||||
"lib": ["es2017", "dom"],
|
||||
"types": ["inferno"],
|
||||
"jsx": "preserve",
|
||||
"noUnusedLocals": true,
|
||||
"baseUrl": "./src",
|
||||
"noEmit": true,
|
||||
"skipLibCheck": true,
|
||||
"noUnusedParameters": true,
|
||||
"noImplicitReturns": true,
|
||||
"experimentalDecorators": true,
|
||||
"strictNullChecks": true,
|
||||
"noFallthroughCasesInSwitch": true
|
||||
},
|
||||
"include": [
|
||||
"src/**/*.ts",
|
||||
"src/**/*.tsx",
|
||||
"node_modules/inferno/dist/index.d.ts"
|
||||
]
|
||||
}
|
||||
|
|
|
@ -1155,7 +1155,7 @@
|
|||
picocolors "^1.0.0"
|
||||
tslib "^2.5.0"
|
||||
|
||||
"@popperjs/core@^2.9.0":
|
||||
"@popperjs/core@^2.9.0", "@popperjs/core@^2.9.2":
|
||||
version "2.11.7"
|
||||
resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.11.7.tgz#ccab5c8f7dc557a52ca3288c10075c9ccd37fff7"
|
||||
integrity sha512-Cr4OjIkipTtcXKjAsm8agyleBuDHvxzeBoa1v543lbv1YaIwQjESsVcmjiWiPEbC1FIeHOG/Op9kdCmAmiS3Kw==
|
||||
|
@ -1235,6 +1235,13 @@
|
|||
dependencies:
|
||||
"@types/node" "*"
|
||||
|
||||
"@types/bootstrap@^5.2.6":
|
||||
version "5.2.6"
|
||||
resolved "https://registry.yarnpkg.com/@types/bootstrap/-/bootstrap-5.2.6.tgz#e861b3aa1f4a1434da0bf50fbaa372b6f7e64d2f"
|
||||
integrity sha512-BlAc3YATdasbHoxMoBWODrSF6qwQO/E9X8wVxCCSa6rWjnaZfpkr2N6pUMCY6jj2+wf0muUtLySbvU9etX6YqA==
|
||||
dependencies:
|
||||
"@popperjs/core" "^2.9.2"
|
||||
|
||||
"@types/connect-history-api-fallback@^1.3.5":
|
||||
version "1.5.0"
|
||||
resolved "https://registry.yarnpkg.com/@types/connect-history-api-fallback/-/connect-history-api-fallback-1.5.0.tgz#9fd20b3974bdc2bcd4ac6567e2e0f6885cb2cf41"
|
||||
|
|
Loading…
Reference in a new issue