jeffemmett
/
postiz
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: fix post edit

This commit is contained in:
Nevo David 2026-01-05 22:34:36 +07:00
parent ead98cb41f
commit bb9aa1aee6
2 changed files with 85 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

100
apps/frontend/src/components/new-launch/manage.modal.tsx
View File

@ -4,6 +4,7 @@ import React, {
FC, FC,
ReactNode, ReactNode,
useCallback, useCallback,
useEffect,
useMemo, useMemo,
useRef, useRef,
useState, useState,
@ -74,9 +75,11 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
locked, locked,
current, current,
activateExitButton, activateExitButton,
setHide,
} = useLaunchStore( } = useLaunchStore(
useShallow((state) => ({ useShallow((state) => ({
hide: state.hide, hide: state.hide,
setHide: state.setHide,
date: state.date, date: state.date,
setDate: state.setDate, setDate: state.setDate,
current: state.current, current: state.current,
@ -92,6 +95,12 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
})) }))
); );
useEffect(() => {
if (hide) {
setHide(false);
}
}, [hide]);
const currentIntegrationText = useMemo(() => { const currentIntegrationText = useMemo(() => {
if (current === 'global') { if (current === 'global') {
return ''; return '';
@ -100,20 +109,22 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
const currentIntegration = integrations.find((p) => p.id === current)!; const currentIntegration = integrations.find((p) => p.id === current)!;
return ( return (
<div className="flex items-center gap-[10px]"> <div className="flex items-center gap-[10px]">
<div className="relative"> <div className="relative">
<img <img
src={`/icons/platforms/${currentIntegration.identifier}.png`} src={`/icons/platforms/${currentIntegration.identifier}.png`}
className="w-[20px] h-[20px] rounded-[4px]" className="w-[20px] h-[20px] rounded-[4px]"
alt={currentIntegration.identifier} alt={currentIntegration.identifier}
/> />
<SettingsIcon <SettingsIcon
size={15} size={15}
className="text-white absolute -end-[5px] -bottom-[5px]" className="text-white absolute -end-[5px] -bottom-[5px]"
/> />
</div>
<div>{currentIntegration.name} {t('channel_settings', 'Settings')}</div>
</div> </div>
<div>
{currentIntegration.name} {t('channel_settings', 'Settings')}
</div>
</div>
); );
}, [current]); }, [current]);
@ -158,7 +169,10 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
setLoading(true); setLoading(true);
if ( if (
!(await deleteDialog( !(await deleteDialog(
t('are_you_sure_you_want_to_delete_post', 'Are you sure you want to delete this post?'), t(
'are_you_sure_you_want_to_delete_post',
'Are you sure you want to delete this post?'
),
t('yes_delete_it', 'Yes, delete it!') t('yes_delete_it', 'Yes, delete it!')
)) ))
) { ) {
@ -191,9 +205,14 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
for (const item of notEnoughChars) { for (const item of notEnoughChars) {
toaster.show( toaster.show(
'' + `${capitalize(item.integration.identifier.split('-')[0])} (${
item.integration.name + item.integration.name
' ' + t('post_needs_content_or_image', 'Your post should have at least one character or one image.'), }):` +
' ' +
t(
'post_needs_content_or_image',
'Your post should have at least one character or one image.'
),
'warning' 'warning'
); );
setLoading(false); setLoading(false);
@ -203,7 +222,12 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
for (const item of checkAllValid) { for (const item of checkAllValid) {
if (item.valid === false) { if (item.valid === false) {
toaster.show(t('please_fix_your_settings', 'Please fix your settings'), 'warning'); toaster.show(
`${capitalize(item.integration.identifier.split('-')[0])} (${
item.integration.name
}): ${t('please_fix_your_settings', 'Please fix your settings')}`,
'warning'
);
item.fix(); item.fix();
setLoading(false); setLoading(false);
setShowSettings(true); setShowSettings(true);
@ -240,7 +264,10 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
for (const item of sliceNeeded) { for (const item of sliceNeeded) {
toaster.show( toaster.show(
`${item?.integration?.name} (${item?.integration?.identifier}) ${t('post_is_too_long', 'post is too long, please fix it')}`, `${item?.integration?.name} (${item?.integration?.identifier}) ${t(
'post_is_too_long',
'post is too long, please fix it'
)}`,
'warning' 'warning'
); );
item.preview(); item.preview();
@ -265,7 +292,10 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
const shortLink = !shortLinkUrl.ask const shortLink = !shortLinkUrl.ask
? false ? false
: await deleteDialog( : await deleteDialog(
t('shortlink_urls_question', 'Do you want to shortlink the URLs? it will let you get statistics over clicks'), t(
'shortlink_urls_question',
'Do you want to shortlink the URLs? it will let you get statistics over clicks'
),
t('yes_shortlink_it', 'Yes, shortlink it!') t('yes_shortlink_it', 'Yes, shortlink it!')
); );
@ -486,9 +516,16 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
selectedIntegrations.length === 0 || loading || locked selectedIntegrations.length === 0 || loading || locked
} }
onClick={schedule('draft')} onClick={schedule('draft')}
className="cursor-pointer disabled:cursor-not-allowed px-[20px] h-[44px] bg-btnSimple justify-center items-center flex rounded-[8px] text-[15px] font-[600]" className="relative cursor-pointer disabled:cursor-not-allowed px-[20px] h-[44px] bg-btnSimple justify-center items-center flex rounded-[8px] text-[15px] font-[600]"
> >
{t('save_as_draft', 'Save as Draft')} {loading && (
<div className="absolute left-[50%] top-[50%] -translate-y-[50%] -translate-x-[50%]">
<div className="animate-spin h-[20px] w-[20px] border-4 border-textColor border-t-transparent rounded-full" />
</div>
)}
<div className={clsx(loading && 'invisible')}>
{t('save_as_draft', 'Save as Draft')}
</div>
</button> </button>
)} )}
{addEditSets && ( {addEditSets && (
@ -509,9 +546,19 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
selectedIntegrations.length === 0 || loading || locked selectedIntegrations.length === 0 || loading || locked
} }
onClick={schedule('schedule')} onClick={schedule('schedule')}
className="text-white min-w-[180px] btnSub disabled:cursor-not-allowed disabled:opacity-80 outline-none gap-[8px] flex justify-center items-center h-[44px] rounded-[8px] bg-[#612BD3] ps-[20px] pe-[16px]" className="text-white relative min-w-[180px] btnSub disabled:cursor-not-allowed disabled:opacity-80 outline-none gap-[8px] flex justify-center items-center h-[44px] rounded-[8px] bg-[#612BD3] ps-[20px] pe-[16px]"
> >
<div className="text-[15px] font-[600]"> {loading && (
<div className="absolute left-[50%] top-[50%] -translate-y-[50%] -translate-x-[50%]">
<div className="animate-spin h-[20px] w-[20px] border-4 border-white border-t-transparent rounded-full" />
</div>
)}
<div
className={clsx(
'text-[15px] font-[600]',
loading && 'invisible'
)}
>
{selectedIntegrations.length === 0 {selectedIntegrations.length === 0
? t('check_circles_above', 'Check the circles above') ? t('check_circles_above', 'Check the circles above')
: dummy : dummy
@ -563,7 +610,10 @@ After using the addPostFor{num} it will create a new addPostContentFor{num+ 1} f
`} `}
labels={{ labels={{
title: t('your_assistant', 'Your Assistant'), title: t('your_assistant', 'Your Assistant'),
initial: t('assistant_initial_message', 'Hi! I can help you to refine your social media posts.'), initial: t(
'assistant_initial_message',
'Hi! I can help you to refine your social media posts.'
),
}} }}
/> />
</div> </div>

27
apps/frontend/src/components/new-launch/select.current.tsx
View File

@ -43,14 +43,13 @@ export function useHasScroll(ref: RefObject<HTMLElement>): boolean {
} }
export const SelectCurrent: FC = () => { export const SelectCurrent: FC = () => {
const { selectedIntegrations, current, setCurrent, locked, setHide, hide } = const { selectedIntegrations, current, setCurrent, locked, setHide } =
useLaunchStore( useLaunchStore(
useShallow((state) => ({ useShallow((state) => ({
selectedIntegrations: state.selectedIntegrations, selectedIntegrations: state.selectedIntegrations,
current: state.current, current: state.current,
setCurrent: state.setCurrent, setCurrent: state.setCurrent,
locked: state.locked, locked: state.locked,
hide: state.hide,
setHide: state.setHide, setHide: state.setHide,
})) }))
); );
@ -58,14 +57,6 @@ export const SelectCurrent: FC = () => {
const contentRef = useRef<HTMLDivElement>(null); const contentRef = useRef<HTMLDivElement>(null);
const hasScroll = useHasScroll(contentRef); const hasScroll = useHasScroll(contentRef);
useEffect(() => {
if (!hide) {
return;
}
setHide(false);
}, [hide]);
return ( return (
<> <>
<div className="select-none left-0 absolute w-full z-[100] px-[20px]"> <div className="select-none left-0 absolute w-full z-[100] px-[20px]">
@ -146,12 +137,11 @@ export const SelectCurrent: FC = () => {
export const IsGlobal: FC<{ id: string }> = ({ id }) => { export const IsGlobal: FC<{ id: string }> = ({ id }) => {
const t = useT(); const t = useT();
const { isInternal } = const { isInternal } = useLaunchStore(
useLaunchStore( useShallow((state) => ({
useShallow((state) => ({ isInternal: !!state.internal.find((p) => p.integration.id === id),
isInternal: !!state.internal.find(p => p.integration.id === id), }))
})) );
);
if (!isInternal) { if (!isInternal) {
return null; return null;
@ -160,7 +150,10 @@ export const IsGlobal: FC<{ id: string }> = ({ id }) => {
return ( return (
<div <div
data-tooltip-id="tooltip" data-tooltip-id="tooltip"
data-tooltip-content={t('no_longer_global_mode', 'No longer in global mode')} data-tooltip-content={t(
'no_longer_global_mode',
'No longer in global mode'
)}
className="w-[8px] h-[8px] bg-[#FC69FF] -top-[1px] -end-[3px] absolute rounded-full" className="w-[8px] h-[8px] bg-[#FC69FF] -top-[1px] -end-[3px] absolute rounded-full"
/> />
); );