dst/dstpabuaran.com
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: update PhoneNumberInput usage in Customer and Supplier components for improved code clarity

Browse Source
This commit is contained in:
Yoga Pangestu 2026-08-02 12:04:56 +07:00
parent 6e165d95c4
commit 3039396192
3 changed files with 13 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
resources/js/components/phone-number-input.tsx
View File

@ -1,9 +1,9 @@
import { useCallback, useRef, useState } from 'react';
import { Input } from '@/components/ui/input';
import { useCallback, useRef, useState } from 'react';
type PhoneNumberInputProps = {
name?: string;
defaultValue?: string;
defaultValue?: string | null;
placeholder?: string;
disabled?: boolean;
className?: string;
@ -20,7 +20,7 @@ function formatPhone(value: string | null | undefined): string {
export function PhoneNumberInput({
name,
defaultValue = '',
defaultValue = null,
placeholder = '0812 3456 7890',
disabled = false,
className,

21
resources/js/pages/admin/master/customer/index.tsx
View File

@ -1,9 +1,6 @@
import { Form, Head, router } from '@inertiajs/react';
import { Plus } from 'lucide-react';
import { useCallback, useState } from 'react';
import { ConfirmDialog } from '@/components/confirm-dialog';
import { DataTable } from '@/components/data-table';
import type { PaginationState } from '@/components/data-table';
import { DataTable } from '@/components/data-table';
import InputError from '@/components/input-error';
import { PhoneNumberInput } from '@/components/phone-number-input';
import { Button } from '@/components/ui/button';
@ -22,6 +19,9 @@ import {
store,
update,
} from '@/routes/admin/master/customers';
import { Form, Head, router } from '@inertiajs/react';
import { Plus } from 'lucide-react';
import { useCallback, useState } from 'react';
import type { Customer } from './columns';
import { createCustomerColumns } from './columns';
@ -275,18 +275,7 @@ export default function CustomerIndex({ customers }: Props) {
<Label htmlFor="edit-phone_number">
No. Telepon
</Label>
<Input
id="edit-phone_number"
name="phone_number"
type="tel"
inputMode="numeric"
pattern="[0-9]*"
placeholder="Masukkan nomor telepon"
defaultValue={
editing.phone_number ??
''
}
/>
<PhoneNumberInput name="phone_number" defaultValue={editing.phone_number} />
<InputError
message={
errors.phone_number

21
resources/js/pages/admin/master/supplier/index.tsx
View File

@ -1,9 +1,6 @@
import { Form, Head, router } from '@inertiajs/react';
import { Plus } from 'lucide-react';
import { useCallback, useState } from 'react';
import { ConfirmDialog } from '@/components/confirm-dialog';
import { DataTable } from '@/components/data-table';
import type { PaginationState } from '@/components/data-table';
import { DataTable } from '@/components/data-table';
import InputError from '@/components/input-error';
import { PhoneNumberInput } from '@/components/phone-number-input';
import { Button } from '@/components/ui/button';
@ -22,6 +19,9 @@ import {
index as supplierIndex,
update,
} from '@/routes/admin/master/suppliers';
import { Form, Head, router } from '@inertiajs/react';
import { Plus } from 'lucide-react';
import { useCallback, useState } from 'react';
import type { Supplier } from './columns';
import { createSupplierColumns } from './columns';
@ -275,18 +275,7 @@ export default function SupplierIndex({ suppliers }: Props) {
<Label htmlFor="edit-phone_number">
No. Telepon
</Label>
<Input
id="edit-phone_number"
name="phone_number"
type="tel"
inputMode="numeric"
pattern="[0-9]*"
placeholder="Masukkan nomor telepon"
defaultValue={
editing.phone_number ??
''
}
/>
<PhoneNumberInput name="phone_number" defaultValue={editing.phone_number} />
<InputError
message={
errors.phone_number