gitea-admin/lti-web-client
1
0
Fork 0
mirror of https://gitlab.com/mbugroup/lti-web-client.git synced 2026-05-20 21:41:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(FE-170,174): adjust layout of action buttons in RecordingForm for better responsiveness

Browse Source
This commit is contained in:
rstubryan
2025-11-20 09:20:39 +07:00
parent ac764c9d3b
commit cb236c191b
1 changed files with 11 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/pages/production/recording/form/RecordingForm.tsx
+11 -9
View File
@@ -2624,9 +2624,9 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
)}
{/* Action buttons */}
<div className='flex flex-row justify-between gap-2 flex-wrap'>
<div className='flex flex-col sm:flex-row sm:justify-between gap-2'>
{/* Left side - Detail & Edit actions */}
<div className='flex flex-row justify-start gap-2'>
<div className='flex flex-col sm:flex-row justify-start gap-2 w-full sm:w-auto'>
{type === 'detail' && deleteRecordingClickHandler && (
<Button
type='button'
@@ -2660,7 +2660,8 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
</Button>
)}
</div>
<div className='flex flex-row justify-end gap-2'>
{/* Right side actions */}
<div className='flex flex-col sm:flex-row sm:justify-end gap-2 w-full sm:w-auto'>
{type === 'detail' && isLayingCategory && (
<Tooltip
content={
@@ -2668,7 +2669,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
? 'Lanjut ke proses grading untuk telur konsumsi baik'
: 'Hanya bisa melanjutkan ke grading jika ada Telur Konsumsi Baik'
}
position='top'
position='left'
color={
hasConsumableEggsInCurrentRecording ? 'info' : 'warning'
}
@@ -2677,6 +2678,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
type='button'
color='primary'
disabled={!hasConsumableEggsInCurrentRecording}
className='w-full sm:w-auto'
onClick={() => {
const recordingId =
newRecordingData?.id || initialValues?.id;
@@ -2701,7 +2703,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
)}
{type === 'edit' && (
<>
<div className='flex flex-col sm:flex-row gap-2 w-full sm:w-auto'>
<Button
type='reset'
color='warning'
@@ -2724,11 +2726,11 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
>
Submit
</Button>
</>
</div>
)}
{type === 'add' && (
<>
<div className='flex flex-col sm:flex-row gap-2 w-full sm:w-auto'>
<Button
type='reset'
color='warning'
@@ -2758,7 +2760,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
? 'Lanjut ke proses grading untuk telur konsumsi baik'
: 'Hanya bisa melanjutkan ke grading jika ada Telur Konsumsi Baik'
}
position='top'
position='left'
color={hasConsumableEggs ? 'info' : 'warning'}
>
<Button
@@ -2824,7 +2826,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
</Button>
</Tooltip>
)}
</>
</div>
)}
</div>
</div>