Feliday/Feliday-UI
5
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Merge branch 'main' into fix/thumb-action-button-alignment

Browse source
This commit is contained in:
Jay Sitter 2023-06-27 11:42:31 -04:00 committed by GitHub
commit 1e4e468e5a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 90 additions and 90 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
package.json
View file

@ -1,6 +1,6 @@
{
"name": "lemmy-ui",
"version": "0.18.0",
"version": "0.18.1-rc.1",
"description": "An isomorphic UI for lemmy",
"repository": "https://github.com/LemmyNet/lemmy-ui",
"license": "AGPL-3.0",

16
src/shared/components/home/site-form.tsx
View file

@ -4,6 +4,7 @@ import {
Component,
InfernoKeyboardEvent,
InfernoMouseEvent,
InfernoNode,
linkEvent,
} from "inferno";
import {
@ -13,6 +14,7 @@ import {
Instance,
ListingType,
} from "lemmy-js-client";
import deepEqual from "lodash.isequal";
import { I18NextService } from "../../services";
import { Icon, Spinner } from "../common/icon";
import { ImageUploadForm } from "../common/image-upload-form";
@ -55,6 +57,7 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {
initSiteForm(): EditSite {
const site = this.props.siteRes.site_view.site;
const ls = this.props.siteRes.site_view.local_site;
return {
name: site.name,
sidebar: site.sidebar,
@ -619,6 +622,19 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {
);
}
componentDidUpdate(
prevProps: Readonly<{ children?: InfernoNode } & SiteFormProps>
) {
if (
!(
deepEqual(prevProps.allowedInstances, this.props.allowedInstances) ||
deepEqual(prevProps.blockedInstances, this.props.blockedInstances)
)
) {
this.setState({ siteForm: this.initSiteForm() });
}
}
federatedInstanceSelect(key: InstanceKey) {
const id = `create_site_${key}`;
const value = this.state.instance_select[key];

2
src/shared/components/person/profile.tsx
View file

@ -692,6 +692,8 @@ export class Profile extends Component<
>
{I18NextService.i18n.t("cancel")}
</button>
</div>
<div className="mb-3 row">
<button
type="submit"
className="btn btn-secondary"

86
src/shared/components/post/metadata-card.tsx
View file

@ -8,60 +8,54 @@ interface MetadataCardProps {
post: Post;
}
interface MetadataCardState {
expanded: boolean;
}
export class MetadataCard extends Component<
MetadataCardProps,
MetadataCardState
> {
export class MetadataCard extends Component<MetadataCardProps> {
constructor(props: any, context: any) {
super(props, context);
}
render() {
const post = this.props.post;
return (
<>
{post.embed_title && post.url && (
<div className="post-metadata-card card border-secondary mt-3 mb-2">
<div className="row">
<div className="col-12">
<div className="card-body">
{post.name !== post.embed_title && (
<>
<h5 className="card-title d-inline">
<a className="text-body" href={post.url} rel={relTags}>
{post.embed_title}
</a>
</h5>
<span className="d-inline-block ms-2 mb-2 small text-muted">
<a
className="text-muted fst-italic"
href={post.url}
rel={relTags}
>
{new URL(post.url).hostname}
<Icon icon="external-link" classes="ms-1" />
</a>
</span>
</>
)}
{post.embed_description && (
<div
className="card-text small text-muted md-div"
dangerouslySetInnerHTML={{
__html: sanitizeHtml(post.embed_description),
}}
/>
)}
</div>
if (post.embed_title && post.url) {
return (
<div className="post-metadata-card card border-secondary mt-3 mb-2">
<div className="row">
<div className="col-12">
<div className="card-body">
{post.name !== post.embed_title && (
<>
<h5 className="card-title d-inline">
<a className="text-body" href={post.url} rel={relTags}>
{post.embed_title}
</a>
</h5>
<span className="d-inline-block ms-2 mb-2 small text-muted">
<a
className="text-muted fst-italic"
href={post.url}
rel={relTags}
>
{new URL(post.url).hostname}
<Icon icon="external-link" classes="ms-1" />
</a>
</span>
</>
)}
{post.embed_description && (
<div
className="card-text small text-muted md-div"
dangerouslySetInnerHTML={{
__html: sanitizeHtml(post.embed_description),
}}
/>
)}
</div>
</div>
</div>
)}
</>
);
</div>
);
} else {
return <></>;
}
}
}

67
src/shared/components/post/post-listing.tsx
View file

@ -49,7 +49,7 @@ import {
PurgeType,
VoteContentType,
} from "../../interfaces";
import { mdNoImages, mdToHtml, mdToHtmlInline } from "../../markdown";
import { mdToHtml, mdToHtmlInline } from "../../markdown";
import { I18NextService, UserService } from "../../services";
import { setupTippy } from "../../tippy";
import { Icon, PurgeWarning, Spinner } from "../common/icon";
@ -105,6 +105,9 @@ interface PostListingProps {
allLanguages: Language[];
siteLanguages: number[];
showCommunity?: boolean;
/**
* Controls whether to show both the body *and* the metadata preview card
*/
showBody?: boolean;
hideImage?: boolean;
enableDownvotes?: boolean;
@ -200,7 +203,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
<>
{this.listing()}
{this.state.imageExpanded && !this.props.hideImage && this.img}
{post.url && this.state.showBody && post.embed_title && (
{this.showBody && post.url && post.embed_title && (
<MetadataCard post={post} />
)}
{this.showBody && this.body()}
@ -488,6 +491,15 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
)}
</h5>
{/**
* If there is a URL, an embed title, and we were not told to show the
* body by the parent component, show the MetadataCard/body toggle.
*/}
{!this.props.showBody &&
post.url &&
post.embed_title &&
this.showPreviewButton()}
{post.removed && (
<small className="ms-2 badge text-bg-secondary">
{I18NextService.i18n.t("removed")}
@ -630,27 +642,6 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
);
}
showPreviewButton() {
const post_view = this.postView;
const body = post_view.post.body;
return (
<button
className="btn btn-sm btn-animate text-muted py-0"
data-tippy-content={body && mdNoImages.render(body)}
data-tippy-allowHtml={true}
onClick={linkEvent(this, this.handleShowBody)}
>
<Icon
icon="book-open"
classes={classNames("icon-inline me-1", {
"text-success": this.state.showBody,
})}
/>
</button>
);
}
postActions() {
// Possible enhancement: Priority+ pattern instead of just hard coding which get hidden behind the show more button.
// Possible enhancement: Make each button a component.
@ -662,14 +653,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
{this.saveButton}
{this.crossPostButton}
{/**
* If there is a URL, or if the post has a body and we were told not to
* show the body, show the MetadataCard/body toggle.
*/}
{(post.url || (post.body && !this.props.showBody)) &&
this.showPreviewButton()}
{this.showBody && post_view.post.body && this.viewSourceButton}
{this.props.showBody && post_view.post.body && this.viewSourceButton}
<div className="dropdown">
<button
@ -1393,15 +1377,18 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
);
}
showBodyPreview() {
const { body, id } = this.postView.post;
return !this.showBody && body ? (
<Link className="text-body mt-2 d-block" to={`/post/${id}`}>
<div className="md-div mb-1 preview-lines">{body}</div>
</Link>
) : (
<></>
showPreviewButton() {
return (
<button
type="button"
className="btn btn-sm btn-link link-dark link-opacity-75 link-opacity-100-hover py-0 align-baseline"
onClick={linkEvent(this, this.handleShowBody)}
>
<Icon
icon={!this.state.showBody ? "plus-square" : "minus-square"}
classes="icon-inline"
/>
</button>
);
}

2
src/shared/config.ts
View file

@ -21,7 +21,7 @@ export const markdownFieldCharacterLimit = 50000;
export const maxUploadImages = 20;
export const concurrentImageUpload = 4;
export const updateUnreadCountsInterval = 30000;
export const fetchLimit = 40;
export const fetchLimit = 20;
export const relTags = "noopener nofollow";
export const emDash = "\u2014";

5
webpack.config.js
View file

@ -6,8 +6,7 @@ const CopyPlugin = require("copy-webpack-plugin");
const RunNodeWebpackPlugin = require("run-node-webpack-plugin");
const merge = require("lodash.merge");
const { ServiceWorkerPlugin } = require("service-worker-webpack");
const BundleAnalyzerPlugin =
require("webpack-bundle-analyzer").BundleAnalyzerPlugin;
const banner = `
hash:[contentHash], chunkhash:[chunkhash], name:[name], filebase:[base], query:[query], file:[file]
Source code: https://github.com/LemmyNet/lemmy-ui
@ -156,6 +155,8 @@ const createClientConfig = (_env, mode) => {
});
if (mode === "none") {
const BundleAnalyzerPlugin =
require("webpack-bundle-analyzer").BundleAnalyzerPlugin;
config.plugins.push(new BundleAnalyzerPlugin());
}