diff --git a/ui/src/components/iframely-card.tsx b/ui/src/components/iframely-card.tsx
index b0a0d34b3..4bae06d1c 100644
--- a/ui/src/components/iframely-card.tsx
+++ b/ui/src/components/iframely-card.tsx
@@ -52,7 +52,7 @@ export class IFramelyCard extends Component<
{iframely.html && (
{this.state.expanded ? '[-]' : '[+]'}
@@ -72,7 +72,7 @@ export class IFramelyCard extends Component<
)}
{this.state.expanded && (
)}
diff --git a/ui/src/components/post-listing.tsx b/ui/src/components/post-listing.tsx
index 5cc632517..7b3d64798 100644
--- a/ui/src/components/post-listing.tsx
+++ b/ui/src/components/post-listing.tsx
@@ -49,6 +49,7 @@ interface PostListingState {
score: number;
upvotes: number;
downvotes: number;
+ url: string;
iframely: FramelyData;
}
@@ -77,6 +78,7 @@ export class PostListing extends Component {
score: this.props.post.score,
upvotes: this.props.post.upvotes,
downvotes: this.props.post.downvotes,
+ url: this.props.post.url,
iframely: null,
};
@@ -89,7 +91,7 @@ export class PostListing extends Component {
this.handleEditPost = this.handleEditPost.bind(this);
this.handleEditCancel = this.handleEditCancel.bind(this);
- if (this.props.post.url) {
+ if (this.state.url) {
this.fetchIframely();
}
}
@@ -99,6 +101,13 @@ export class PostListing extends Component {
this.state.upvotes = nextProps.post.upvotes;
this.state.downvotes = nextProps.post.downvotes;
this.state.score = nextProps.post.score;
+ this.state.url = nextProps.post.url;
+ this.state.iframely = null;
+
+ if (nextProps.post.url) {
+ this.fetchIframely();
+ }
+
this.setState(this.state);
}
@@ -163,7 +172,7 @@ export class PostListing extends Component {
/>
)}
- {post.url && isVideo(post.url) && (
+ {this.state.url && isVideo(this.state.url) && (
)}
- {this.props.showBody && post.url ? (
+ {this.props.showBody && this.state.url ? (
{post.name}
@@ -198,15 +207,15 @@ export class PostListing extends Component {
)}
- {post.url && (
+ {this.state.url && (
- {new URL(post.url).hostname}
+ {new URL(this.state.url).hostname}
@@ -598,7 +607,7 @@ export class PostListing extends Component {
)}
- {post.url && this.props.showBody && this.state.iframely && (
+ {this.state.url && this.props.showBody && this.state.iframely && (
)}
{this.state.showRemoveDialog && (
@@ -752,7 +761,7 @@ export class PostListing extends Component {
}
fetchIframely() {
- fetch(`/iframely/oembed?url=${this.props.post.url}`)
+ fetch(`/iframely/oembed?url=${this.state.url}`)
.then(res => res.json())
.then(res => {
this.state.iframely = res;
@@ -765,15 +774,15 @@ export class PostListing extends Component {
hasImage(): boolean {
return (
- (this.props.post.url && isImage(this.props.post.url)) ||
+ (this.state.url && isImage(this.state.url)) ||
(this.state.iframely && this.state.iframely.thumbnail_url !== undefined)
);
}
getImage(): string {
- let simpleImg = isImage(this.props.post.url);
+ let simpleImg = isImage(this.state.url);
if (simpleImg) {
- return this.props.post.url;
+ return this.state.url;
} else if (this.state.iframely) {
let iframelyThumbnail = this.state.iframely.thumbnail_url;
if (iframelyThumbnail) {
@@ -877,8 +886,8 @@ export class PostListing extends Component {
get crossPostParams(): string {
let params = `?title=${this.props.post.name}`;
- if (this.props.post.url) {
- params += `&url=${this.props.post.url}`;
+ if (this.state.url) {
+ params += `&url=${this.state.url}`;
}
if (this.props.post.body) {
params += `&body=${this.props.post.body}`;