diff --git a/ghost/admin/app/components/posts/analytics.hbs b/ghost/admin/app/components/posts/analytics.hbs
index f174ac904c..00b5f0f6a2 100644
--- a/ghost/admin/app/components/posts/analytics.hbs
+++ b/ghost/admin/app/components/posts/analytics.hbs
@@ -104,7 +104,7 @@
{{#if (is-empty this.links) }}
{{!-- Empty state --}}
{{else}}
-
+
{{/if}}
{{/if}}
diff --git a/ghost/admin/app/components/posts/analytics.js b/ghost/admin/app/components/posts/analytics.js
index e751179533..e784d9b15b 100644
--- a/ghost/admin/app/components/posts/analytics.js
+++ b/ghost/admin/app/components/posts/analytics.js
@@ -94,6 +94,23 @@ export default class Analytics extends Component {
this.sortColumn = column;
}
+ @action
+ updateLink(linkId, linkTo) {
+ this.links = this.links?.map((link) => {
+ if (link.link.link_id === linkId) {
+ return {
+ ...link,
+ link: {
+ ...link.link,
+ to: this.utils.cleanTrackedUrl(linkTo, false),
+ title: this.utils.cleanTrackedUrl(linkTo, true)
+ }
+ };
+ }
+ return link;
+ });
+ }
+
@action
loadData() {
if (this.showSources) {
diff --git a/ghost/admin/app/components/posts/links-table.hbs b/ghost/admin/app/components/posts/links-table.hbs
index 8095e6966c..8f861b70b2 100644
--- a/ghost/admin/app/components/posts/links-table.hbs
+++ b/ghost/admin/app/components/posts/links-table.hbs
@@ -13,7 +13,33 @@
{{#each this.visibleLinks as |link|}}
+ {{#if (feature "fixNewsletterLinks")}}
+
+ {{else}}
{{link.link.title}}
+ {{/if}}
{{link.count.clicks}}
{{/each}}
diff --git a/ghost/admin/app/components/posts/links-table.js b/ghost/admin/app/components/posts/links-table.js
index 544bf77de6..1452fa33d9 100644
--- a/ghost/admin/app/components/posts/links-table.js
+++ b/ghost/admin/app/components/posts/links-table.js
@@ -7,12 +7,51 @@ const PAGE_SIZE = 5;
export default class LinksTable extends Component {
@tracked page = 1;
+ @tracked editingLink = false;
+
+ @action
+ blurElement(event) {
+ if (!event.shiftKey) {
+ event.preventDefault();
+ event.target.blur();
+ }
+ }
+
+ @action
+ editLink(linkId) {
+ this.editingLink = linkId;
+ }
+
+ @action
+ cancelEdit(event) {
+ event.preventDefault();
+ this.editingLink = null;
+ // event.target.value = this.args.post[property];
+ // event.target.blur();
+ }
+
+ @action
+ setLink(event) {
+ event.preventDefault();
+ this.args.updateLink(this.editingLink, event.target.value);
+ this.editingLink = null;
+ // const title = event.target.value;
+ // this.args.post.title = title.trim();
+ // this.args.post.save();
+ // this.editingLink = false;
+ }
+
get links() {
return this.args.links;
}
get visibleLinks() {
- return this.links.slice(this.startOffset - 1, this.endOffset);
+ return this.links.slice(this.startOffset - 1, this.endOffset).map((link) => {
+ return {
+ ...link,
+ isEditing: this.editingLink === link.link.link_id
+ };
+ });
}
get startOffset() {
@@ -42,7 +81,7 @@ export default class LinksTable extends Component {
get disableNextPage() {
return this.page === this.totalPages;
}
-
+
@action
openPreviousPage() {
if (this.disablePreviousPage) {
diff --git a/ghost/admin/app/styles/layouts/content.css b/ghost/admin/app/styles/layouts/content.css
index c4e197e5cd..6db7c47c31 100644
--- a/ghost/admin/app/styles/layouts/content.css
+++ b/ghost/admin/app/styles/layouts/content.css
@@ -1000,7 +1000,7 @@ a.gh-post-list-signups.active:hover > span, a.gh-post-list-conversions.active:ho
.gh-links-list-item a {
margin: 0;
- padding: 0 32px 0 0;
+ padding: 0;
color: var(--darkgrey);
text-overflow: ellipsis;
white-space: nowrap;
@@ -1012,6 +1012,23 @@ a.gh-post-list-signups.active:hover > span, a.gh-post-list-conversions.active:ho
color: var(--midgrey-d2);
}
+.gh-links-list-item svg {
+ display: none;
+ width: 14px;
+ margin-left: 8px;
+ color: var(--midgrey);
+ cursor: pointer;
+ animation: fade-in 0.3s;
+}
+
+.gh-links-list-item:hover svg {
+ display: inline;
+}
+
+.gh-links-list-item .gh-input {
+ animation: fade-in .2s ease-in-out;
+}
+
.gh-links-list-clicks {
margin: 0;
color: var(--darkgrey);