Skip to content

Commit bb9aa1a

Browse files
committed
feat: fix post edit
1 parent ead98cb commit bb9aa1a

File tree

2 files changed

+85
-42
lines changed

2 files changed

+85
-42
lines changed

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

Lines changed: 75 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import React, {
44
FC,
55
ReactNode,
66
useCallback,
7+
useEffect,
78
useMemo,
89
useRef,
910
useState,
@@ -74,9 +75,11 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
7475
locked,
7576
current,
7677
activateExitButton,
78+
setHide,
7779
} = useLaunchStore(
7880
useShallow((state) => ({
7981
hide: state.hide,
82+
setHide: state.setHide,
8083
date: state.date,
8184
setDate: state.setDate,
8285
current: state.current,
@@ -92,6 +95,12 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
9295
}))
9396
);
9497

98+
useEffect(() => {
99+
if (hide) {
100+
setHide(false);
101+
}
102+
}, [hide]);
103+
95104
const currentIntegrationText = useMemo(() => {
96105
if (current === 'global') {
97106
return '';
@@ -100,20 +109,22 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
100109
const currentIntegration = integrations.find((p) => p.id === current)!;
101110

102111
return (
103-
<div className="flex items-center gap-[10px]">
104-
<div className="relative">
105-
<img
106-
src={`/icons/platforms/${currentIntegration.identifier}.png`}
107-
className="w-[20px] h-[20px] rounded-[4px]"
108-
alt={currentIntegration.identifier}
109-
/>
110-
<SettingsIcon
111-
size={15}
112-
className="text-white absolute -end-[5px] -bottom-[5px]"
113-
/>
114-
</div>
115-
<div>{currentIntegration.name} {t('channel_settings', 'Settings')}</div>
112+
<div className="flex items-center gap-[10px]">
113+
<div className="relative">
114+
<img
115+
src={`/icons/platforms/${currentIntegration.identifier}.png`}
116+
className="w-[20px] h-[20px] rounded-[4px]"
117+
alt={currentIntegration.identifier}
118+
/>
119+
<SettingsIcon
120+
size={15}
121+
className="text-white absolute -end-[5px] -bottom-[5px]"
122+
/>
116123
</div>
124+
<div>
125+
{currentIntegration.name} {t('channel_settings', 'Settings')}
126+
</div>
127+
</div>
117128
);
118129
}, [current]);
119130

@@ -158,7 +169,10 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
158169
setLoading(true);
159170
if (
160171
!(await deleteDialog(
161-
t('are_you_sure_you_want_to_delete_post', 'Are you sure you want to delete this post?'),
172+
t(
173+
'are_you_sure_you_want_to_delete_post',
174+
'Are you sure you want to delete this post?'
175+
),
162176
t('yes_delete_it', 'Yes, delete it!')
163177
))
164178
) {
@@ -191,9 +205,14 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
191205

192206
for (const item of notEnoughChars) {
193207
toaster.show(
194-
'' +
195-
item.integration.name +
196-
' ' + t('post_needs_content_or_image', 'Your post should have at least one character or one image.'),
208+
`${capitalize(item.integration.identifier.split('-')[0])} (${
209+
item.integration.name
210+
}):` +
211+
' ' +
212+
t(
213+
'post_needs_content_or_image',
214+
'Your post should have at least one character or one image.'
215+
),
197216
'warning'
198217
);
199218
setLoading(false);
@@ -203,7 +222,12 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
203222

204223
for (const item of checkAllValid) {
205224
if (item.valid === false) {
206-
toaster.show(t('please_fix_your_settings', 'Please fix your settings'), 'warning');
225+
toaster.show(
226+
`${capitalize(item.integration.identifier.split('-')[0])} (${
227+
item.integration.name
228+
}): ${t('please_fix_your_settings', 'Please fix your settings')}`,
229+
'warning'
230+
);
207231
item.fix();
208232
setLoading(false);
209233
setShowSettings(true);
@@ -240,7 +264,10 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
240264

241265
for (const item of sliceNeeded) {
242266
toaster.show(
243-
`${item?.integration?.name} (${item?.integration?.identifier}) ${t('post_is_too_long', 'post is too long, please fix it')}`,
267+
`${item?.integration?.name} (${item?.integration?.identifier}) ${t(
268+
'post_is_too_long',
269+
'post is too long, please fix it'
270+
)}`,
244271
'warning'
245272
);
246273
item.preview();
@@ -265,7 +292,10 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
265292
const shortLink = !shortLinkUrl.ask
266293
? false
267294
: await deleteDialog(
268-
t('shortlink_urls_question', 'Do you want to shortlink the URLs? it will let you get statistics over clicks'),
295+
t(
296+
'shortlink_urls_question',
297+
'Do you want to shortlink the URLs? it will let you get statistics over clicks'
298+
),
269299
t('yes_shortlink_it', 'Yes, shortlink it!')
270300
);
271301

@@ -486,9 +516,16 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
486516
selectedIntegrations.length === 0 || loading || locked
487517
}
488518
onClick={schedule('draft')}
489-
className="cursor-pointer disabled:cursor-not-allowed px-[20px] h-[44px] bg-btnSimple justify-center items-center flex rounded-[8px] text-[15px] font-[600]"
519+
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]"
490520
>
491-
{t('save_as_draft', 'Save as Draft')}
521+
{loading && (
522+
<div className="absolute left-[50%] top-[50%] -translate-y-[50%] -translate-x-[50%]">
523+
<div className="animate-spin h-[20px] w-[20px] border-4 border-textColor border-t-transparent rounded-full" />
524+
</div>
525+
)}
526+
<div className={clsx(loading && 'invisible')}>
527+
{t('save_as_draft', 'Save as Draft')}
528+
</div>
492529
</button>
493530
)}
494531
{addEditSets && (
@@ -509,9 +546,19 @@ export const ManageModal: FC<AddEditModalProps> = (props) => {
509546
selectedIntegrations.length === 0 || loading || locked
510547
}
511548
onClick={schedule('schedule')}
512-
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]"
549+
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]"
513550
>
514-
<div className="text-[15px] font-[600]">
551+
{loading && (
552+
<div className="absolute left-[50%] top-[50%] -translate-y-[50%] -translate-x-[50%]">
553+
<div className="animate-spin h-[20px] w-[20px] border-4 border-white border-t-transparent rounded-full" />
554+
</div>
555+
)}
556+
<div
557+
className={clsx(
558+
'text-[15px] font-[600]',
559+
loading && 'invisible'
560+
)}
561+
>
515562
{selectedIntegrations.length === 0
516563
? t('check_circles_above', 'Check the circles above')
517564
: dummy
@@ -563,7 +610,10 @@ After using the addPostFor{num} it will create a new addPostContentFor{num+ 1} f
563610
`}
564611
labels={{
565612
title: t('your_assistant', 'Your Assistant'),
566-
initial: t('assistant_initial_message', 'Hi! I can help you to refine your social media posts.'),
613+
initial: t(
614+
'assistant_initial_message',
615+
'Hi! I can help you to refine your social media posts.'
616+
),
567617
}}
568618
/>
569619
</div>

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

Lines changed: 10 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -43,29 +43,20 @@ export function useHasScroll(ref: RefObject<HTMLElement>): boolean {
4343
}
4444

4545
export const SelectCurrent: FC = () => {
46-
const { selectedIntegrations, current, setCurrent, locked, setHide, hide } =
46+
const { selectedIntegrations, current, setCurrent, locked, setHide } =
4747
useLaunchStore(
4848
useShallow((state) => ({
4949
selectedIntegrations: state.selectedIntegrations,
5050
current: state.current,
5151
setCurrent: state.setCurrent,
5252
locked: state.locked,
53-
hide: state.hide,
5453
setHide: state.setHide,
5554
}))
5655
);
5756

5857
const contentRef = useRef<HTMLDivElement>(null);
5958
const hasScroll = useHasScroll(contentRef);
6059

61-
useEffect(() => {
62-
if (!hide) {
63-
return;
64-
}
65-
66-
setHide(false);
67-
}, [hide]);
68-
6960
return (
7061
<>
7162
<div className="select-none left-0 absolute w-full z-[100] px-[20px]">
@@ -146,12 +137,11 @@ export const SelectCurrent: FC = () => {
146137

147138
export const IsGlobal: FC<{ id: string }> = ({ id }) => {
148139
const t = useT();
149-
const { isInternal } =
150-
useLaunchStore(
151-
useShallow((state) => ({
152-
isInternal: !!state.internal.find(p => p.integration.id === id),
153-
}))
154-
);
140+
const { isInternal } = useLaunchStore(
141+
useShallow((state) => ({
142+
isInternal: !!state.internal.find((p) => p.integration.id === id),
143+
}))
144+
);
155145

156146
if (!isInternal) {
157147
return null;
@@ -160,7 +150,10 @@ export const IsGlobal: FC<{ id: string }> = ({ id }) => {
160150
return (
161151
<div
162152
data-tooltip-id="tooltip"
163-
data-tooltip-content={t('no_longer_global_mode', 'No longer in global mode')}
153+
data-tooltip-content={t(
154+
'no_longer_global_mode',
155+
'No longer in global mode'
156+
)}
164157
className="w-[8px] h-[8px] bg-[#FC69FF] -top-[1px] -end-[3px] absolute rounded-full"
165158
/>
166159
);

0 commit comments

Comments
 (0)