mirror of
https://github.com/gristlabs/grist-core.git
synced 2024-10-27 20:44:07 +00:00
da6c39aa50
Summary: New cards on the home page link to useful resources like the welcome video, tutorial, webinars, and the Help Center. They are shown by default to new and exisiting users, and may be hidden via a toggle. Test Plan: Browser tests. Reviewers: jarek Reviewed By: jarek Differential Revision: https://phab.getgrist.com/D4340
50 lines
1.6 KiB
TypeScript
50 lines
1.6 KiB
TypeScript
import {HomeModel} from 'app/client/models/HomeModel';
|
|
|
|
export function attachAddNewTip(home: HomeModel): (el: Element) => void {
|
|
return () => {
|
|
if (shouldShowAddNewTip(home)) {
|
|
showAddNewTip(home);
|
|
}
|
|
};
|
|
}
|
|
|
|
function shouldShowAddNewTip(home: HomeModel): boolean {
|
|
return (
|
|
// Only show if the user is an owner or editor.
|
|
home.app.isOwnerOrEditor() &&
|
|
// And the tip hasn't been shown before.
|
|
home.shouldShowAddNewTip.get() &&
|
|
// And the site isn't empty.
|
|
!home.empty.get() &&
|
|
// And home page cards aren't being shown.
|
|
!(home.currentPage.get() === 'all' && !home.onlyShowDocuments.get()) &&
|
|
// And the workspace loaded correctly.
|
|
home.available.get() &&
|
|
// And the current page isn't /p/trash; the Add New button is limited there.
|
|
home.currentPage.get() !== 'trash'
|
|
);
|
|
}
|
|
|
|
function showAddNewTip(home: HomeModel): void {
|
|
const addNewButton = document.querySelector('.behavioral-prompt-add-new');
|
|
if (!addNewButton) {
|
|
console.warn('AddNewTip failed to find Add New button');
|
|
return;
|
|
}
|
|
if (!isVisible(addNewButton as HTMLElement)) {
|
|
return;
|
|
}
|
|
|
|
home.app.behavioralPromptsManager.showPopup(addNewButton, 'addNew', {
|
|
popupOptions: {
|
|
placement: 'right-start',
|
|
},
|
|
onDispose: () => home.shouldShowAddNewTip.set(false),
|
|
});
|
|
}
|
|
|
|
function isVisible(element: HTMLElement): boolean {
|
|
// From https://github.com/jquery/jquery/blob/c66d4700dcf98efccb04061d575e242d28741223/src/css/hiddenVisibleSelectors.js.
|
|
return Boolean(element.offsetWidth || element.offsetHeight || element.getClientRects().length);
|
|
}
|