Skip to content

feat: comments #882

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

Open
usman-khalid wants to merge 2 commits into
base: main
Choose a base branch
from
Open

feat: comments #882

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
3ec1613
feat: comments
usman-khalid Apr 19, 2026
2440026
Merge branch 'main' into comments
usman-khalid Apr 28, 2026
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
41 changes: 0 additions & 41 deletions blocks/browse/da-list/da-list.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -254,47 +254,6 @@ da-list-item.is-expanded::after {
display: none;
}

.da-list-status {
position: fixed;
inset: 0;
background: rgb(255 255 255 / 60%);
display: flex;
justify-content: center;
align-items: center;
z-index: 500;
}

.da-list-status-toast {
width: 280px;
background: var(--s2-blue-800);
line-height: 48px;
border-radius: 6px;
filter: drop-shadow(rgb(0 0 0 / 15%) 0 1px 4px);
justify-content: space-between;
align-items: center;
box-sizing: border-box;
color: #fff;
font-size: 14px;
overflow: hidden;
}

.da-list-status-title {
font-weight: 700;
padding: 0 12px 0 40px;
margin: 0;
}

.da-list-status-description {
line-height: 1.6;
padding: 6px 12px;
margin: 0;
background: rgb(255 255 255 / 10%);
}

.da-list-status-type-info .da-list-status-title {
background: var(--s2-blue-800) url("/blocks/browse/img/Smock_InfoOutline_18_N.svg") 12px 50% no-repeat;
}

/* Checkbox */

.checkbox-wrapper {
Expand Down
24 changes: 9 additions & 15 deletions blocks/browse/da-list/da-list.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ export default class DaList extends LitElement {
_dropFiles: { state: true },
_dropMessage: { state: true },
_dropConflicts: { state: true },
_status: { state: true },
_toast: { state: true },
_confirm: { state: true },
_confirmText: { state: true },
_unpublish: { state: true },
Expand Down Expand Up @@ -90,16 +90,17 @@ export default class DaList extends LitElement {

async firstUpdated() {
await import('../../shared/da-dialog/da-dialog.js');
await import('../../shared/da-toast/da-toast.js');
await import('../da-actionbar/da-actionbar.js');
this.setupObserver();
}

setStatus(text, description, type = 'info') {
if (!text) {
this._status = null;
this._toast = null;
return;
}
this._status = { type, text, description };
this._toast = { type, text, description, duration: 0 };
}

handlePermissions(permissions) {
Expand Down Expand Up @@ -363,7 +364,7 @@ export default class DaList extends LitElement {
return pasteItem;
});

const showStatus = setTimeout(() => {
const pasteStatusTimer = setTimeout(() => {
this.setStatus('Pasting', 'Please be patient. Pasting items with many children can take time.');
}, 2000);

Expand All @@ -373,7 +374,7 @@ export default class DaList extends LitElement {
await this.handleItemAction({ item, type });
}));

clearTimeout(showStatus);
clearTimeout(pasteStatusTimer);

this.setStatus();
this.handleClear();
Expand Down Expand Up @@ -427,8 +428,7 @@ export default class DaList extends LitElement {
}

handleShare() {
this.setStatus('Copied', 'URLs have been copied to the clipboard.');
setTimeout(() => { this.setStatus(); }, 3000);
this._toast = { text: 'Copied', description: 'URLs have been copied to the clipboard.' };
}

dragenter(e) {
Expand Down Expand Up @@ -676,13 +676,7 @@ export default class DaList extends LitElement {
}

renderStatus() {
return html`
<div class="da-list-status">
<div class="da-list-status-toast da-list-status-type-${this._status.type}">
<p class="da-list-status-title">${this._status.text}</p>
${this._status.description ? html`<p class="da-list-status-description">${this._status.description}</p>` : nothing}
</div>
</div>`;
return html`<da-toast .toast=${this._toast} @close=${() => { this._toast = null; }}></da-toast>`;
}

renderConfirm() {
Expand Down Expand Up @@ -870,7 +864,7 @@ export default class DaList extends LitElement {
currentPath="${this.fullpath}"
role="row"
data-visible="${this._selectedItems?.length > 0}"></da-actionbar>
${this._status ? this.renderStatus() : nothing}
${this._toast ? this.renderStatus() : nothing}
${this._confirm ? this.renderConfirm() : nothing}
${this._dropConflicts?.length ? this.renderDropConfirm() : nothing}
${!this._confirm && this._itemErrors.length ? this.renderErrors() : nothing}
Expand Down
42 changes: 0 additions & 42 deletions blocks/browse/da-sites/da-sites.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -411,45 +411,3 @@ form button:hover {
text-align: center;
}

/* Handle Share */

.da-list-status {
position: fixed;
inset: 0;
background: rgb(255 255 255 / 60%);
display: flex;
justify-content: center;
align-items: center;
z-index: 500;
}

.da-list-status-toast {
width: 280px;
background: var(--s2-blue-800);
line-height: 48px;
border-radius: 6px;
filter: drop-shadow(rgb(0 0 0 / 15%) 0 1px 4px);
justify-content: space-between;
align-items: center;
box-sizing: border-box;
color: #FFF;
font-size: 14px;
overflow: hidden;
}

.da-list-status-title {
font-weight: 700;
padding: 0 12px 0 40px;
margin: 0;
}

.da-list-status-description {
line-height: 1.6;
padding: 6px 12px;
margin: 0;
background: rgb(255 255 255 / 10%);
}

.da-list-status-type-info .da-list-status-title {
background: var(--s2-blue-800) url('/blocks/browse/img/Smock_InfoOutline_18_N.svg') 12px 50% no-repeat;
}
22 changes: 4 additions & 18 deletions blocks/browse/da-sites/da-sites.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ function getRandom() {
export default class DaSites extends LitElement {
static properties = {
_recents: { state: true },
_status: { state: true },
_toast: { state: true },
_urlError: { state: true },
};

Expand All @@ -26,6 +26,7 @@ export default class DaSites extends LitElement {
super.connectedCallback();
this.shadowRoot.adoptedStyleSheets = [sheet];
this.getRecents();
import('../../shared/da-toast/da-toast.js');
}

mapRecentSites(recentSites) {
Expand Down Expand Up @@ -60,10 +61,6 @@ export default class DaSites extends LitElement {
}
}

setStatus(text, description, type = 'info') {
this._status = text ? { type, text, description } : null;
}

handleRemove(site) {
// Get the index of the site to remove
const idx = this._recents.findIndex((recent) => recent.name === site.name);
Expand Down Expand Up @@ -119,18 +116,7 @@ export default class DaSites extends LitElement {
const data = [new ClipboardItem({ [blob.type]: blob })];
navigator.clipboard.write(data);

this.setStatus('Copied', 'The link was copied to the clipboard.');
setTimeout(() => { this.setStatus(); }, 3000);
}

renderStatus() {
return html`
<div class="da-list-status">
<div class="da-list-status-toast da-list-status-type-${this._status.type}">
<p class="da-list-status-title">${this._status.text}</p>
${this._status.description ? html`<p class="da-list-status-description">${this._status.description}</p>` : nothing}
</div>
</div>`;
this._toast = { text: 'Copied', description: 'The link was copied to the clipboard.' };
}

renderGo() {
Expand Down Expand Up @@ -250,7 +236,7 @@ export default class DaSites extends LitElement {
</a>
</div>
</div>
${this._status ? this.renderStatus() : nothing}
<da-toast .toast=${this._toast} @close=${() => { this._toast = null; }}></da-toast>
`;
}
}
Expand Down
Loading
Loading