src/redux-store/index.ts

@@ -9,6 +9,7 @@ import orderReducer from '@/redux-store/slices/order'
 import productRecipeReducer from '@/redux-store/slices/productRecipe'
 import organizationReducer from '@/redux-store/slices/organization'
 import userReducer from '@/redux-store/slices/user'
+import vendorReducer from '@/redux-store/slices/vendor'
 
 export const store = configureStore({
   reducer: {
@@ -19,7 +20,8 @@ export const store = configureStore({
     orderReducer,
     productRecipeReducer,
     organizationReducer,
-    userReducer
+    userReducer,
+    vendorReducer
   },
   middleware: getDefaultMiddleware => getDefaultMiddleware({ serializableCheck: false })
 })

src/redux-store/slices/vendor.ts

@@ -0,0 +1,43 @@
+// Third-party Imports
+import type { PayloadAction } from '@reduxjs/toolkit'
+import { createSlice } from '@reduxjs/toolkit'
+
+// Type Imports
+
+// Data Imports
+import { Vendor } from '../../types/services/vendor'
+
+const initialState: { currentVendor: Vendor } = {
+  currentVendor: {
+    id: '',
+    organization_id: '',
+    name: '',
+    email: '',
+    phone_number: '',
+    address: '',
+    contact_person: '',
+    tax_number: '',
+    payment_terms: '',
+    notes: '',
+    is_active: true,
+    created_at: '',
+    updated_at: ''
+  }
+}
+
+export const VendorSlice = createSlice({
+  name: 'vendor',
+  initialState,
+  reducers: {
+    setVendor: (state, action: PayloadAction<Vendor>) => {
+      state.currentVendor = action.payload
+    },
+    resetVendor: state => {
+      state.currentVendor = initialState.currentVendor
+    }
+  }
+})
+
+export const { setVendor, resetVendor } = VendorSlice.actions
+
+export default VendorSlice.reducer

src/views/apps/vendor/list/VendorListTable.tsx

@@ -184,7 +184,7 @@ const VendorListTable = () => {
           <div className='flex items-center gap-4'>
             <div className='flex flex-col'>
               <Link href={getLocalizedUrl(`/apps/vendor/detail`, locale as Locale)}>
-                <Typography color='primary' className='font-medium cursor-pointer hover:underline'>
+                <Typography className='font-medium cursor-pointer hover:underline text-primary'>
                   {row.original.contact_person}
                 </Typography>
               </Link>