wibu/desa-darmasaba
1
0
Fork 0
Code Issues Pull Requests 5 Actions Packages Projects Releases Wiki Activity

feat: add form validation and disable submit buttons when fields are empty

Browse Source 
Co-authored-by: Qwen-Coder <qwen-coder@alibabacloud.com>
This commit is contained in:
nico
2026-02-11 17:04:55 +08:00
parent b69df2454e
commit b35874b120
36 changed files with 1287 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/app/admin/(dashboard)/landing-page/desa-anti-korupsi/kategori-desa-anti-korupsi/[id]/page.tsx
View File

@@ -25,6 +25,11 @@ export default function EditKategoriDesaAntiKorupsi() {
const [originalData, setOriginalData] = useState({ name: '' });
const [isSubmitting, setIsSubmitting] = useState(false);
// Check if form is valid
const isFormValid = () => {
return formData.name?.trim() !== '';
};
// 📥 load data saat pertama kali dibuka
useEffect(() => {
if (!id) return;
@@ -126,9 +131,11 @@ export default function EditKategoriDesaAntiKorupsi() {
onClick={handleSubmit}
radius="md"
size="md"
disabled={isSubmitting}
disabled={!isFormValid() || isSubmitting}
style={{
background: `linear-gradient(135deg, ${colors['blue-button']}, #4facfe)`,
background: !isFormValid() || isSubmitting
? 'linear-gradient(135deg, #cccccc, #999999)'
: `linear-gradient(135deg, ${colors['blue-button']}, #4facfe)`,
color: '#fff',
boxShadow: '0 4px 15px rgba(79, 172, 254, 0.4)',
}}

10
src/app/admin/(dashboard)/landing-page/desa-anti-korupsi/kategori-desa-anti-korupsi/create/page.tsx
View File

@@ -14,6 +14,11 @@ export default function CreateKategoriDesaAntiKorupsi() {
const stateKategori = useProxy(korupsiState.kategoriDesaAntiKorupsi);
const [isSubmitting, setIsSubmitting] = useState(false);
// Check if form is valid
const isFormValid = () => {
return stateKategori.create.form.name?.trim() !== '';
};
useEffect(() => {
stateKategori.findMany.load();
}, []);
@@ -87,8 +92,11 @@ export default function CreateKategoriDesaAntiKorupsi() {
onClick={handleSubmit}
radius="md"
size="md"
disabled={!isFormValid() || isSubmitting}
style={{
background: `linear-gradient(135deg, ${colors['blue-button']}, #4facfe)`,
background: !isFormValid() || isSubmitting
? 'linear-gradient(135deg, #cccccc, #999999)'
: `linear-gradient(135deg, ${colors['blue-button']}, #4facfe)`,
color: '#fff',
boxShadow: '0 4px 15px rgba(79, 172, 254, 0.4)',
}}

14
src/app/admin/(dashboard)/landing-page/desa-anti-korupsi/list-desa-anti-korupsi/[id]/edit/page.tsx
View File

@@ -36,6 +36,15 @@ export default function EditDesaAntiKorupsi() {
const [isSubmitting, setIsSubmitting] = useState(false);
// Check if form is valid
const isFormValid = () => {
return (
formData.name?.trim() !== '' &&
formData.kategoriId?.trim() !== '' &&
(formData.fileId?.trim() !== '' || file !== null)
);
};
const [originalData, setOriginalData] = useState({
name: "",
deskripsi: "",
@@ -287,8 +296,11 @@ export default function EditDesaAntiKorupsi() {
onClick={handleSubmit}
radius="md"
size="md"
disabled={!isFormValid() || isSubmitting}
style={{
background: `linear-gradient(135deg, ${colors['blue-button']}, #4facfe)`,
background: !isFormValid() || isSubmitting
? 'linear-gradient(135deg, #cccccc, #999999)'
: `linear-gradient(135deg, ${colors['blue-button']}, #4facfe)`,
color: '#fff',
boxShadow: '0 4px 15px rgba(79, 172, 254, 0.4)',
}}

14
src/app/admin/(dashboard)/landing-page/desa-anti-korupsi/list-desa-anti-korupsi/create/page.tsx
View File

@@ -31,6 +31,15 @@ export default function CreateDesaAntiKorupsi() {
const [file, setFile] = useState<File | null>(null);
const [isSubmitting, setIsSubmitting] = useState(false);
// Check if form is valid
const isFormValid = () => {
return (
file !== null &&
stateKorupsi.create.form.name?.trim() !== '' &&
stateKorupsi.create.form.kategoriId?.trim() !== ''
);
};
useEffect(() => {
stateKorupsi.findMany.load();
korupsiState.kategoriDesaAntiKorupsi.findMany.load();
@@ -238,8 +247,11 @@ export default function CreateDesaAntiKorupsi() {
onClick={handleSubmit}
radius="md"
size="md"
disabled={!isFormValid() || isSubmitting}
style={{
background: `linear-gradient(135deg, ${colors['blue-button']}, #4facfe)`,
background: !isFormValid() || isSubmitting
? 'linear-gradient(135deg, #cccccc, #999999)'
: `linear-gradient(135deg, ${colors['blue-button']}, #4facfe)`,
color: '#fff',
boxShadow: '0 4px 15px rgba(79, 172, 254, 0.4)',
}}