-
- {t('don_t_have_an_account', "Don't Have An Account?")}
-
+ {!registrationDisabled && (
+
+ {t('don_t_have_an_account', "Don't Have An Account?")}
+
+
+ )}
({
+ ...defaultFilters,
+ loading: true,
+ requestError: false,
+ sets: [],
+ signature: undefined,
+ comments: [],
+ integrations: [],
+ visibleIntegrations: [],
+ trendings: [],
+ posts: [],
+ reloadCalendarView: () => undefined,
+ setFilters: () => undefined,
+ changeDate: () => undefined,
+ listPosts: [],
listPage: 0,
listTotalPages: 0,
- setListPage: (page: number) => {
- /** empty **/
- },
- listState: 'all' as ListStateFilter,
- setListState: (state: ListStateFilter) => {
- /** empty **/
- },
+ setListPage: () => undefined,
+ listState: 'all',
+ setListState: () => undefined,
});
-export interface Integrations {
- name: string;
- id: string;
- disabled?: boolean;
- inBetweenSteps: boolean;
- editor: 'none' | 'normal' | 'markdown' | 'html';
- stripLinks?: boolean;
- display: string;
- identifier: string;
- type: string;
- picture: string;
- changeProfilePicture: boolean;
- additionalSettings: string;
- changeNickName: boolean;
- time: {
- time: number;
- }[];
- customer?: {
- name?: string;
- id?: string;
- };
-}
-
-// Helper function to get start and end dates based on display type
-function getDateRange(display: string, referenceDate?: string) {
+function getDateRange(display: CalendarDisplay, referenceDate?: string) {
const date = referenceDate ? newDayjs(referenceDate) : newDayjs();
switch (display) {
@@ -119,17 +85,13 @@ function getDateRange(display: string, referenceDate?: string) {
startDate: date.format('YYYY-MM-DD'),
endDate: date.format('YYYY-MM-DD'),
};
- case 'week':
- return {
- startDate: date.startOf('isoWeek').format('YYYY-MM-DD'),
- endDate: date.endOf('isoWeek').format('YYYY-MM-DD'),
- };
case 'month':
return {
startDate: date.startOf('month').format('YYYY-MM-DD'),
endDate: date.endOf('month').format('YYYY-MM-DD'),
};
- default:
+ case 'week':
+ case 'list':
return {
startDate: date.startOf('isoWeek').format('YYYY-MM-DD'),
endDate: date.endOf('isoWeek').format('YYYY-MM-DD'),
@@ -137,120 +99,138 @@ function getDateRange(display: string, referenceDate?: string) {
}
}
+function parseDisplay(value: string | null, fallback: string): CalendarDisplay {
+ const display = value || fallback;
+ return display === 'day' ||
+ display === 'week' ||
+ display === 'month' ||
+ display === 'list'
+ ? display
+ : 'week';
+}
+
+function parseListState(value: string | null): ListStateFilter {
+ return value === 'scheduled' || value === 'draft' || value === 'published'
+ ? value
+ : 'all';
+}
+
export const CalendarWeekProvider: FC<{
children: ReactNode;
- integrations: Integrations[];
-}> = ({ children, integrations }) => {
+ integrations: CalendarIntegration[];
+ integrationsReady: boolean;
+}> = ({ children, integrations, integrationsReady }) => {
const fetch = useFetch();
- const [internalData, setInternalData] = useState([] as any[]);
+ const [internalData, setInternalData] = useState([]);
const [trendings] = useState([]);
const searchParams = useSearchParams();
const [displaySaved, setDisplaySaved] = useCookie('calendar-display', 'week');
- const display = searchParams.get('display') || displaySaved;
+ const initialDisplay = parseDisplay(
+ searchParams.get('display'),
+ displaySaved
+ );
+ const availableIntegrationIds = useMemo(
+ () => new Set(integrations.map((integration) => integration.id)),
+ [integrations]
+ );
- // List view state
const [listPage, setListPage] = useState(0);
- const [listState, setListStateRaw] = useState('all');
- const setListState = useCallback((next: ListStateFilter) => {
- setListStateRaw(next);
- setListPage(0);
- }, []);
-
- // Initialize with current date range based on URL params or defaults
- const initStartDate = searchParams.get('startDate');
- const initEndDate = searchParams.get('endDate');
- const initCustomer = searchParams.get('customer');
-
+ const [listState, setListStateRaw] = useState(() =>
+ parseListState(searchParams.get('state'))
+ );
+ const listStateRef = useRef(listState);
const initialRange =
- initStartDate && initEndDate
- ? { startDate: initStartDate, endDate: initEndDate }
- : getDateRange(display);
-
- const [filters, setFilters] = useState({
+ searchParams.get('startDate') && searchParams.get('endDate')
+ ? {
+ startDate: searchParams.get('startDate')!,
+ endDate: searchParams.get('endDate')!,
+ }
+ : getDateRange(initialDisplay);
+ const initialRawIntegrationIds = Array.from(
+ new Set(
+ (searchParams.get('integrationIds')?.split(',') || [])
+ .map((id) => id.trim())
+ .filter(Boolean)
+ )
+ ).sort();
+ const pendingUrlIntegrationIds = useRef(
+ initialRawIntegrationIds
+ );
+ const [filters, setFilters] = useState({
startDate: initialRange.startDate,
endDate: initialRange.endDate,
- customer: initCustomer || null,
- display,
+ customer: searchParams.get('customer') || null,
+ display: initialDisplay,
+ integrationIds: integrationsReady
+ ? parseIntegrationIds(
+ searchParams.get('integrationIds'),
+ availableIntegrationIds
+ )
+ : normalizeIntegrationIds(initialRawIntegrationIds),
});
+ const filtersRef = useRef(filters);
- const params = useMemo(() => {
- return new URLSearchParams({
- display: filters.display,
- startDate: filters.startDate,
- endDate: filters.endDate,
- customer: filters?.customer?.toString() || '',
- }).toString();
- }, [filters]);
-
- // Calendar view data fetcher
- const loadData = useCallback(async () => {
- const modifiedParams = new URLSearchParams({
- display: filters.display,
- customer: filters?.customer?.toString() || '',
- startDate: newDayjs(filters.startDate).startOf('day').utc().format(),
- endDate: newDayjs(filters.endDate).endOf('day').utc().format(),
- }).toString();
-
- const data = await (await fetch(`/posts?${modifiedParams}`)).json();
- return expandPosts(data);
- }, [filters, params]);
-
- // List view data fetcher
- const listParams = useMemo(() => {
- return new URLSearchParams({
- page: listPage.toString(),
- limit: '100',
- customer: filters?.customer?.toString() || '',
- state: listState,
- }).toString();
- }, [listPage, filters.customer, listState]);
-
- const loadListData = useCallback(async () => {
- const response = await fetch(`/posts/list?${listParams}`);
- return expandPostsList(await response.json());
- }, [listParams]);
-
- // SWR for calendar view
+ useEffect(() => {
+ if (!integrationsReady) {
+ return;
+ }
+ const integrationIds = normalizeIntegrationIds(
+ pendingUrlIntegrationIds.current || filtersRef.current.integrationIds,
+ availableIntegrationIds
+ );
+ pendingUrlIntegrationIds.current = null;
+ const nextFilters = {
+ ...filtersRef.current,
+ integrationIds,
+ };
+ filtersRef.current = nextFilters;
+ setFilters(() => nextFilters);
+ }, [availableIntegrationIds, integrationsReady]);
+
+ const calendarRequestUrl = useMemo(
+ () =>
+ filters.display === 'list' ? null : buildCalendarRequestUrl(filters),
+ [filters]
+ );
+ const listRequestUrl = useMemo(
+ () =>
+ filters.display === 'list'
+ ? buildCalendarListRequestUrl({
+ page: listPage,
+ limit: 100,
+ state: listState,
+ customer: filters.customer,
+ integrationIds: filters.integrationIds,
+ })
+ : null,
+ [
+ filters.customer,
+ filters.display,
+ filters.integrationIds,
+ listPage,
+ listState,
+ ]
+ );
const {
data: calendarData,
+ error: calendarError,
isLoading: calendarIsLoading,
mutate: mutateCalendar,
- } = useSWR(
- filters.display !== 'list' ? `/posts-${params}` : null,
- loadData,
- {
- refreshInterval: 3600000,
- refreshWhenOffline: false,
- refreshWhenHidden: false,
- revalidateOnFocus: false,
- }
- );
-
- // SWR for list view
+ } = useCalendarPosts(calendarRequestUrl);
const {
data: listData,
+ error: listError,
isLoading: listIsLoading,
mutate: mutateList,
- } = useSWR(
- filters.display === 'list' ? `/posts-list-${listParams}` : null,
- loadListData,
- {
- refreshInterval: 3600000,
- refreshWhenOffline: false,
- refreshWhenHidden: false,
- revalidateOnFocus: false,
- }
- );
+ } = useCalendarListPosts(listRequestUrl);
const defaultSign = useCallback(async () => {
return await (await fetch('/signatures/default')).json();
- }, []);
-
+ }, [fetch]);
const setList = useCallback(async () => {
return (await fetch('/sets')).json();
- }, []);
-
- const { data: sets, mutate } = useSWR('sets', setList, {
+ }, [fetch]);
+ const { data: sets } = useSWR('sets', setList, {
revalidateOnFocus: false,
revalidateOnReconnect: false,
revalidateIfStale: false,
@@ -267,72 +247,112 @@ export const CalendarWeekProvider: FC<{
refreshWhenOffline: false,
});
- const setFiltersWrapper = useCallback(
- (newFilters: {
- startDate: string;
- endDate: string;
- display: 'week' | 'month' | 'day' | 'list';
- customer: string | null;
- }) => {
- setDisplaySaved(newFilters.display);
- setFilters(newFilters);
- setInternalData([]);
-
- // Reset page when switching to list view
- if (newFilters.display === 'list') {
- setListPage(0);
+ const replaceLaunchesUrl = useCallback(
+ (nextFilters: CalendarFilters, nextListState: ListStateFilter) => {
+ const currentParams = new URLSearchParams(window.location.search);
+ const pendingIntegrationIds = currentParams.get(INTEGRATION_QUERY_PARAM);
+ const params = buildLaunchesSearchParams(
+ currentParams,
+ nextFilters,
+ nextListState
+ );
+ if (pendingUrlIntegrationIds.current !== null) {
+ if (pendingIntegrationIds === null) {
+ params.delete(INTEGRATION_QUERY_PARAM);
+ } else {
+ params.set(INTEGRATION_QUERY_PARAM, pendingIntegrationIds);
+ }
}
-
- const path = [
- `startDate=${newFilters.startDate}`,
- `endDate=${newFilters.endDate}`,
- `display=${newFilters.display}`,
- newFilters.customer ? `customer=${newFilters.customer}` : ``,
- ].filter((f) => f);
- window.history.replaceState(null, '', `/launches?${path.join('&')}`);
+ window.history.replaceState(null, '', `/launches?${params.toString()}`);
},
[]
);
+ const setFiltersWrapper = useCallback(
+ (update: CalendarFilterUpdate) => {
+ if (update.integrationIds !== undefined) {
+ pendingUrlIntegrationIds.current = null;
+ }
+ const integrationIds =
+ update.integrationIds === undefined
+ ? filtersRef.current.integrationIds
+ : normalizeIntegrationIds(
+ update.integrationIds,
+ integrationsReady ? availableIntegrationIds : undefined
+ );
+ const nextFilters: CalendarFilters = { ...update, integrationIds };
+ filtersRef.current = nextFilters;
+ setDisplaySaved(nextFilters.display);
+ setFilters(() => nextFilters);
+ setInternalData([]);
+ setListPage(0);
+ replaceLaunchesUrl(nextFilters, listStateRef.current);
+ },
+ [
+ availableIntegrationIds,
+ integrationsReady,
+ replaceLaunchesUrl,
+ setDisplaySaved,
+ ]
+ );
+ const setListState = useCallback(
+ (next: ListStateFilter) => {
+ listStateRef.current = next;
+ setListStateRaw(() => next);
+ setListPage(0);
+ replaceLaunchesUrl(filtersRef.current, next);
+ },
+ [replaceLaunchesUrl]
+ );
const posts = useMemo(() => calendarData?.posts || [], [calendarData?.posts]);
- const comments = useMemo(() => calendarData?.comments || [], [calendarData?.comments]);
-
- // List view data
+ const comments = useMemo(
+ () => calendarData?.comments || [],
+ [calendarData?.comments]
+ );
const listPosts = useMemo(() => listData?.posts || [], [listData?.posts]);
- const listTotal = listData?.total || 0;
- const listTotalPages = Math.ceil(listTotal / 100);
-
- const changeDate = useCallback(
- (id: string, date: dayjs.Dayjs) => {
- setInternalData((d) =>
- d.map((post: Post) => {
- if (post.id === id) {
- return {
+ const listTotalPages = Math.ceil((listData?.total || 0) / 100);
+ const visibleIntegrations = useMemo(() => {
+ const customerIntegrations = filters.customer
+ ? integrations.filter(
+ (integration) => integration.customer?.id === filters.customer
+ )
+ : integrations;
+ if (!filters.integrationIds.length) {
+ return customerIntegrations;
+ }
+ const selectedIds = new Set(filters.integrationIds);
+ return customerIntegrations.filter((integration) =>
+ selectedIds.has(integration.id)
+ );
+ }, [filters.customer, filters.integrationIds, integrations]);
+
+ const changeDate = useCallback((id: string, date: dayjs.Dayjs) => {
+ setInternalData((current) =>
+ current.map((post) =>
+ post.id === id
+ ? {
...post,
publishDate: date.utc().format('YYYY-MM-DDTHH:mm:ss'),
- };
- }
- return post;
- })
- );
- },
- [posts, internalData]
- );
+ }
+ : post
+ )
+ );
+ }, []);
useEffect(() => {
- if (posts) {
- setInternalData(posts);
- }
+ setInternalData(posts);
}, [posts]);
- // Combined reload function that handles both calendar and list views
const reloadCalendarView = useCallback(() => {
mutateCalendar();
mutateList();
}, [mutateCalendar, mutateList]);
-
- // Determine loading state based on current view
- const loading = filters.display === 'list' ? listIsLoading : calendarIsLoading;
+ const loading =
+ filters.display === 'list' ? listIsLoading : calendarIsLoading;
+ const requestError =
+ filters.display === 'list'
+ ? !!listError && !listData
+ : !!calendarError && !calendarData;
return (
void) => {
+export const usePostActions = (
+ onMutate?: () => void
+): CalendarPostActionCallbacks => {
const t = useT();
const fetch = useFetch();
const modal = useModals();
@@ -117,9 +125,7 @@ const usePostActions = (onMutate?: () => void) => {
const date = !isDuplicate
? null
: (await (await fetch('/posts/find-slot')).json()).date;
- const publishDate = dayjs
- .utc(date || data.posts[0].publishDate)
- .local();
+ const publishDate = dayjs.utc(date || data.posts[0].publishDate).local();
const ExistingData = !isDuplicate
? ExistingDataContextProvider
: Fragment;
@@ -248,21 +254,34 @@ const usePostActions = (onMutate?: () => void) => {
classNames: {
modal: 'w-[100%] max-w-[800px]',
},
- children: (
-
@@ -321,13 +349,9 @@ export const DayView = () => {
key={option[0].time}
className="min-h-[60px] rounded-[10px] flex justify-center items-center gap-[10px] mb-[20px]"
>
-
p.integration),
- }}
- >
+
p.integration)}
getDate={currentDay
.startOf('day')
.add(option[0].time, 'minute')
@@ -493,7 +517,8 @@ export const MonthView = () => {
export const ListView = () => {
const t = useT();
const user = useUser();
- const { integrations, loading, listPosts, listState } = useCalendar();
+ const calendar = useCalendar();
+ const { integrations, loading, listPosts, listState } = calendar;
const emptyMessage =
listState === 'scheduled'
? t('no_upcoming_posts', 'No upcoming posts scheduled')
@@ -504,7 +529,15 @@ export const ListView = () => {
: t('no_posts', 'No posts');
// Use shared post actions hook
- const { editPost, deletePost, copyDebugJson, openStatistics, openMissingRelease } = usePostActions();
+ const {
+ editPost,
+ duplicatePost,
+ deletePost,
+ copyDebugJson,
+ statistics,
+ missingRelease,
+ previewPost,
+ } = usePostActions();
// Group posts by date
const groupedPosts = useMemo(() => {
@@ -530,7 +563,28 @@ export const ListView = () => {
if (listPosts.length === 0) {
return (
-
{emptyMessage}
+
+ {calendar.integrationIds.length > 0
+ ? t('calendar_no_channel_posts', 'No posts match these channels')
+ : emptyMessage}
+
+ {calendar.integrationIds.length > 0 && (
+
+ calendar.setFilters({
+ startDate: calendar.startDate,
+ endDate: calendar.endDate,
+ display: calendar.display,
+ customer: calendar.customer,
+ integrationIds: [],
+ })
+ }
+ >
+ {t('calendar_show_all_channels', 'Show all channels')}
+
+ )}
- {newDayjs(dateKey).format(isUSCitizen() ? 'dddd, MMMM D, YYYY' : 'dddd, D MMMM YYYY')}
+ {newDayjs(dateKey).format(
+ isUSCitizen() ? 'dddd, MMMM D, YYYY' : 'dddd, D MMMM YYYY'
+ )}
{datePosts.map((post) => (
{
);
};
+const CompactCalendar = () => {
+ const calendar = useCalendar();
+ const postActions = usePostActions();
+
+ return (
+
+ calendar.setFilters({
+ startDate: calendar.startDate,
+ endDate: calendar.endDate,
+ display: calendar.display,
+ customer: calendar.customer,
+ integrationIds: [],
+ })
+ }
+ postActions={postActions}
+ />
+ );
+};
+
export const Calendar = () => {
- const { display } = useCalendar();
+ const { display, requestError, reloadCalendarView } = useCalendar();
+ const t = useT();
+ const isCompact = useMediaQuery('(max-width: 1025px)');
+
+ if (requestError) {
+ return (
+
+
{t('calendar_request_error', 'Unable to load the calendar.')}
+
+ {t('calendar_retry', 'Retry')}
+
+
-
- {t(
- 'post_already_published_drag',
- 'This post was already published, what do you want to do?'
- )}
-
-
-
-
{
- modal.closeAll();
- resolve('update');
- }}
- >
- {t('just_update_post_details', 'Just update the post details')}
-
+ // Check if post is already published or queued in the past
+ if (
+ post &&
+ (post.state === 'PUBLISHED' ||
+ (post.state === 'QUEUE' &&
+ dayjs().isAfter(dayjs.utc(post.publishDate))))
+ ) {
+ const whatToDo = await new Promise<'schedule' | 'update' | 'cancel'>(
+ (resolve) => {
+ modal.openModal({
+ title: t('what_do_you_want_to_do', 'What do you want to do?'),
+ children: (
+
+
+ {t(
+ 'post_already_published_drag',
+ 'This post was already published, what do you want to do?'
+ )}
-
-
{
- modal.closeAll();
- resolve('schedule');
- }}
- >
- {t('reschedule_post', 'Reschedule the post')}
-
+
+
+ {
+ modal.closeAll();
+ resolve('update');
+ }}
+ >
+ {t(
+ 'just_update_post_details',
+ 'Just update the post details'
+ )}
+
+
+
+ {
+ modal.closeAll();
+ resolve('schedule');
+ }}
+ >
+ {t('reschedule_post', 'Reschedule the post')}
+
+
-
- ),
- onClose: () => resolve('cancel'),
- });
- }
- );
+ ),
+ onClose: () => resolve('cancel'),
+ });
+ }
+ );
- if (whatToDo === 'cancel') {
- return;
+ if (whatToDo === 'cancel') {
+ return;
+ }
+ action = whatToDo;
}
- action = whatToDo;
- }
- if (!item.interval) {
- changeDate(item.id, getDate);
- }
- const { status } = await fetch(`/posts/${item.id}/date`, {
- method: 'PUT',
- body: JSON.stringify({
- date: getDate.utc().format('YYYY-MM-DDTHH:mm:ss'),
- action,
- }),
- });
- if (status !== 500) {
- if (item.interval || action === 'schedule') {
- reloadCalendarView();
+ if (!item.interval) {
+ changeDate(item.id, getDate);
+ }
+ const { status } = await fetch(`/posts/${item.id}/date`, {
+ method: 'PUT',
+ body: JSON.stringify({
+ date: getDate.utc().format('YYYY-MM-DDTHH:mm:ss'),
+ action,
+ }),
+ });
+ if (status !== 500) {
+ if (item.interval || action === 'schedule') {
+ reloadCalendarView();
+ return;
+ }
return;
}
- return;
- }
- },
- collect: (monitor) => ({
- canDrop: isBeforeNow ? false : !!monitor.canDrop() && !!monitor.isOver(),
+ },
+ collect: (monitor) => ({
+ canDrop: isBeforeNow
+ ? false
+ : !!monitor.canDrop() && !!monitor.isOver(),
+ }),
}),
- }), [posts]);
+ [posts]
+ );
const addModal = useCallback(async () => {
const set: any = !sets.length
@@ -799,11 +937,11 @@ export const CalendarColumn: FC<{
...p,
}))}
mutate={reloadCalendarView}
- {...(signature?.id && !set
+ {...(currentSignature?.id && !set
? {
onlyValues: [
{
- content: '\n' + signature.content,
+ content: '\n' + currentSignature.content,
},
],
}
@@ -870,15 +1008,18 @@ export const CalendarColumn: FC<{
display={display as 'day' | 'week' | 'month'}
isBeforeNow={isBeforeNow}
date={getDate}
- state={post.state}
- statistics={openStatistics(post.id)}
- missingRelease={openMissingRelease(post.id)}
- editPost={editPost(post, false)}
- duplicatePost={editPost(post, true)}
- copyDebugJson={user?.isSuperAdmin ? copyDebugJson(post) : undefined}
+ statistics={statistics(post)}
+ missingRelease={missingRelease(post)}
+ editPost={editPost(post)}
+ duplicatePost={duplicatePost(post)}
+ previewPost={previewPost(post)}
+ copyDebugJson={
+ user?.isSuperAdmin ? copyDebugJson(post) : undefined
+ }
post={post}
- integrations={integrations}
+ integrations={displayIntegrations}
deletePost={deletePost(post)}
+ showTime={true}
/>
@@ -903,7 +1044,7 @@ export const CalendarColumn: FC<{
{!isBeforeNow && (
- {integrations.map((selectedIntegrations) => (
+ {displayIntegrations.map((selectedIntegrations) => (
void;
duplicatePost: () => void;
+ previewPost: () => void;
copyDebugJson?: () => void;
deletePost: () => void;
statistics: () => void;
missingRelease?: () => void;
integrations: Integrations[];
- state: State;
- display: 'day' | 'week' | 'month';
+ display: CalendarCardDensity;
showTime?: boolean;
- post: Post & {
- integration: Integration;
- tags: {
- tag: Tags;
- }[];
- };
+ post: CalendarPost;
}> = memo((props) => {
- const t = useT();
const {
editPost,
statistics,
duplicatePost,
+ previewPost,
copyDebugJson,
post,
date,
isBeforeNow,
- state,
display,
deletePost,
showTime,
missingRelease,
+ integrations,
} = props;
const { disableXAnalytics } = useVariables();
- const user = useUser();
- const showCreationMethodBadge =
- user?.impersonate &&
- post.creationMethod &&
- post.creationMethod !== 'UNKNOWN';
- const preview = useCallback(() => {
- window.open(`/p/` + post.id + '?share=true', '_blank');
- }, [post]);
const [{ opacity }, dragRef] = useDrag(
() => ({
type: 'post',
@@ -1034,252 +1162,48 @@ const CalendarItem: FC<{
}),
[]
);
+ const dragTargetRef = useCallback(
+ (element: HTMLElement | null) => {
+ dragRef(element);
+ },
+ [dragRef]
+ );
+ const integrationState = integrations.find(
+ (integration) => integration.id === post.integration.id
+ );
+ const canShowStatistics = !(
+ (post.integration.providerIdentifier === 'x' && disableXAnalytics) ||
+ !post.releaseId
+ );
+
return (
- {state === 'ERROR' && (
-
- !
-
- )}
- {showCreationMethodBadge && (
-
-
- )}
-
-
- {post.tags.map((p) => p.tag.name).join(', ')}
-
- {copyDebugJson && (
-
-
- )}
-
-
-
{' '}
- {((post.integration.providerIdentifier === 'x' && disableXAnalytics) || !post.releaseId) ? (
- <>
- ) : post.releaseId === 'missing' && missingRelease ? (
-
-
- ) : post.releaseId !== 'missing' ? (
-
-
- ) : (
- <>
- )}{' '}
-
-
-
-
-
-
-
-
-
-
- {state === 'DRAFT' ? t('draft', 'Draft') + ': ' : ''}
-
-
-
- {stripHtmlValidation('none', post.content, false, true, false) ||
- t('no_content', 'no content')}
-
-
-
- {showTime && (
-
- {newDayjs(post.publishDate).local().format(isUSCitizen() ? 'hh:mm A' : 'HH:mm')}
-
- )}
-
+
);
});
-const CopyDebug = () => {
- const t = useT();
- return (
-
-
- );
-};
-const Duplicate = () => {
- const t = useT();
- return (
-
-
- );
-};
-const Preview = () => {
- const t = useT();
- return (
-
-
- );
-};
-export const Statistics = () => {
- const t = useT();
- return (
-
-
- );
-};
-
-export const DeletePost = () => {
- const t = useT();
- return (
-
-
- );
-};
export const SetSelectionModal: FC<{
sets: any[];
diff --git a/apps/frontend/src/components/launches/filters.tsx b/apps/frontend/src/components/launches/filters.tsx
index 5fd690f..545aa84 100644
--- a/apps/frontend/src/components/launches/filters.tsx
+++ b/apps/frontend/src/components/launches/filters.tsx
@@ -1,10 +1,15 @@
'use client';
-import { useCalendar, ListStateFilter } from '@gitroom/frontend/components/launches/calendar.context';
+import {
+ useCalendar,
+ ListStateFilter,
+} from '@gitroom/frontend/components/launches/calendar.context';
import clsx from 'clsx';
import dayjs from 'dayjs';
import { useCallback } from 'react';
import { SelectCustomer } from '@gitroom/frontend/components/launches/select.customer';
+import { IntegrationFilter } from '@gitroom/frontend/components/launches/integration-filter';
+import { normalizeIntegrationIds } from '@gitroom/frontend/components/launches/calendar-filter-query';
import { useT } from '@gitroom/react/translation/get.transation.service.client';
import i18next from 'i18next';
import { newDayjs } from '@gitroom/frontend/components/layout/set.timezone';
@@ -170,15 +175,40 @@ export const Filters = () => {
}, [calendar]);
const setCustomer = useCallback(
- (customer: string) => {
+ (customer: string | null) => {
if (calendar.customer === customer) {
return; // No need to set the same customer
}
+ const customerIntegrationIds = customer
+ ? new Set(
+ calendar.integrations
+ .filter((integration) => integration.customer?.id === customer)
+ .map(({ id }) => id)
+ )
+ : undefined;
+ const integrationIds = normalizeIntegrationIds(
+ calendar.integrationIds,
+ customerIntegrationIds
+ );
calendar.setFilters({
startDate: calendar.startDate,
endDate: calendar.endDate,
display: calendar.display as 'day' | 'week' | 'month',
- customer: customer,
+ customer,
+ integrationIds,
+ });
+ },
+ [calendar]
+ );
+
+ const setIntegrations = useCallback(
+ (integrationIds: string[]) => {
+ calendar.setFilters({
+ startDate: calendar.startDate,
+ endDate: calendar.endDate,
+ display: calendar.display,
+ customer: calendar.customer,
+ integrationIds,
});
},
[calendar]
@@ -287,13 +317,24 @@ export const Filters = () => {
}, [calendar]);
return (
-
+
{!isListView && (
-
-
-
+
+
{
strokeLinejoin="round"
/>
-
-
+
+
-
{
strokeLinejoin="round"
/>
-
+
-
{t('today', 'Today')}
-
+
)}
{isListView && (
-
-
-
+
+ {
strokeLinejoin="round"
/>
-
-
+
+
- {t('page', 'Page')} {calendar.listPage + 1} {t('of', 'of')} {Math.max(1, calendar.listTotalPages)}
+ {t('page', 'Page')} {calendar.listPage + 1} {t('of', 'of')}{' '}
+ {Math.max(1, calendar.listTotalPages)}
-
= calendar.listTotalPages - 1}
onClick={nextPage}
className={clsx(
'text-textColor rtl:rotate-180 px-[9px] bg-newBgColorInner h-full flex items-center justify-center',
@@ -406,110 +463,146 @@ export const Filters = () => {
strokeLinejoin="round"
/>
-
+
-
+
{listStateOptions.map((option) => (
-
{option.label}
-
+
))}
)}
-
setCustomer(customer)}
- integrations={calendar.integrations}
- />
- {!isListView && (
-
-
- {t('day', 'Day')}
+
+
+
+ {!isListView && (
+
+
+ {t('day', 'Day')}
+
+
+ {t('week', 'Week')}
+
+
+ {t('month', 'Month')}
+
-
+
- {t('week', 'Week')}
-
-
+
+
+
+
- {t('month', 'Month')}
-
-
- )}
-
-
-
- {/*list*/}
-
-
+ {/*list*/}
+
+
+
diff --git a/apps/frontend/src/components/launches/generator/generator.tsx b/apps/frontend/src/components/launches/generator/generator.tsx
index 0bb0719..70d7e4b 100644
--- a/apps/frontend/src/components/launches/generator/generator.tsx
+++ b/apps/frontend/src/components/launches/generator/generator.tsx
@@ -314,7 +314,7 @@ export const GeneratorComponent = () => {
},
size: 'xl',
children: (
-
+
),
diff --git a/apps/frontend/src/components/launches/helpers/use.integration.list.tsx b/apps/frontend/src/components/launches/helpers/use.integration.list.tsx
index 4e3d2a5..6084734 100644
--- a/apps/frontend/src/components/launches/helpers/use.integration.list.tsx
+++ b/apps/frontend/src/components/launches/helpers/use.integration.list.tsx
@@ -7,17 +7,35 @@ import useSWR from 'swr';
export const useIntegrationList = () => {
const fetch = useFetch();
- const load = useCallback(async (path: string) => {
- return (await (await fetch(path)).json()).integrations;
- }, []);
+ const load = useCallback(
+ async (path: string) => {
+ const response = await fetch(path);
+ if (!response.ok) throw new Error('Integration list request failed');
+ try {
+ const payload = await response.json();
+ if (Array.isArray(payload?.integrations)) {
+ return payload.integrations;
+ }
+ } catch {
+ // Normalize parse failures below without exposing response details.
+ }
+ throw new Error('Integration list request failed');
+ },
+ [fetch]
+ );
- return useSWR('/integrations/list', load, {
+ const result = useSWR('/integrations/list', load, {
revalidateOnFocus: false,
revalidateOnReconnect: false,
revalidateIfStale: false,
revalidateOnMount: true,
refreshWhenHidden: false,
refreshWhenOffline: false,
- fallbackData: [],
});
-};
\ No newline at end of file
+
+ return {
+ ...result,
+ integrationsReady: result.data !== undefined,
+ initialLoadError: !!result.error && result.data === undefined,
+ };
+};
diff --git a/apps/frontend/src/components/launches/launches.component.tsx b/apps/frontend/src/components/launches/launches.component.tsx
index 8544a3e..b47a2e0 100644
--- a/apps/frontend/src/components/launches/launches.component.tsx
+++ b/apps/frontend/src/components/launches/launches.component.tsx
@@ -26,6 +26,7 @@ import { useT } from '@gitroom/react/translation/get.transation.service.client';
import { useIntegrationList } from '@gitroom/frontend/components/launches/helpers/use.integration.list';
import useCookie from 'react-use-cookie';
import { Onboarding } from '@gitroom/frontend/components/onboarding/onboarding';
+import { IntegrationLoadError } from '@gitroom/frontend/components/launches/integration-load-error';
export const SVGLine = () => {
return (
@@ -361,7 +362,13 @@ export const LaunchesComponent = () => {
const [reload, setReload] = useState(false);
const [collapseMenu, setCollapseMenu] = useCookie('collapseMenu', '0');
const [mode] = useCookie('mode', 'dark');
- const { isLoading, data: integrations, mutate } = useIntegrationList();
+ const {
+ isLoading,
+ data: integrations,
+ mutate,
+ integrationsReady,
+ initialLoadError,
+ } = useIntegrationList();
const totalNonDisabledChannels = useMemo(() => {
return (
@@ -491,15 +498,21 @@ export const LaunchesComponent = () => {
mutate()} />;
+ }
// @ts-ignore
return (
+
@@ -592,9 +605,17 @@ export const LaunchesComponent = () => {
-
+
+ {sortedIntegrations?.length > 0 && (
+
+
+ )}
-
diff --git a/apps/frontend/src/components/launches/select.customer.tsx b/apps/frontend/src/components/launches/select.customer.tsx
index 2b42acc..1afb23d 100644
--- a/apps/frontend/src/components/launches/select.customer.tsx
+++ b/apps/frontend/src/components/launches/select.customer.tsx
@@ -1,22 +1,42 @@
'use client';
import { uniqBy } from 'lodash';
-import React, { FC, useCallback, useMemo, useRef, useState } from 'react';
-import { Integrations } from '@gitroom/frontend/components/launches/calendar.context';
+import React, {
+ type CSSProperties,
+ FC,
+ type KeyboardEvent,
+ useEffect,
+ useMemo,
+ useRef,
+ useState,
+} from 'react';
+import type { CalendarIntegration } from '@gitroom/frontend/components/launches/calendar.types';
+import { getBoundedPopupStyle } from '@gitroom/frontend/components/launches/bounded-popup';
import { useT } from '@gitroom/react/translation/get.transation.service.client';
import clsx from 'clsx';
import { useClickOutside } from '@mantine/hooks';
import { useToaster } from '@gitroom/react/toaster/toaster';
import { useLaunchStore } from '@gitroom/frontend/components/new-launch/store';
import { useShallow } from 'zustand/react/shallow';
-import { UserIcon, DropdownArrowIcon } from '@gitroom/frontend/components/ui/icons';
+import {
+ UserIcon,
+ DropdownArrowIcon,
+} from '@gitroom/frontend/components/ui/icons';
-export const SelectCustomer: FC<{
- onChange: (value: string) => void;
- integrations: Integrations[];
- customer?: string;
-}> = (props) => {
- const { onChange, integrations, customer: currentCustomer } = props;
+interface SelectCustomerProps {
+ onChange: (value: string | null) => void;
+ integrations: readonly CalendarIntegration[];
+ customer?: string | null;
+}
+
+const focusClasses =
+ 'focus-visible:ring-2 focus-visible:ring-btnPrimary focus-visible:ring-offset-2 focus-visible:ring-offset-newBgColorInner';
+
+export const SelectCustomer: FC
= ({
+ onChange,
+ integrations,
+ customer = null,
+}) => {
const { setCurrent } = useLaunchStore(
useShallow((state) => ({
setCurrent: state.setCurrent,
@@ -24,79 +44,234 @@ export const SelectCustomer: FC<{
);
const toaster = useToaster();
const t = useT();
- const [customer, setCustomer] = useState(currentCustomer || '');
- const [pos, setPos] = useState({});
const [open, setOpen] = useState(false);
+ const [activeCustomerId, setActiveCustomerId] = useState(null);
+ const [popupStyle, setPopupStyle] = useState();
+ const triggerRef = useRef(null);
+ const itemRefs = useRef(new Map());
const ref = useClickOutside(() => {
if (open) {
setOpen(false);
}
});
- const openClose = useCallback(() => {
+ const customers = useMemo(
+ () =>
+ uniqBy(integrations, (integration) => integration.customer?.id).filter(
+ (integration) => integration.customer?.id
+ ),
+ [integrations]
+ );
+ const closeAndFocusTrigger = () => {
+ setOpen(false);
+ triggerRef.current?.focus();
+ };
+ const resolvedCustomerLabel = (integration: CalendarIntegration) =>
+ integration.customer?.name?.trim() || integration.customer!.id!;
+ const customerLabelCounts = customers.reduce>(
+ (counts, integration) => {
+ const label = resolvedCustomerLabel(integration);
+ counts[label] = (counts[label] || 0) + 1;
+ return counts;
+ },
+ {}
+ );
+ const customerMenuLabel = (integration: CalendarIntegration) => {
+ const label = resolvedCustomerLabel(integration);
+ return customerLabelCounts[label] > 1
+ ? `${label} · ${integration.customer!.id}`
+ : label;
+ };
+ const items = [
+ { id: null, label: t('calendar_all_customers', 'All customers') },
+ ...customers.map((integration) => ({
+ id: integration.customer!.id!,
+ label: customerMenuLabel(integration),
+ })),
+ ];
+ const effectiveActiveCustomerId = items.some(
+ (item) => item.id === activeCustomerId
+ )
+ ? activeCustomerId
+ : items.some((item) => item.id === customer)
+ ? customer
+ : null;
+ const activeIndex = Math.max(
+ 0,
+ items.findIndex((item) => item.id === effectiveActiveCustomerId)
+ );
+ const triggerLabel =
+ items.find((item) => item.id === customer)?.label ||
+ customer ||
+ items[0].label;
+ const selectCustomer = (value: string | null) => {
+ toaster.show(
+ t('customer_socials_selected', 'Customer socials selected'),
+ 'success'
+ );
+ onChange(value);
+ setCurrent('global');
+ closeAndFocusTrigger();
+ };
+ const focusItem = (index: number) => {
+ const nextIndex = (index + items.length) % items.length;
+ const nextId = items[nextIndex].id;
+ setActiveCustomerId(nextId);
+ itemRefs.current.get(nextId || '')?.focus();
+ };
+ const handleMenuKeyDown = (event: KeyboardEvent) => {
+ if (event.key === 'Escape') {
+ event.preventDefault();
+ closeAndFocusTrigger();
+ return;
+ }
+ if (event.key === 'ArrowDown') {
+ event.preventDefault();
+ focusItem(activeIndex + 1);
+ } else if (event.key === 'ArrowUp') {
+ event.preventDefault();
+ focusItem(activeIndex - 1);
+ } else if (event.key === 'Home') {
+ event.preventDefault();
+ focusItem(0);
+ } else if (event.key === 'End') {
+ event.preventDefault();
+ focusItem(items.length - 1);
+ } else if (event.key === 'Enter' || event.key === ' ') {
+ event.preventDefault();
+ const item = items[activeIndex];
+ if (item) selectCustomer(item.id);
+ }
+ };
+ useEffect(() => {
+ if (!open) return;
+ itemRefs.current.get(effectiveActiveCustomerId || '')?.focus();
+ const updatePosition = () => {
+ const trigger = triggerRef.current;
+ if (trigger) {
+ setPopupStyle(
+ getBoundedPopupStyle(trigger.getBoundingClientRect(), 250, 360)
+ );
+ }
+ };
+ window.addEventListener('resize', updatePosition);
+ window.addEventListener('scroll', updatePosition, true);
+ return () => {
+ window.removeEventListener('resize', updatePosition);
+ window.removeEventListener('scroll', updatePosition, true);
+ };
+ }, [effectiveActiveCustomerId, open]);
+ const toggleMenu = () => {
if (open) {
setOpen(false);
return;
}
-
- const { x, y, width, height } = ref.current?.getBoundingClientRect();
- setPos({ top: y + height, left: x });
+ const trigger = triggerRef.current;
+ if (!trigger) return;
+ setPopupStyle(
+ getBoundedPopupStyle(trigger.getBoundingClientRect(), 250, 360)
+ );
+ setActiveCustomerId(
+ items.some((item) => item.id === customer) ? customer : null
+ );
setOpen(true);
- }, [open]);
-
- const totalCustomers = useMemo(() => {
- return uniqBy(integrations, (i) => i?.customer?.id).length;
- }, [integrations]);
- if (totalCustomers <= 1) {
+ };
+ if (!customers.length && customer === null) {
return null;
}
return (
-
-
{
+ if (event.key === 'Escape') closeAndFocusTrigger();
+ }}
+ >
+
+
+ {triggerLabel}
+
-
+
{open && (
{t('customers', 'Customers')}
- {uniqBy(integrations, (u) => u?.customer?.name)
- .filter((f) => f.customer?.name)
- .map((p) => (
-
{
- toaster.show(
- t('customer_socials_selected', 'Customer socials selected'),
- 'success'
- );
- setCustomer(p.customer?.id);
- onChange(p.customer?.id);
- setOpen(false);
- setCurrent('global')
- }}
- key={p.customer?.id}
- className="p-[12px] hover:bg-newBgColor text-[14px] font-[500] h-[32px] flex items-center"
- >
- {p.customer?.name}
-
- ))}
+
{
+ if (element) itemRefs.current.set('', element);
+ else itemRefs.current.delete('');
+ }}
+ type="button"
+ role="menuitem"
+ aria-current={customer === null ? 'true' : undefined}
+ className={`flex h-[36px] items-center rounded-[6px] px-[12px] text-[14px] font-[500] hover:bg-newBgColor ${focusClasses}`}
+ onClick={() => selectCustomer(null)}
+ tabIndex={effectiveActiveCustomerId === null ? 0 : -1}
+ onFocus={() => setActiveCustomerId(null)}
+ onKeyDown={(event) => {
+ if (event.key !== 'Enter' && event.key !== ' ') return;
+ event.stopPropagation();
+ event.preventDefault();
+ selectCustomer(null);
+ }}
+ >
+ {t('calendar_all_customers', 'All customers')}
+
+ {customers.map((integration) => (
+
{
+ const id = integration.customer!.id!;
+ if (element) itemRefs.current.set(id, element);
+ else itemRefs.current.delete(id);
+ }}
+ type="button"
+ role="menuitem"
+ aria-current={
+ customer === integration.customer?.id ? 'true' : undefined
+ }
+ onClick={() => selectCustomer(integration.customer!.id!)}
+ tabIndex={
+ effectiveActiveCustomerId === integration.customer!.id! ? 0 : -1
+ }
+ onFocus={() => setActiveCustomerId(integration.customer!.id!)}
+ onKeyDown={(event) => {
+ if (event.key !== 'Enter' && event.key !== ' ') return;
+ event.stopPropagation();
+ event.preventDefault();
+ selectCustomer(integration.customer!.id!);
+ }}
+ key={integration.customer?.id}
+ className={`flex h-[36px] items-center rounded-[6px] px-[12px] text-[14px] font-[500] hover:bg-newBgColor ${focusClasses}`}
+ >
+ {customerMenuLabel(integration)}
+
+ ))}
)}
({
startToCloseTimeout: '10 minute',
taskQueue,
- retry: {
- maximumAttempts: 3,
- backoffCoefficient: 1,
- initialInterval: '2 minutes',
- },
+ retry,
});
};
@@ -49,7 +59,8 @@ const {
const poke = defineSignal('poke');
-const iterate = Array.from({ length: 5 });
+const publishAttempts = Array.from({ length: refreshRetryAttemptCount });
+const plugAttempts = Array.from({ length: plugAttemptCount });
export async function postWorkflowV105({
taskQueue,
@@ -63,16 +74,18 @@ export async function postWorkflowV105({
postNow?: boolean;
}) {
// Dynamic task queue, for concurrency
+ const { postSocial, postComment } = proxyTaskQueue(
+ taskQueue,
+ publishActivityRetry
+ );
const {
- postSocial,
- postComment,
getIntegrationById,
refreshTokenWithCause,
internalPlugs,
globalPlugs,
processInternalPlug,
processPlug,
- } = proxyTaskQueue(taskQueue);
+ } = proxyTaskQueue(taskQueue, supportActivityRetry);
let poked = false;
setHandler(poke, () => {
@@ -166,7 +179,7 @@ export async function postWorkflowV105({
for (let i = 0; i < postsList.length; i++) {
const before = postsResults.length;
// this is a small trick to repeat an action in case of token refresh
- for (const _ of iterate) {
+ for (let attempt = 0; attempt < publishAttempts.length; attempt++) {
try {
// first post the main post
if (i === 0) {
@@ -198,7 +211,10 @@ export async function postWorkflowV105({
await updatePost(
postsList[i].id,
postsResults[i].postId,
- postsResults[i].releaseURL
+ postsResults[i].releaseURL,
+ typeof postsResults[i].warning === 'string'
+ ? postsResults[i].warning
+ : undefined
);
if (i === 0) {
@@ -219,43 +235,38 @@ export async function postWorkflowV105({
// break the current while to move to the next post
break;
} catch (err) {
- // if token refresh is needed, do it and repeat
if (
+ attempt === 0 &&
err instanceof ActivityFailure &&
err.cause instanceof ApplicationFailure &&
err.cause.type === 'refresh_token'
) {
const refresh = await refreshTokenWithCause(
post.integration,
- err?.cause?.message || ''
+ err.cause.message || ''
);
- if (!refresh || !refresh.accessToken) {
- await changeState(
- postsList[0].id,
- 'ERROR',
- summarizeWorkflowError(err),
- postsList
- );
- return false;
+ if (refresh && refresh.accessToken) {
+ post.integration.token = refresh.accessToken;
+ continue;
}
-
- post.integration.token = refresh.accessToken;
- continue;
}
- // for other errors, change state and inform the user if needed
- await changeState(
- postsList[0].id,
- 'ERROR',
- summarizeWorkflowError(err),
- postsList
- );
+ // The parent is already published when a comment fails. Never make a
+ // manual retry capable of publishing the parent a second time.
+ if (i === 0) {
+ await changeState(
+ postsList[0].id,
+ 'ERROR',
+ summarizeWorkflowError(err),
+ postsList
+ );
+ }
- // specific case for bad body errors
if (
- err instanceof ActivityFailure &&
- err.cause instanceof ApplicationFailure &&
- err.cause.type === 'bad_body'
+ i !== 0 ||
+ (err instanceof ActivityFailure &&
+ err.cause instanceof ApplicationFailure &&
+ err.cause.type === 'bad_body')
) {
await inAppNotification(
post.organizationId,
@@ -265,15 +276,20 @@ export async function postWorkflowV105({
formatPostFailureNotification({
providerIdentifier: post.integration.providerIdentifier,
integrationName: post.integration.name,
- errorMessage: err.cause.message,
+ errorMessage:
+ err instanceof ActivityFailure &&
+ err.cause instanceof ApplicationFailure
+ ? err.cause.message
+ : summarizeWorkflowError(err).message,
isComment: i !== 0,
}),
true,
false,
'fail'
);
- return false;
}
+
+ return false;
}
}
@@ -339,7 +355,7 @@ export async function postWorkflowV105({
// process internal plug
if (todo.type === 'internal-plug') {
- for (const _ of iterate) {
+ for (const _ of plugAttempts) {
try {
await processInternalPlug({ ...todo, post: postsResults[0].postId });
} catch (err) {
@@ -350,12 +366,11 @@ export async function postWorkflowV105({
) {
const refresh = await refreshTokenWithCause(
await getIntegrationById(organizationId, todo.integration),
- err?.cause?.message || ''
+ err.cause.message || ''
);
if (!refresh || !refresh.accessToken) {
break;
}
-
continue;
}
@@ -375,7 +390,7 @@ export async function postWorkflowV105({
// process global plug
if (todo.type === 'global') {
- for (const _ of iterate) {
+ for (const _ of plugAttempts) {
try {
const process = await processPlug({
...todo,
@@ -404,12 +419,11 @@ export async function postWorkflowV105({
) {
const refresh = await refreshTokenWithCause(
post.integration,
- err?.cause?.message || ''
+ err.cause.message || ''
);
if (!refresh || !refresh.accessToken) {
break;
}
-
continue;
}
diff --git a/libraries/nestjs-libraries/src/database/prisma/posts/posts.repository.ts b/libraries/nestjs-libraries/src/database/prisma/posts/posts.repository.ts
index 4cd90cc..c221349 100644
--- a/libraries/nestjs-libraries/src/database/prisma/posts/posts.repository.ts
+++ b/libraries/nestjs-libraries/src/database/prisma/posts/posts.repository.ts
@@ -157,19 +157,16 @@ export class PostsRepository {
],
},
],
+ ...(query.integrationIds?.length
+ ? { integrationId: { in: query.integrationIds } }
+ : {}),
integration: {
deletedAt: null,
organizationId: orgId,
+ ...(query.customer ? { customerId: query.customer } : {}),
},
deletedAt: null,
parentPostId: null,
- ...(query.customer
- ? {
- integration: {
- customerId: query.customer,
- },
- }
- : {}),
},
select: {
id: true,
@@ -177,6 +174,7 @@ export class PostsRepository {
publishDate: true,
releaseURL: true,
releaseId: true,
+ error: true,
state: true,
intervalInDays: true,
group: true,
@@ -199,15 +197,18 @@ export class PostsRepository {
return list.reduce((all, post) => {
if (!post.intervalInDays) {
- return [...all, post];
+ const { error, ...safePost } = post;
+ return [...all, { ...safePost, message: error }];
}
const addMorePosts = [];
let startingDate = dayjs.utc(post.publishDate);
while (dayjs.utc(endDate).isSameOrAfter(startingDate)) {
if (dayjs(startingDate).isSameOrAfter(dayjs.utc(post.publishDate))) {
+ const { error, ...safePost } = post;
addMorePosts.push({
- ...post,
+ ...safePost,
+ message: error,
publishDate: startingDate.toDate(),
actualDate: post.publishDate,
});
@@ -256,12 +257,15 @@ export class PostsRepository {
],
...stateAndDate,
publishDate: { gte: dayjs.utc().toDate() },
+ ...(query.integrationIds?.length
+ ? { integrationId: { in: query.integrationIds } }
+ : {}),
deletedAt: null as Date | null,
parentPostId: null as string | null,
intervalInDays: null as number | null,
integration: {
- deletedAt: null as any,
+ deletedAt: null as Date | null,
organizationId: orgId,
...(query.customer
? {
@@ -285,6 +289,7 @@ export class PostsRepository {
publishDate: true,
releaseURL: true,
releaseId: true,
+ error: true,
state: true,
intervalInDays: true,
group: true,
@@ -308,7 +313,7 @@ export class PostsRepository {
]);
return {
- posts,
+ posts: posts.map(({ error, ...post }) => ({ ...post, message: error })),
total,
page,
limit,
@@ -385,7 +390,12 @@ export class PostsRepository {
});
}
- updatePost(id: string, postId: string, releaseURL: string) {
+ updatePost(
+ id: string,
+ postId: string,
+ releaseURL: string,
+ warning?: string
+ ) {
return this._post.model.post.update({
where: {
id,
@@ -394,6 +404,7 @@ export class PostsRepository {
state: 'PUBLISHED',
releaseURL,
releaseId: postId,
+ error: warning ?? null,
},
});
}
diff --git a/libraries/nestjs-libraries/src/database/prisma/posts/posts.service.ts b/libraries/nestjs-libraries/src/database/prisma/posts/posts.service.ts
index a3dfdb5..91a7f86 100644
--- a/libraries/nestjs-libraries/src/database/prisma/posts/posts.service.ts
+++ b/libraries/nestjs-libraries/src/database/prisma/posts/posts.service.ts
@@ -77,8 +77,13 @@ export class PostsService {
return this._postRepository.searchForMissingThreeHoursPosts();
}
- updatePost(id: string, postId: string, releaseURL: string) {
- return this._postRepository.updatePost(id, postId, releaseURL);
+ updatePost(
+ id: string,
+ postId: string,
+ releaseURL: string,
+ warning?: string
+ ) {
+ return this._postRepository.updatePost(id, postId, releaseURL, warning);
}
async getMissingContent(
diff --git a/libraries/nestjs-libraries/src/dtos/posts/get.posts.dto.ts b/libraries/nestjs-libraries/src/dtos/posts/get.posts.dto.ts
index 9480781..af60f2f 100644
--- a/libraries/nestjs-libraries/src/dtos/posts/get.posts.dto.ts
+++ b/libraries/nestjs-libraries/src/dtos/posts/get.posts.dto.ts
@@ -1,8 +1,13 @@
+import { Transform } from 'class-transformer';
import {
+ ArrayMaxSize,
+ IsArray,
+ IsDateString,
IsOptional,
IsString,
- IsDateString,
+ Matches,
} from 'class-validator';
+import { parseIntegrationIdsQuery } from './integration-ids.query';
export class GetPostsDto {
@IsDateString()
@@ -14,4 +19,12 @@ export class GetPostsDto {
@IsOptional()
@IsString()
customer: string;
+
+ @IsOptional()
+ @Transform(({ value }) => parseIntegrationIdsQuery(value))
+ @IsArray()
+ @ArrayMaxSize(100)
+ @IsString({ each: true })
+ @Matches(/^[A-Za-z0-9_-]{1,128}$/, { each: true })
+ integrationIds?: string[];
}
diff --git a/libraries/nestjs-libraries/src/dtos/posts/get.posts.list.dto.ts b/libraries/nestjs-libraries/src/dtos/posts/get.posts.list.dto.ts
index 70e764e..59a347b 100644
--- a/libraries/nestjs-libraries/src/dtos/posts/get.posts.list.dto.ts
+++ b/libraries/nestjs-libraries/src/dtos/posts/get.posts.list.dto.ts
@@ -1,12 +1,16 @@
import {
+ ArrayMaxSize,
+ IsArray,
+ IsIn,
+ IsNumber,
IsOptional,
IsString,
- IsNumber,
- Min,
Max,
- IsIn,
+ Matches,
+ Min,
} from 'class-validator';
import { Transform } from 'class-transformer';
+import { parseIntegrationIdsQuery } from './integration-ids.query';
export type PostListStateFilter = 'all' | 'scheduled' | 'draft' | 'published';
@@ -28,6 +32,14 @@ export class GetPostsListDto {
@IsString()
customer?: string;
+ @IsOptional()
+ @Transform(({ value }) => parseIntegrationIdsQuery(value))
+ @IsArray()
+ @ArrayMaxSize(100)
+ @IsString({ each: true })
+ @Matches(/^[A-Za-z0-9_-]{1,128}$/, { each: true })
+ integrationIds?: string[];
+
@IsOptional()
@IsIn(['all', 'scheduled', 'draft', 'published'])
state?: PostListStateFilter = 'all';
diff --git a/libraries/nestjs-libraries/src/integrations/social/social.integrations.interface.ts b/libraries/nestjs-libraries/src/integrations/social/social.integrations.interface.ts
index f8b706d..f976714 100644
--- a/libraries/nestjs-libraries/src/integrations/social/social.integrations.interface.ts
+++ b/libraries/nestjs-libraries/src/integrations/social/social.integrations.interface.ts
@@ -104,6 +104,7 @@ export type PostResponse = {
postId: string; // The ID of the scheduled post returned by the platform
releaseURL: string; // The URL of the post on the platform
status: string; // Status of the operation or initial post status
+ warning?: string;
};
export type PostDetails = {
diff --git a/libraries/nestjs-libraries/src/integrations/social/youtube.provider.ts b/libraries/nestjs-libraries/src/integrations/social/youtube.provider.ts
index 59bb2bb..cb994f6 100644
--- a/libraries/nestjs-libraries/src/integrations/social/youtube.provider.ts
+++ b/libraries/nestjs-libraries/src/integrations/social/youtube.provider.ts
@@ -105,18 +105,35 @@ export async function handleYoutubeThumbnail(
setThumbnail: () => Promise,
postId: string,
videoId: string
-): Promise {
+): Promise {
try {
await setThumbnail();
+ return undefined;
} catch (error) {
- if (!isUnverifiedYoutubeThumbnailError(error)) {
- throw error;
- }
-
- console.warn(
- 'YouTube video uploaded without a custom thumbnail because the channel is not verified.',
- { postId, videoId }
- );
+ const diagnostic = (() => {
+ if (error instanceof Error) {
+ return error.message;
+ }
+ try {
+ return JSON.stringify(error);
+ } catch {
+ return '';
+ }
+ })();
+ const warning = isUnverifiedYoutubeThumbnailError(error)
+ ? 'YouTube video uploaded without a custom thumbnail because the channel is not verified.'
+ : diagnostic.includes('imageFormatUnsupported')
+ ? 'We have uploaded your video but the thumbnail format is not supported, please use JPEG or PNG.'
+ : diagnostic.includes('imageTooTall')
+ ? 'We have uploaded your video but the thumbnail image is too tall.'
+ : diagnostic.includes('imageTooWide')
+ ? 'We have uploaded your video but the thumbnail image is too wide.'
+ : diagnostic.includes('failedPrecondition')
+ ? 'We have uploaded your video but we could not set the thumbnail. Thumbnail size is too large.'
+ : 'Video đã đăng nhưng không thể đặt thumbnail tùy chỉnh.';
+
+ console.warn(warning, { postId, videoId });
+ return warning;
}
}
@@ -542,25 +559,35 @@ export class YoutubeProvider extends SocialAbstract implements SocialProvider {
}
if (settings?.thumbnail?.path) {
- await handleYoutubeThumbnail(
+ const thumbnail = (
+ await axios({
+ url: settings.thumbnail.path,
+ method: 'GET',
+ responseType: 'stream',
+ })
+ ).data;
+ const warning = await handleYoutubeThumbnail(
() =>
this.runInConcurrent(async () =>
youtubeClient.thumbnails.set({
videoId,
media: {
- body: (
- await axios({
- url: settings?.thumbnail?.path,
- method: 'GET',
- responseType: 'stream',
- })
- ).data,
+ body: thumbnail,
},
})
),
firstPost.id,
videoId
);
+ return [
+ {
+ id: firstPost.id,
+ releaseURL: `https://www.youtube.com/watch?v=${videoId}`,
+ postId: videoId,
+ status: 'success',
+ ...(warning ? { warning } : {}),
+ },
+ ];
}
return [
diff --git a/libraries/react-shared-libraries/src/translation/locales/en/translation.json b/libraries/react-shared-libraries/src/translation/locales/en/translation.json
index ad1642a..492546a 100644
--- a/libraries/react-shared-libraries/src/translation/locales/en/translation.json
+++ b/libraries/react-shared-libraries/src/translation/locales/en/translation.json
@@ -1,5 +1,22 @@
{
"calendar": "Calendar",
+ "calendar_channel_filter": "Channels",
+ "calendar_channels_selected": "{{count}} selected",
+ "calendar_show_all_channels": "Show all channels",
+ "calendar_clear_selection": "Clear selection",
+ "calendar_select_all": "Select all",
+ "calendar_search_channels": "Search channels",
+ "calendar_no_customer": "No customer",
+ "calendar_all_customers": "All customers",
+ "calendar_channel_refresh_needed": "Refresh needed",
+ "calendar_channel_disabled": "Disabled",
+ "calendar_channel_selection_limit": "You can select up to {{count}} channels.",
+ "calendar_compact_representation": "Compact calendar view",
+ "calendar_no_posts_for_channels": "No posts match the selected channels",
+ "calendar_request_error": "Unable to load the calendar.",
+ "calendar_retry": "Retry",
+ "integration_list_request_error": "Unable to load channels.",
+ "integration_list_retry": "Retry",
"webhooks": "Webhooks",
"webhooks_are_a_way_to_get_notified_when_something_happens_in_postiz_via_an_http_request": "Webhooks are a way to get notified when something happens in Postiz via\n an HTTP request.",
"name": "Name",
@@ -335,6 +352,14 @@
"preview_post": "Preview Post",
"post_statistics": "Post Statistics",
"draft": "Draft",
+ "calendar_unknown_channel": "Unknown channel",
+ "calendar_status_draft": "Draft",
+ "calendar_status_scheduled": "Scheduled",
+ "calendar_status_published": "Published",
+ "calendar_status_error": "Error",
+ "calendar_post_actions": "Actions for {{channel}}",
+ "calendar_error_generic": "An error occurred while publishing this post",
+ "calendar_error_details": "Publishing error details",
"week_number": "Week {{number}}",
"top_title_edit_webhook": "Edit webhook",
"top_title_add_webhook": "Add webhook",
@@ -696,4 +721,4 @@
"back": "Back",
"get_started": "Get Started",
"kick_select_channel": "Select Channel"
-}
\ No newline at end of file
+}
diff --git a/libraries/react-shared-libraries/src/translation/locales/vi/translation.json b/libraries/react-shared-libraries/src/translation/locales/vi/translation.json
index 2d6d355..fbad9f0 100644
--- a/libraries/react-shared-libraries/src/translation/locales/vi/translation.json
+++ b/libraries/react-shared-libraries/src/translation/locales/vi/translation.json
@@ -1,5 +1,22 @@
{
"calendar": "Lịch",
+ "calendar_channel_filter": "Kênh",
+ "calendar_channels_selected": "{{count}} đã chọn",
+ "calendar_show_all_channels": "Hiện tất cả kênh",
+ "calendar_clear_selection": "Xóa chọn",
+ "calendar_select_all": "Chọn tất cả",
+ "calendar_search_channels": "Tìm kiếm kênh",
+ "calendar_no_customer": "Không có khách hàng",
+ "calendar_all_customers": "Tất cả khách hàng",
+ "calendar_channel_refresh_needed": "Cần kết nối lại",
+ "calendar_channel_disabled": "Đã tắt",
+ "calendar_channel_selection_limit": "Bạn có thể chọn tối đa {{count}} kênh.",
+ "calendar_compact_representation": "Chế độ danh sách thu gọn",
+ "calendar_no_posts_for_channels": "Không có bài viết nào phù hợp với các kênh đã chọn",
+ "calendar_request_error": "Không thể tải lịch.",
+ "calendar_retry": "Thử lại",
+ "integration_list_request_error": "Không thể tải các kênh.",
+ "integration_list_retry": "Thử lại",
"webhooks": "Webhook",
"webhooks_are_a_way_to_get_notified_when_something_happens_in_postiz_via_an_http_request": "Webhook là một cách để nhận thông báo khi có sự kiện xảy ra trong Postiz thông qua một yêu cầu HTTP.",
"name": "Tên",
@@ -335,6 +352,14 @@
"preview_post": "Xem trước bài viết",
"post_statistics": "Thống kê bài viết",
"draft": "Bản nháp",
+ "calendar_unknown_channel": "Kênh không xác định",
+ "calendar_status_draft": "Nháp",
+ "calendar_status_scheduled": "Đã lên lịch",
+ "calendar_status_published": "Đã đăng",
+ "calendar_status_error": "Lỗi",
+ "calendar_post_actions": "Hành động cho {{channel}}",
+ "calendar_error_generic": "Đã xảy ra lỗi khi đăng bài viết này",
+ "calendar_error_details": "Chi tiết lỗi đăng bài",
"week_number": "Tuần {{number}}",
"top_title_edit_webhook": "Chỉnh sửa webhook",
"top_title_add_webhook": "Thêm webhook",
-