adam/vscode-front-matter
1
0
Fork 0
mirror of https://github.com/estruyf/vscode-front-matter.git synced 2026-07-06 01:41:48 +02:00
Code Issues Packages Projects Releases Wiki Activity

#688 - Add scheduled articles

Browse Source
This commit is contained in:
Elio Struyf
2023-10-19 16:08:37 +02:00
parent 3e038c58a3
commit d1eb252380
9 changed files with 108 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/dashboardWebView/components/Contents/Item.tsx
+2 -2
View File
@@ -110,7 +110,7 @@ export const Item: React.FunctionComponent<IItemProps> = ({
statusHtml ? (
<div dangerouslySetInnerHTML={{ __html: statusHtml }} />
) : (
cardFields?.state && draftField && draftField.name && <Status draft={pageData[draftField.name]} />
cardFields?.state && draftField && draftField.name && <Status draft={pageData[draftField.name]} published={pageData.fmPublished} />
)
}
@@ -214,7 +214,7 @@ export const Item: React.FunctionComponent<IItemProps> = ({
<DateField value={pageData.date} />
</div>
<div className="col-span-2">
{draftField && draftField.name && <Status draft={pageData[draftField.name]} />}
{draftField && draftField.name && <Status draft={pageData[draftField.name]} published={pageData.fmPublished} />}
</div>
</div>
</li>
src/dashboardWebView/components/Contents/Overview.tsx
+61 -30
View File
@@ -66,6 +66,44 @@ export const Overview: React.FunctionComponent<IOverviewProps> = ({
[grouping]
);
const { groupKeys, groupedPages } = useMemo(() => {
if (grouping === GroupOption.none) {
return { groupKeys: [], groupedPages: {} };
}
let groupedPages = groupBy(pages, grouping === GroupOption.Year ? 'fmYear' : 'fmDraft');
let groupKeys = Object.keys(groupedPages);
if (grouping === GroupOption.Year) {
groupKeys = groupKeys.sort((a, b) => {
return parseInt(b) - parseInt(a);
});
} else if (grouping === GroupOption.Draft && settings?.draftField?.type !== 'choice') {
const isInverted = settings?.draftField?.invert;
const allPublished: Page[] = groupedPages['Published'] || [];
const allDrafts: Page[] = groupedPages['Draft'] || [];
if (allPublished.length > 0) {
const drafts = !isInverted ? allDrafts : allPublished;
const published = (!isInverted ? allPublished : allDrafts).filter((page) => !page.fmPublished || page.fmPublished <= Date.now());
const scheduled = (!isInverted ? allPublished : allDrafts).filter((page) => page.fmPublished && page.fmPublished > Date.now());
delete groupedPages["Published"];
delete groupedPages["Draft"];
groupKeys = ['Scheduled', ...groupKeys];
groupedPages = {
"Scheduled": scheduled,
"Published": published,
"Draft": drafts,
...groupedPages,
}
}
}
return { groupKeys, groupedPages };
}, [pages, grouping, settings?.draftField]);
React.useEffect(() => {
messageHandler.request<string[]>(DashboardMessage.getPinnedItems).then((items) => {
setIsReady(true);
@@ -99,40 +137,33 @@ export const Overview: React.FunctionComponent<IOverviewProps> = ({
}
if (grouping !== GroupOption.none) {
const groupedPages = groupBy(pages, grouping === GroupOption.Year ? 'fmYear' : 'fmDraft');
let groupKeys = Object.keys(groupedPages);
if (grouping === GroupOption.Year) {
groupKeys = groupKeys.sort((a, b) => {
return parseInt(b) - parseInt(a);
});
}
return (
<>
{groupKeys.map((groupId, idx) => (
<Disclosure key={groupId} as={`div`} className={`w-full`} defaultOpen>
{({ open }) => (
<>
<Disclosure.Button className={`mb-4 ${idx !== 0 ? 'mt-8' : ''}`}>
<h2 className={`text-2xl font-bold flex items-center`}>
<ChevronRightIcon
className={`w-8 h-8 mr-1 ${open ? 'transform rotate-90' : ''}`}
/>
{groupName(groupId, groupedPages)}
</h2>
</Disclosure.Button>
groupedPages[groupId].length > 0 && (
<Disclosure key={groupId} as={`div`} className={`w-full`} defaultOpen>
{({ open }) => (
<>
<Disclosure.Button className={`mb-4 ${idx !== 0 ? 'mt-8' : ''}`}>
<h2 className={`text-2xl font-bold flex items-center`}>
<ChevronRightIcon
className={`w-8 h-8 mr-1 ${open ? 'transform rotate-90' : ''}`}
/>
{groupName(groupId, groupedPages)}
</h2>
</Disclosure.Button>
<Disclosure.Panel>
<List>
{groupedPages[groupId].map((page: Page) => (
<Item key={`${page.slug}-${idx}`} {...page} />
))}
</List>
</Disclosure.Panel>
</>
)}
</Disclosure>
<Disclosure.Panel>
<List>
{groupedPages[groupId].map((page: Page) => (
<Item key={`${page.slug}-${idx}`} {...page} />
))}
</List>
</Disclosure.Panel>
</>
)}
</Disclosure>
)
))}
</>
);
src/dashboardWebView/components/Contents/Status.tsx
+12 -4
View File
@@ -7,15 +7,18 @@ import { LocalizationKey } from '../../../localization';
export interface IStatusProps {
draft: boolean | string;
published: number | null | undefined;
}
export const Status: React.FunctionComponent<IStatusProps> = ({
draft
draft,
published
}: React.PropsWithChildren<IStatusProps>) => {
const settings = useRecoilValue(SettingsAtom);
const tabInfo = useRecoilValue(TabInfoAtom);
const draftField = useMemo(() => settings?.draftField, [settings]);
const isFuture = useMemo(() => published ? published > Date.now() : false, [published]);
const draftValue = useMemo(() => {
if (draftField && draftField.type === 'choice') {
@@ -51,13 +54,18 @@ export const Status: React.FunctionComponent<IStatusProps> = ({
inline-block px-2 py-1 leading-none rounded-sm font-semibold uppercase tracking-wide text-xs
${draftValue ?
'bg-[var(--vscode-statusBarItem-errorBackground)] text-[var(--vscode-statusBarItem-errorForeground)]' :
'bg-[var(--vscode-badge-background)] text-[var(--vscode-badge-foreground)]'
isFuture ?
'bg-[var(--vscode-statusBarItem-warningBackground)] text-[var(--vscode-statusBarItem-warningForeground)]' :
'bg-[var(--vscode-badge-background)] text-[var(--vscode-badge-foreground)]'
}`}
>
{
draftValue ?
l10n.t(LocalizationKey.dashboardContentsStatusDraft) :
l10n.t(LocalizationKey.dashboardContentsStatusPublished)
l10n.t(LocalizationKey.dashboardContentsStatusDraft) : (
isFuture ?
l10n.t(LocalizationKey.dashboardContentsStatusScheduled) :
l10n.t(LocalizationKey.dashboardContentsStatusPublished)
)
}
</span>
);
src/dashboardWebView/components/Header/Navigation.tsx
+5
View File
@@ -51,6 +51,11 @@ export const Navigation: React.FunctionComponent<INavigationProps> = ({
if (settings?.draftField?.type === 'boolean' && tabInfo && Object.keys(tabInfo).length > 1) {
crntTabs.push({ name: l10n.t(LocalizationKey.dashboardHeaderNavigationPublished), id: Tab.Published });
if (tabInfo.scheduled) {
crntTabs.push({ name: l10n.t(LocalizationKey.dashboardHeaderNavigationScheduled), id: Tab.Scheduled });
}
crntTabs.push({ name: l10n.t(LocalizationKey.dashboardHeaderNavigationDraft), id: Tab.Draft });
}
src/dashboardWebView/constants/Tab.ts
+2 -1
View File
@@ -1,5 +1,6 @@
export enum Tab {
All = 'all',
Published = 'published',
Draft = 'draft'
Draft = 'draft',
Scheduled = 'scheduled'
}
src/dashboardWebView/hooks/usePages.tsx
+15 -6
View File
@@ -152,23 +152,32 @@ export default function usePages(pages: Page[]) {
const usesDraft = crntPages.some(x => typeof x[draftFieldName] !== 'undefined');
if (usesDraft) {
const drafts = crntPages.filter(
const allDrafts = crntPages.filter(
(page) => page[draftFieldName] == true || page[draftFieldName] === 'true'
);
const published = crntPages.filter(
const allPublished = crntPages.filter(
(page) =>
page[draftFieldName] == false ||
page[draftFieldName] === 'false' ||
typeof page[draftFieldName] === 'undefined'
);
draftTypes[Tab.Draft] = draftField?.invert ? published.length : drafts.length;
draftTypes[Tab.Published] = draftField?.invert ? drafts.length : published.length;
// If the invert is set, the drafts become published and vice versa
const isInverted = draftField?.invert;
const drafts = !isInverted ? allDrafts : allPublished;
const published = (!isInverted ? allPublished : allDrafts).filter((page) => !page.fmPublished || page.fmPublished <= Date.now());
const scheduled = (!isInverted ? allPublished : allDrafts).filter((page) => page.fmPublished && page.fmPublished > Date.now());
draftTypes[Tab.Draft] = drafts.length;
draftTypes[Tab.Published] = published.length;
draftTypes[Tab.Scheduled] = scheduled.length;
if (tab === Tab.Published) {
crntPages = draftField?.invert ? drafts : published;
crntPages = published;
} else if (tab === Tab.Draft) {
crntPages = draftField?.invert ? published : drafts;
crntPages = drafts;
} else if (tab === Tab.Scheduled) {
crntPages = scheduled;
} else {
crntPages = crntPages;
}