legalgonews/legalgo-FE-reactrouter
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: typo & remove readonly on form input

Browse Source
This commit is contained in:
fredy.siswanto 2025-03-08 00:28:26 +07:00
parent 50fdd6bc02
commit 3a81e7b3db
2 changed files with 9 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
app/pages/dashboard-category-create/index.tsx
View File

@ -1,5 +1,5 @@
import { zodResolver } from '@hookform/resolvers/zod'
import { useEffect, useState, type ChangeEvent } from 'react'
import { useEffect, useState } from 'react'
import { useFetcher, useNavigate } from 'react-router'
import { RemixFormProvider, useRemixForm } from 'remix-hook-form'
import { z } from 'zod'
@ -7,7 +7,6 @@ import { z } from 'zod'
import { Button } from '~/components/ui/button'
import { Input } from '~/components/ui/input'
import { TitleDashboard } from '~/components/ui/title-dashboard'
import { urlFriendlyCode } from '~/utils/formatter'
export const createCategorySchema = z.object({
code: z.string().min(3, 'Kode minimal 3 karakter'),
@ -25,8 +24,6 @@ export const CreateCategoryPage = () => {
})
const [error, setError] = useState<string>()
const [disabled, setDisabled] = useState(false)
const [code, setCode] = useState<string>('')
const [name, setName] = useState<string>('')
const { handleSubmit } = formMethods
@ -42,15 +39,9 @@ export const CreateCategoryPage = () => {
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [fetcher])
const handelCodeAuto = (name: ChangeEvent<HTMLInputElement>) => {
const inputName = name.target.value
setName(inputName)
setCode(urlFriendlyCode(inputName))
}
return (
<div className="relative">
<TitleDashboard title="Buat Kategory" />
<TitleDashboard title="Buat Kategori" />
<div>
<RemixFormProvider {...formMethods}>
<fetcher.Form
@ -65,25 +56,21 @@ export const CreateCategoryPage = () => {
<div className="flex items-end justify-between gap-4">
<Input
id="name"
label="Nama Kategory"
placeholder="Masukkan Nama Kategory"
label="Nama Kategori"
placeholder="Masukkan Nama Kategori"
name="name"
onChange={handelCodeAuto}
className="border-0 bg-white shadow focus:ring-1 focus:ring-[#2E2F7C] focus:outline-none"
labelClassName="text-sm font-medium text-[#363636]"
containerClassName="flex-1"
value={name}
/>
<Input
id="code"
label="Kode Kategory"
readOnly
placeholder="Masukkan Kode Kategory"
label="Kode Kategori"
placeholder="Masukkan Kode Kategori"
name="code"
className="border-0 bg-gray-100 shadow focus:ring-1 focus:ring-[#2E2F7C] focus:outline-none"
className="border-0 bg-white shadow focus:ring-1 focus:ring-[#2E2F7C] focus:outline-none"
labelClassName="text-sm font-medium text-[#363636]"
containerClassName="flex-1"
value={code}
/>
<Button
disabled={disabled}

17
app/pages/dashboard-tags-create/index.tsx
View File

@ -1,5 +1,5 @@
import { zodResolver } from '@hookform/resolvers/zod'
import { useEffect, useState, type ChangeEvent } from 'react'
import { useEffect, useState } from 'react'
import { useFetcher, useNavigate } from 'react-router'
import { RemixFormProvider, useRemixForm } from 'remix-hook-form'
import { z } from 'zod'
@ -7,7 +7,6 @@ import { z } from 'zod'
import { Button } from '~/components/ui/button'
import { Input } from '~/components/ui/input'
import { TitleDashboard } from '~/components/ui/title-dashboard'
import { urlFriendlyCode } from '~/utils/formatter'
export const createTagsSchema = z.object({
code: z.string().min(3, 'Kode minimal 3 karakter'),
@ -25,8 +24,6 @@ export const CreateTagsPage = () => {
})
const [error, setError] = useState<string>()
const [disabled, setDisabled] = useState(false)
const [code, setCode] = useState<string>('')
const [name, setName] = useState<string>('')
const { handleSubmit } = formMethods
@ -42,12 +39,6 @@ export const CreateTagsPage = () => {
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [fetcher])
const handelCodeAuto = (name: ChangeEvent<HTMLInputElement>) => {
const inputName = name.target.value
setName(inputName)
setCode(urlFriendlyCode(name.target.value))
}
return (
<div className="relative">
<TitleDashboard title="Buat Tag" />
@ -68,22 +59,18 @@ export const CreateTagsPage = () => {
label="Nama Tag"
placeholder="Masukkan Nama Tag"
name="name"
onChange={handelCodeAuto}
className="border-0 bg-white shadow focus:ring-1 focus:ring-[#2E2F7C] focus:outline-none"
labelClassName="text-sm font-medium text-[#363636]"
containerClassName="flex-1"
value={name}
/>
<Input
id="code"
label="Kode Tag"
readOnly
placeholder="Masukkan Kode Tag"
name="code"
className="border-0 bg-gray-100 shadow focus:ring-1 focus:ring-[#2E2F7C] focus:outline-none"
className="border-0 bg-white shadow focus:ring-1 focus:ring-[#2E2F7C] focus:outline-none"
labelClassName="text-sm font-medium text-[#363636]"
containerClassName="flex-1"
value={code}
/>
<Button
disabled={disabled}