diff --git a/component/customdropdown/customdropdown.templ b/component/customdropdown/customdropdown.templ
new file mode 100644
index 0000000..af2def0
--- /dev/null
+++ b/component/customdropdown/customdropdown.templ
@@ -0,0 +1,22 @@
+package customdropdown;
+
+import (
+	"cpone/layout"
+	"cpone/models"
+)
+
+templ MainCustomDropdown(label string, name string, id string, hxTarget string, hxGet string, hxIndicator string, listItem templ.Component) {
+	<div class="form-group">
+		<label for="exampleSelect1">{ label }</label>
+		<select 
+			name={ name } 
+			class="form-control bg-field" 
+			id={ id }
+			hx-get={ hxGet }
+			hx-target={ hxTarget }
+			hx-indicator={ hxIndicator }
+		>
+			@listItem
+		</select>
+	</div>
+}
diff --git a/handlers/dev/mastermenuuser.handlers.go b/handlers/dev/mastermenuuser.handlers.go
new file mode 100644
index 0000000..85d6168
--- /dev/null
+++ b/handlers/dev/mastermenuuser.handlers.go
@@ -0,0 +1,429 @@
+package dev_handlers
+
+import (
+	"fmt"
+	"math"
+
+	"strconv"
+
+	"cpone/component/pagination"
+	tablecomponent "cpone/component/table"
+	"cpone/models"
+	"cpone/utils"
+	mastermenuuser "cpone/views/dev/mastermenuuser"
+	mastermenuusergroup "cpone/views/dev/mastermenuusergroup"
+
+	services "cpone/services/dev"
+
+	"github.com/a-h/templ"
+	"github.com/labstack/echo/v4"
+	"go.uber.org/zap"
+
+	breadcrumbadmin "cpone/component/breadcrumbadmin"
+	customtextfieldsearch "cpone/component/customtextfieldsearch"
+	navbarmenu "cpone/component/navbar"
+	sidebaruserprofile "cpone/component/sidebar_user_profile"
+)
+
+type MasterMenuUserService interface {
+	GetMasterMenus() ([]services.MasterMenu, error)
+	GetUserGroup() ([]models.UserGroup, error)
+	// try
+	GetListMasterUser() ([]models.MasterUser, error)
+	GetListBreadCrumb(title string) (models.BreadCrumbV1, error)
+
+	GetListMasterUserBySearch(search string) ([]models.MasterUser, error)
+	GetListMasterUserPagination(search string, currentPage int, rowPerPage int) ([]models.MasterUser, error)
+	GetListMasterUserFilteredBySearch(search string) ([]models.MasterUser, error)
+}
+
+func NewMasterMenuUserHandler(us MasterMenuUserService) *MasterMenuUserHandler {
+	return &MasterMenuUserHandler{
+		MasterMenuUserService: us,
+	}
+}
+
+type MasterMenuUserHandler struct {
+	MasterMenuUserService MasterMenuUserService
+}
+
+func (uh *MasterMenuUserHandler) View(c echo.Context, cmp templ.Component) error {
+	c.Response().Header().Set(echo.HeaderContentType, echo.MIMETextHTML)
+
+	return cmp.Render(c.Request().Context(), c.Response().Writer)
+}
+
+func (lh *MasterMenuUserHandler) HandlerShowBreadCrumbV1(c echo.Context) error {
+	logger, _ := zap.NewProduction()
+	paramTitleBreadcrumbConvert := "Master User"
+
+	dataBreadCrumb, err := lh.MasterMenuUserService.GetListBreadCrumb(paramTitleBreadcrumbConvert)
+	fmt.Println(dataBreadCrumb)
+	fmt.Println(err)
+	if err != nil {
+		defer logger.Sync()
+		logger.Info("ERROR BREADCRUMB DEV",
+			zap.Any("error", err),
+		)
+		fmt.Println(dataBreadCrumb)
+		return err
+	}
+
+	// si := mastermenuusergroup.ListMasterUserGroupInitial(dataBreadCrumb)
+
+	defer logger.Sync()
+	logger.Info("LOAD BREADCRUMB DEV",
+		zap.Any("data", dataBreadCrumb),
+	)
+
+	// si := breadcrumbadmin.MainBreadcrumbAdminV1(dataBreadCrumb)
+
+	si := mastermenuusergroup.ShowMasterMenuUserGroupV1(
+		"Master Menu",
+		breadcrumbadmin.MainBreadcrumbAdminV1(dataBreadCrumb),
+		mastermenuusergroup.CssMasterMenuUserGroupV1(),
+		mastermenuusergroup.JsMasterMenuUserGroupV1(),
+	)
+
+	return lh.View(c, si)
+}
+
+// try
+func (lh *MasterMenuUserHandler) HandlerShowMasterMenuUserV1(c echo.Context) error {
+	// var toastComponent templ.Component
+	contentIDHtmxExtension := utils.GenerateRandomID("htmxExtmgu")
+
+	logger, _ := zap.NewProduction()
+	dataMenu, err := lh.MasterMenuUserService.GetMasterMenus()
+	fmt.Println(dataMenu)
+	fmt.Println(err)
+	if err != nil {
+		fmt.Println(dataMenu)
+		return err
+	}
+
+	dataUser, err := services.GetUser()
+	fmt.Println(dataUser)
+	fmt.Println(err)
+	if err != nil {
+		fmt.Println(dataUser)
+		return err
+	}
+
+	rowPerPage := 2
+	dataMasterUser, err := lh.MasterMenuUserService.GetListMasterUserPagination("", 1, rowPerPage)
+	fmt.Println(dataMasterUser)
+	fmt.Println(err)
+	if err != nil {
+		defer logger.Sync()
+		logger.Info("ERROR LIST USER MASTER DEV",
+			zap.Any("error", err),
+		)
+		fmt.Println(dataMasterUser)
+		return err
+	}
+
+	dataUserMasterAll, err := lh.MasterMenuUserService.GetListMasterUser()
+	fmt.Println(dataUserMasterAll)
+	fmt.Println(err)
+	if err != nil {
+		defer logger.Sync()
+		logger.Info("ERROR LIST USER MASTER ALL DEV",
+			zap.Any("error", err),
+		)
+		fmt.Println(dataUserMasterAll)
+		return err
+	}
+
+	// si := mastermenuusergroup.ListMasterUserGroupInitial(dataMasterUser)
+
+	defer logger.Sync()
+	logger.Info("LOAD USER GROUP DEV",
+		zap.Any("data", dataMasterUser),
+	)
+
+	// si := mastermenuusergroup.ListMasterUserGroupInitial(dataMasterUser)
+
+	// si := mastermenuusergroup.ShowMasterMenuUserGroupV1(
+	// 	"Master Menu",
+	// 	mastermenuusergroup.ListMasterUserGroupInitial(dataMasterUser),
+	// 	mastermenuusergroup.CssMasterMenuUserGroupV1(),
+	// 	mastermenuusergroup.JsMasterMenuUserGroupV1(),
+	// )
+
+	contentID := utils.GenerateRandomID("tablebody")
+
+	paramTitleBreadcrumbConvert := "Master User"
+
+	dataBreadCrumb, err := lh.MasterMenuUserService.GetListBreadCrumb(paramTitleBreadcrumbConvert)
+	fmt.Println(dataBreadCrumb)
+	fmt.Println(err)
+	if err != nil {
+		defer logger.Sync()
+		logger.Info("ERROR BREADCRUMB DEV",
+			zap.Any("error", err),
+		)
+		fmt.Println(dataBreadCrumb)
+		return err
+	}
+
+	// si := mastermenuusergroup.ListMasterUserGroupInitial(dataBreadCrumb)
+
+	defer logger.Sync()
+	logger.Info("LOAD BREADCRUMB DEV",
+		zap.Any("data", dataBreadCrumb),
+	)
+
+	// navbar menu
+	navbarmenuComponent := navbarmenu.NavbarMenu(dataMenu)
+
+	// navbar user
+	navbaruserComponent := navbarmenu.Navbar(dataUser)
+
+	// sidebar
+	sidebaruserprofileComponent := sidebaruserprofile.Navbaruserprofile(dataUser)
+
+	// inputan search
+	// inputansearchComponent := customtextfieldsearch.MainCustomTextFieldSearchV1("q", "Cari User Group", "text", "/dev/searchuserv1", "input changed delay:500ms, search", "#idbaru", "#indicator")
+
+	contentIDSearch := utils.GenerateRandomID("qsearch")
+	totalPages := int(math.Ceil(float64(len(dataUserMasterAll)) / float64(rowPerPage)))
+	link := "currentPage=1&page=" + strconv.Itoa(totalPages) + "&contentID=" + contentID
+
+	inputansearchComponent := customtextfieldsearch.MainCustomTextFieldSearchV1("#"+contentIDSearch, "q", "Cari User Group", "text", "/dev/searchuserv1?"+link, "input changed delay:500ms, search", "#"+contentID, "#indicator", "", contentIDHtmxExtension)
+
+	// toast
+	// contentIDToast := utils.GenerateRandomID("toastmgu")
+	// toastComponent = customtoast.CustomToastV1("", contentIDHtmxExtension)
+
+	// table user group
+
+	searchQueryParam := "&q="
+	tabelusergroupComponent := tablecomponent.TableV2(
+		[]string{"USERNAME", "NAMA STAFF", "USER GROUP", "AKSI"},
+		[]string{"20%", "40%", "20%", "20%"},
+		mastermenuuser.TableRowMasterUserV1(dataMasterUser),
+		pagination.PaginationV1(totalPages, 1, "/dev/userv1pagination", contentID, searchQueryParam),
+		contentID,
+		inputansearchComponent,
+	)
+
+	si := mastermenuusergroup.ShowMasterMenuUserGroupV1x(
+		"Master Menu",
+		mastermenuusergroup.ContentMasterMenuUserGroupV1(
+			contentID,
+			breadcrumbadmin.MainBreadcrumbAdminV1(dataBreadCrumb),
+			tabelusergroupComponent,
+			inputansearchComponent,
+			// toastComponent,
+			// contentIDToast,
+		),
+
+		mastermenuusergroup.CssMasterMenuUserGroupV1x(),
+		mastermenuusergroup.JSkuV1(),
+		navbarmenuComponent,
+		navbaruserComponent,
+		sidebaruserprofileComponent,
+	)
+
+	return utils.View(c, si)
+}
+
+func (lh *MasterMenuUserHandler) HandlerShowMasterMenuUserSearchV1(c echo.Context) error {
+	search := c.QueryParam("q")
+	logger, _ := zap.NewProduction()
+
+	// dataUserMaster, err := lh.MasterMenuUserService.GetListMasterUserBySearch(search)
+	rowPerPage := 2
+	pageparam := c.QueryParam("page")
+	page, err := strconv.Atoi(pageparam)
+	if err != nil {
+		defer logger.Sync()
+		logger.Info("ERROR CONVERT PAGE PARAM",
+			zap.Any("page", page),
+			zap.Any("error ", err),
+		)
+		return err
+	}
+
+	currentPageParam := c.QueryParam("currentPage")
+	currentPage, err := strconv.Atoi(currentPageParam)
+	if err != nil {
+		defer logger.Sync()
+		logger.Info("ERROR CONVERT CURRENT PAGE PARAM",
+			zap.Any("page", page),
+			zap.Any("error ", err),
+		)
+		return err
+	}
+
+	dataUserMaster, err := lh.MasterMenuUserService.GetListMasterUserPagination(search, currentPage, rowPerPage)
+	fmt.Println(dataUserMaster)
+	fmt.Println(err)
+	if err != nil {
+		defer logger.Sync()
+		logger.Info("ERROR SEARCH USER MASTER DEV",
+			zap.Any("error", err),
+			zap.Any("search param", search),
+		)
+		fmt.Println(dataUserMaster)
+		return err
+	}
+
+	defer logger.Sync()
+	logger.Info("LOAD USER MASTER DEV BY SEARCH",
+		zap.Any("data", dataUserMaster),
+	)
+
+	// data user filtered
+	dataUserMasterFiltered, err := lh.MasterMenuUserService.GetListMasterUserFilteredBySearch(search)
+	fmt.Println(dataUserMasterFiltered)
+	fmt.Println(err)
+	if err != nil {
+		defer logger.Sync()
+		logger.Info("ERROR SEARCH USER MASTER FILTERED BY SEARCH DEV",
+			zap.Any("error", err),
+			zap.Any("search param", search),
+		)
+		fmt.Println(dataUserMasterFiltered)
+		return err
+	}
+
+	defer logger.Sync()
+	logger.Info("LOAD SEARCH USER MASTER FILTERED BY SEARCH DEV",
+		zap.Any("data", dataUserMasterFiltered),
+	)
+	// si := mastermenuusergroup.ListMasterUserGroupInitial(dataUserMaster)
+
+	contentID := utils.GenerateRandomID("tablebody")
+
+	// tabelusergroupComponent := mastermenuusergroup.TableRowV1(dataUserMaster)
+	totalPages := int(math.Ceil(float64(len(dataUserMasterFiltered)) / float64(rowPerPage)))
+	searchQueryParam := "&q=" + search
+
+	// contentIDSearch := utils.GenerateRandomID("qsearch")
+	// link := "currentPage=1&page=" + strconv.Itoa(totalPages) + "&contentID=" + contentID
+
+	// contentIDHtmxExtension := utils.GenerateRandomID("htmxExtmgu")
+	// inputansearchComponent := customtextfieldsearch.MainCustomTextFieldSearchV1("#"+contentIDSearch, "q", "Cari User Group", "text", "/dev/searchuserv1?"+link, "input changed delay:500ms, search", "#"+contentID, "#indicator", search, contentIDHtmxExtension)
+
+	inputansearchComponent := tablecomponent.DivEmpty()
+	tabelusergroupComponent := tablecomponent.TableV2(
+		[]string{"USERNAME", "NAMA STAFF", "USER GROUP", "AKSI"},
+		[]string{"20%", "40%", "20%", "20%"},
+		mastermenuuser.TableRowMasterUserV1(dataUserMaster),
+		pagination.PaginationV1(totalPages, 1, "/dev/userv1pagination", contentID, searchQueryParam),
+		contentID,
+		inputansearchComponent,
+	)
+
+	si := tabelusergroupComponent
+
+	return utils.View(c, si)
+}
+
+func (lh *MasterMenuUserHandler) HandlerShowMasterMenuUserPaginationV1(c echo.Context) error {
+	logger, _ := zap.NewProduction()
+
+	search := c.QueryParam("q")
+	pageparam := c.QueryParam("page")
+	page, err := strconv.Atoi(pageparam)
+	if err != nil {
+		defer logger.Sync()
+		logger.Info("ERROR CONVERT PAGE PARAM",
+			zap.Any("page", page),
+			zap.Any("error ", err),
+		)
+		return err
+	}
+
+	dataUserMasterAll, err := lh.MasterMenuUserService.GetListMasterUser()
+	fmt.Println(dataUserMasterAll)
+	fmt.Println(err)
+	if err != nil {
+		defer logger.Sync()
+		logger.Info("ERROR LIST USER MASTER ALL DEV",
+			zap.Any("error", err),
+		)
+		fmt.Println(dataUserMasterAll)
+		return err
+	}
+
+	currentPageParam := c.QueryParam("currentPage")
+	currentPage, err := strconv.Atoi(currentPageParam)
+	if err != nil {
+		defer logger.Sync()
+		logger.Info("ERROR CONVERT CURRENT PAGE PARAM",
+			zap.Any("page", page),
+			zap.Any("error ", err),
+		)
+		return err
+	}
+
+	rowPerPage := 2
+	dataUserMaster, err := lh.MasterMenuUserService.GetListMasterUserPagination(search, currentPage, rowPerPage)
+	fmt.Println(dataUserMaster)
+	fmt.Println(err)
+	if err != nil {
+		defer logger.Sync()
+		logger.Info("ERROR SEARCH USER MASTER DEV",
+			zap.Any("error", err),
+			zap.Any("search param", search),
+		)
+		fmt.Println(dataUserMaster)
+		return err
+	}
+
+	// si := mastermenuusergroup.ListMasterUserGroupInitial(dataUserMaster)
+
+	defer logger.Sync()
+	logger.Info("LOAD USER MASTER DEV BY SEARCH",
+		zap.Any("data", dataUserMaster),
+	)
+
+	// data user filtered
+	dataUserMasterFiltered, err := lh.MasterMenuUserService.GetListMasterUserFilteredBySearch(search)
+	fmt.Println(dataUserMasterFiltered)
+	fmt.Println(err)
+	if err != nil {
+		defer logger.Sync()
+		logger.Info("ERROR SEARCH USER MASTER FILTERED BY SEARCH DEV",
+			zap.Any("error", err),
+			zap.Any("search param", search),
+		)
+		fmt.Println(dataUserMasterFiltered)
+		return err
+	}
+
+	defer logger.Sync()
+	logger.Info("LOAD SEARCH USER MASTER FILTERED BY SEARCH DEV",
+		zap.Any("data", dataUserMasterFiltered),
+	)
+
+	contentID := utils.GenerateRandomID("tablebody")
+
+	// table user group
+	searchQueryParam := "&q=" + search
+	totalPages := int(math.Ceil(float64(len(dataUserMasterFiltered)) / float64(rowPerPage)))
+	// contentIDSearch := utils.GenerateRandomID("qsearch")
+	// link := "currentPage=1&page=" + strconv.Itoa(totalPages) + "&contentID=" + contentID
+
+	// contentIDHtmxExtension := utils.GenerateRandomID("htmxExtmgu")
+	// inputansearchComponent := customtextfieldsearch.MainCustomTextFieldSearchV1("#"+contentIDSearch, "q", "Cari User Group", "text", "/dev/searchuserv1?"+link, "input changed delay:500ms, search", "#"+contentID, "#indicator", search, contentIDHtmxExtension)
+
+	inputansearchComponent := tablecomponent.DivEmpty()
+	tabelusergroupComponent := tablecomponent.TableV2(
+		[]string{"KODE", "USERGROUP", "AKSI"},
+		[]string{"40%", "40%", "20%"},
+		mastermenuuser.TableRowMasterUserV1(dataUserMaster),
+		pagination.PaginationV1(totalPages, currentPage, "/dev/userv1pagination", contentID, searchQueryParam),
+		contentID,
+		inputansearchComponent,
+	)
+
+	// tabelusergroupComponent := mastermenuusergroup.TableRowV1(dataUserMaster)
+
+	si := tabelusergroupComponent
+
+	return utils.View(c, si)
+}
diff --git a/handlers/routes.go b/handlers/routes.go
index 5f25680..7586bb2 100644
--- a/handlers/routes.go
+++ b/handlers/routes.go
@@ -204,4 +204,11 @@ func SetupRoutesDev(app *echo.Echo, appStore db.AppStore) {
 
 	// clientgroup.GET("/usergroup/edit", mastermenuusergroupHandler.ChangeFormEdit)
 	// clientgroup.GET("/usergroup/pagination", mastermenuusergroupHandler.HandleChangePage)
+
+	// master user
+	devUserServices := dev_services.NewServicesMasterMenuUser(appStore)
+	devUserhandlers := dev_handlers.NewMasterMenuUserHandler(devUserServices)
+	dev.GET("/userv1", devUserhandlers.HandlerShowMasterMenuUserV1)
+	dev.GET("/searchuserv1", devUserhandlers.HandlerShowMasterMenuUserSearchV1)
+	dev.GET("/userv1pagination", devUserhandlers.HandlerShowMasterMenuUserPaginationV1)
 }
diff --git a/models/masteruser.models.go b/models/masteruser.models.go
new file mode 100644
index 0000000..e607050
--- /dev/null
+++ b/models/masteruser.models.go
@@ -0,0 +1,23 @@
+package models
+
+type MasterUser struct {
+	Nomor                   string `db:"nomor"`
+	M_UserID                int    `db:"M_UserID"`
+	M_UserEmail             string `db:"M_UserEmail"`
+	M_UserFullName          string `db:"M_UserFullName"`
+	M_UserLastAccess        string `db:"M_UserLastAccess"`
+	M_UserIsLoggedIn        string `db:"M_UserIsLoggedIn"`
+	M_UserActiveToken       string `db:"M_UserActiveToken"`
+	M_UserExpiredToken      string `db:"M_UserExpiredToken"`
+	M_UserIsActive          string `db:"M_UserIsActive"`
+	M_UserCreated           string `db:"M_UserCreated"`
+	M_UserCreatedUserID     int    `db:"M_UserCreatedUserID"`
+	M_UserLastUpdated       string `db:"M_UserLastUpdated"`
+	M_UserLastUpdatedUserID int    `db:"M_UserLastUpdatedUserID"`
+	M_UserDeletedUserID     int    `db:"M_UserDeletedUserID"`
+	M_UserDeleted           string `db:"M_UserDeleted"`
+	M_UserM_UserGroupID     int    `db:"M_UserM_UserGroupID"`
+	M_UserGroupID           int    `db:"M_UserGroupID"`
+	M_UserGroupCode         string `db:"M_UserGroupCode"`
+	M_UserGroupName         string `db:"M_UserGroupName"`
+}
diff --git a/services/dev/mastermenuuser.services.go b/services/dev/mastermenuuser.services.go
new file mode 100644
index 0000000..7665d4d
--- /dev/null
+++ b/services/dev/mastermenuuser.services.go
@@ -0,0 +1,801 @@
+package dev_services
+
+import (
+	"cpone/db"
+	"cpone/models"
+	"fmt"
+
+	dbx "cpone/package/database"
+
+	"go.uber.org/zap"
+)
+
+func NewServicesMasterMenuUser(uStore db.AppStore) *ServicesMasterMenuUser {
+
+	return &ServicesMasterMenuUser{
+
+		MasterMenuUserStore: uStore,
+	}
+}
+
+type ServicesMasterMenuUser struct {
+	MasterMenuUserStore db.AppStore
+}
+
+func (su *ServicesMasterMenuUser) GetMasterMenus() ([]MasterMenu, error) {
+
+	// dummyBreadcrumb := []Breadcrumb{
+	// 	{
+	// 		Name: "Dashboard",
+	// 		Url:  "/client/dashboard",
+	// 	},
+	// 	{
+	// 		Name: "Front Office",
+	// 		Url:  "/client/usermanagement",
+	// 	},
+	// }
+
+	dummyMenu := []MasterMenu{
+		// 1. Dashboard
+		{
+			ID:             "1",
+			ParentMenuID:   "0",
+			ParentMenuName: "Dashboard",
+			ParentUrl:      "/client/md/dashboard",
+			ParentIcon:     "",
+			Children: []ChildrenMenu{
+				{
+					ChildrenParentID: "1",
+					ChildrenMenuID:   "1",
+					ChildrenMenuName: "Master User",
+					ChildrenMenuURL:  "/client/md/user",
+					// Breadcrumb: []Breadcrumb{
+					// 	{
+					// 		IDBreadcrumb: "1",
+					// 		Title:        "Dashboard",
+					// 		IsActive:     "Y",
+					// 	},
+					// },
+				},
+			},
+		},
+
+		// 2. Front Office
+		{
+			ID:             "2",
+			ParentMenuID:   "1",
+			ParentMenuName: "Front Office",
+			ParentUrl:      "#",
+			ParentIcon:     "",
+			Children: []ChildrenMenu{
+				{
+					ChildrenParentID: "1",
+					ChildrenMenuID:   "1",
+					ChildrenMenuName: "Registrasi",
+					ChildrenMenuURL:  "/fo/registrasi",
+					// Breadcrumb: []Breadcrumb{
+					// 	{
+					// 		IDBreadcrumb: "1",
+					// 		Title:        "Dashboard",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "2",
+					// 		Title:        "Master",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "3",
+					// 		Title:        "User",
+					// 		IsActive:     "Y",
+					// 	},
+					// },
+				},
+			},
+		},
+
+		// 3. Station
+		{
+			ID:             "3",
+			ParentMenuID:   "2",
+			ParentMenuName: "Station",
+			ParentUrl:      "#",
+			ParentIcon:     "",
+			Children: []ChildrenMenu{
+				{
+					ChildrenParentID: "2",
+					ChildrenMenuID:   "1",
+					ChildrenMenuName: "Sample Station",
+					ChildrenMenuURL:  "/station/sample",
+					// Breadcrumb: []Breadcrumb{
+					// 	{
+					// 		IDBreadcrumb: "1",
+					// 		Title:        "Dashboard",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "2",
+					// 		Title:        "Master",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "3",
+					// 		Title:        "User",
+					// 		IsActive:     "Y",
+					// 	},
+					// },
+				},
+			},
+		},
+
+		// 4. Management MCU
+		{
+			ID:             "4",
+			ParentMenuID:   "3",
+			ParentMenuName: "Management MCU",
+			ParentUrl:      "#",
+			ParentIcon:     "",
+			Children: []ChildrenMenu{
+				{
+					ChildrenParentID: "3",
+					ChildrenMenuID:   "1",
+					ChildrenMenuName: "Setup MCU",
+					ChildrenMenuURL:  "/mcu/setup",
+					// Breadcrumb: []Breadcrumb{
+					// 	{
+					// 		IDBreadcrumb: "1",
+					// 		Title:        "Dashboard",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "2",
+					// 		Title:        "Master",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "3",
+					// 		Title:        "User",
+					// 		IsActive:     "Y",
+					// 	},
+					// },
+				},
+				{
+					ChildrenParentID: "3",
+					ChildrenMenuID:   "2",
+					ChildrenMenuName: "Pre-Registrasi",
+					ChildrenMenuURL:  "/mcu/preregister",
+					// Breadcrumb: []Breadcrumb{
+					// 	{
+					// 		IDBreadcrumb: "1",
+					// 		Title:        "Dashboard",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "2",
+					// 		Title:        "Master",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "3",
+					// 		Title:        "User",
+					// 		IsActive:     "Y",
+					// 	},
+					// },
+				},
+			},
+		},
+
+		// 5. Master Data
+		{
+			ID:             "5",
+			ParentMenuID:   "4",
+			ParentMenuName: "Master Data",
+			ParentUrl:      "#",
+			ParentIcon:     "",
+			Children: []ChildrenMenu{
+				// * Master User
+				{
+					ChildrenParentID: "4",
+					ChildrenMenuID:   "1",
+					ChildrenMenuName: "Master User",
+					ChildrenMenuURL:  "/client/md/user",
+					// Breadcrumb: []Breadcrumb{
+					// 	{
+					// 		IDBreadcrumb: "1",
+					// 		Title:        "Dashboard",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "2",
+					// 		Title:        "Master",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "3",
+					// 		Title:        "User",
+					// 		IsActive:     "Y",
+					// 	},
+					// },
+				},
+
+				// * Master User Group
+				{
+					ChildrenParentID: "4",
+					ChildrenMenuID:   "2",
+					ChildrenMenuName: "Master User Group",
+					ChildrenMenuURL:  "/client/md/usergroup",
+					// Breadcrumb: []Breadcrumb{
+					// 	{
+					// 		IDBreadcrumb: "1",
+					// 		Title:        "Dashboard",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "2",
+					// 		Title:        "Master",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "3",
+					// 		Title:        "User Group",
+					// 		IsActive:     "Y",
+					// 	},
+					// },
+				},
+
+				// * Master Corporate
+				{
+					ChildrenParentID: "4",
+					ChildrenMenuID:   "3",
+					ChildrenMenuName: "Corporate",
+					ChildrenMenuURL:  "/client/md/corp",
+					// Breadcrumb: []Breadcrumb{
+					// 	{
+					// 		IDBreadcrumb: "1",
+					// 		Title:        "Dashboard",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "2",
+					// 		Title:        "Master",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "3",
+					// 		Title:        "User Group",
+					// 		IsActive:     "Y",
+					// 	},
+					// },
+				},
+
+				// * Test
+				{
+					ChildrenParentID: "4",
+					ChildrenMenuID:   "4",
+					ChildrenMenuName: "Test",
+					ChildrenMenuURL:  "/client/md/test",
+					// Breadcrumb: []Breadcrumb{
+					// 	{
+					// 		IDBreadcrumb: "1",
+					// 		Title:        "Dashboard",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "2",
+					// 		Title:        "Master",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "3",
+					// 		Title:        "User Group",
+					// 		IsActive:     "Y",
+					// 	},
+					// },
+				},
+
+				// * Bahan
+				{
+					ChildrenParentID: "4",
+					ChildrenMenuID:   "5",
+					ChildrenMenuName: "Bahan",
+					ChildrenMenuURL:  "/client/md/bahan",
+					// Breadcrumb: []Breadcrumb{
+					// 	{
+					// 		IDBreadcrumb: "1",
+					// 		Title:        "Dashboard",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "2",
+					// 		Title:        "Master",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "3",
+					// 		Title:        "User Group",
+					// 		IsActive:     "Y",
+					// 	},
+					// },
+				},
+
+				// * Sample Type
+				{
+					ChildrenParentID: "4",
+					ChildrenMenuID:   "6",
+					ChildrenMenuName: "Sample Type",
+					ChildrenMenuURL:  "/client/sample/type",
+					// Breadcrumb: []Breadcrumb{
+					// 	{
+					// 		IDBreadcrumb: "1",
+					// 		Title:        "Dashboard",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "2",
+					// 		Title:        "Master",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "3",
+					// 		Title:        "User Group",
+					// 		IsActive:     "Y",
+					// 	},
+					// },
+				},
+
+				// * Sample Station
+				{
+					ChildrenParentID: "4",
+					ChildrenMenuID:   "7",
+					ChildrenMenuName: "Sample Station",
+					ChildrenMenuURL:  "/station/sample",
+					// Breadcrumb: []Breadcrumb{
+					// 	{
+					// 		IDBreadcrumb: "1",
+					// 		Title:        "Dashboard",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "2",
+					// 		Title:        "Master",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "3",
+					// 		Title:        "User Group",
+					// 		IsActive:     "Y",
+					// 	},
+					// },
+				},
+
+				// * Result Non Lab
+				{
+					ChildrenParentID: "4",
+					ChildrenMenuID:   "8",
+					ChildrenMenuName: "Result Non Lab",
+					ChildrenMenuURL:  "/client/md/resultnonlab",
+					// Breadcrumb: []Breadcrumb{
+					// 	{
+					// 		IDBreadcrumb: "1",
+					// 		Title:        "Dashboard",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "2",
+					// 		Title:        "Master",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "3",
+					// 		Title:        "User Group",
+					// 		IsActive:     "Y",
+					// 	},
+					// },
+				},
+
+				// * Template Fisik
+				{
+					ChildrenParentID: "4",
+					ChildrenMenuID:   "9",
+					ChildrenMenuName: "Template Fisik",
+					ChildrenMenuURL:  "/client/md/template-fisik",
+					// Breadcrumb: []Breadcrumb{
+					// 	{
+					// 		IDBreadcrumb: "1",
+					// 		Title:        "Dashboard",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "2",
+					// 		Title:        "Master",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "3",
+					// 		Title:        "User Group",
+					// 		IsActive:     "Y",
+					// 	},
+					// },
+				},
+
+				// * Pasien
+				{
+					ChildrenParentID: "4",
+					ChildrenMenuID:   "10",
+					ChildrenMenuName: "Pasien",
+					ChildrenMenuURL:  "/client/md/pasien",
+					// Breadcrumb: []Breadcrumb{
+					// 	{
+					// 		IDBreadcrumb: "1",
+					// 		Title:        "Dashboard",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "2",
+					// 		Title:        "Master",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "3",
+					// 		Title:        "User Group",
+					// 		IsActive:     "Y",
+					// 	},
+					// },
+				},
+
+				// * Dokter
+				{
+					ChildrenParentID: "4",
+					ChildrenMenuID:   "11",
+					ChildrenMenuName: "Dokter",
+					ChildrenMenuURL:  "/client/md/dokter",
+					// Breadcrumb: []Breadcrumb{
+					// 	{
+					// 		IDBreadcrumb: "1",
+					// 		Title:        "Dashboard",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "2",
+					// 		Title:        "Master",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "3",
+					// 		Title:        "User Group",
+					// 		IsActive:     "Y",
+					// 	},
+					// },
+				},
+
+				// * Paket
+				{
+					ChildrenParentID: "4",
+					ChildrenMenuID:   "12",
+					ChildrenMenuName: "Paket",
+					ChildrenMenuURL:  "/client/md/paket",
+					// Breadcrumb: []Breadcrumb{
+					// 	{
+					// 		IDBreadcrumb: "1",
+					// 		Title:        "Dashboard",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "2",
+					// 		Title:        "Master",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "3",
+					// 		Title:        "User Group",
+					// 		IsActive:     "Y",
+					// 	},
+					// },
+				},
+
+				// * Harga Single
+				{
+					ChildrenParentID: "4",
+					ChildrenMenuID:   "13",
+					ChildrenMenuName: "Harga Single",
+					ChildrenMenuURL:  "/client/md/hargasingle",
+					// Breadcrumb: []Breadcrumb{
+					// 	{
+					// 		IDBreadcrumb: "1",
+					// 		Title:        "Dashboard",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "2",
+					// 		Title:        "Master",
+					// 		IsActive:     "N",
+					// 	},
+					// 	{
+					// 		IDBreadcrumb: "3",
+					// 		Title:        "User Group",
+					// 		IsActive:     "Y",
+					// 	},
+					// },
+				},
+			},
+		},
+	}
+
+	return dummyMenu, nil
+}
+
+func (ug *ServicesMasterMenuUser) GetUserGroup() ([]models.UserGroup, error) {
+	data := []models.UserGroup{
+		{UserGroupID: 1, UserGroupKode: "A", UserGroupName: "UG1"},
+		{UserGroupID: 2, UserGroupKode: "B", UserGroupName: "UG2"},
+		{UserGroupID: 3, UserGroupKode: "C", UserGroupName: "UG3"},
+	}
+	return data, nil
+}
+
+func (su *ServicesMasterMenuUser) GetListBreadCrumb(title string) (models.BreadCrumbV1, error) {
+	var ret models.BreadCrumbV1
+
+	dummyBreadcrumb := []models.BreadCrumbV1{
+		{
+			Title: "Master User Group",
+			Item: []models.ItemBreadCrumbV1{
+				{
+					Item: "Dashboard",
+					Url:  "/dev/dashboard",
+				},
+				{
+					Item: "Master",
+					Url:  "/dev/master",
+				},
+				{
+					Item: "User Group",
+					Url:  "",
+				},
+			},
+		},
+
+		{
+			Title: "Master User",
+			Item: []models.ItemBreadCrumbV1{
+				{
+					Item: "Dashboard",
+					Url:  "/dev/dashboard",
+				},
+				{
+					Item: "Master",
+					Url:  "/dev/master",
+				},
+				{
+					Item: "User",
+					Url:  "",
+				},
+			},
+		},
+	}
+
+	for _, breadcrumb := range dummyBreadcrumb {
+		// if utils.Contains(breadcrumb.Title, title) {
+		// 	ret = breadcrumb
+		// 	return ret, nil
+		// }
+		if breadcrumb.Title == title {
+			ret = breadcrumb
+			return ret, nil
+		}
+	}
+
+	return ret, nil
+}
+
+// try
+func (su *ServicesMasterMenuUser) GetListMasterUser() ([]models.MasterUser, error) {
+	var userList []models.MasterUser
+
+	query := `
+		SELECT 
+			ROW_NUMBER() OVER () AS nomor,
+			IFNULL(M_UserEmail, '') AS M_UserEmail,
+			IFNULL(M_UserFullName, '') AS M_UserFullName,
+			IFNULL(M_UserLastAccess, '') AS M_UserLastAccess,
+			IFNULL(M_UserIsLoggedIn, '') AS M_UserIsLoggedIn,
+			IFNULL(M_UserActiveToken, '') AS M_UserActiveToken,
+			IFNULL(M_UserExpiredToken, '') AS M_UserExpiredToken,
+			IFNULL(M_UserIsActive, '') AS M_UserIsActive,
+			IFNULL(M_UserCreated, '') AS M_UserCreated,
+			IFNULL(M_UserCreatedUserID, '') AS M_UserCreatedUserID,
+			IFNULL(M_UserLastUpdated, '') AS M_UserLastUpdated,
+			IFNULL(M_UserLastUpdatedUserID, '') AS M_UserLastUpdatedUserID,
+			IFNULL(M_UserDeletedUserID, '') AS M_UserDeletedUserID,
+			IFNULL(M_UserDeleted, '') AS M_UserDeleted,
+			IFNULL(M_UserGroupCode, '') AS M_UserGroupCode,
+			IFNULL(M_UserGroupName, '') AS M_UserGroupName,
+			IFNULL(M_UserM_UserGroupID, '') AS M_UserM_UserGroupID,
+			IFNULL(M_UserGroupID, '') AS M_UserGroupID
+		FROM 
+			m_user 
+		JOIN m_usergroup
+		ON M_UserM_UserGroupID = M_UserGroupID
+		AND M_UserIsActive = 'Y'
+		AND M_UserGroupIsActive = 'Y'
+		ORDER BY M_UserGroupID ASC
+	`
+
+	if err := dbx.Handlex.Select(&userList, query); err != nil {
+		return nil, fmt.Errorf("error querying database: %v", err)
+	}
+
+	return userList, nil
+}
+
+func (su *ServicesMasterMenuUser) GetListMasterUserFilteredBySearch(search string) ([]models.MasterUser, error) {
+	var userList []models.MasterUser
+
+	query := `
+		SELECT 
+			ROW_NUMBER() OVER () AS nomor,
+			M_UserID,
+			IFNULL(M_UserEmail, '') AS M_UserEmail,
+			IFNULL(M_UserFullName, '') AS M_UserFullName,
+			IFNULL(M_UserLastAccess, '') AS M_UserLastAccess,
+			IFNULL(M_UserIsLoggedIn, '') AS M_UserIsLoggedIn,
+			IFNULL(M_UserActiveToken, '') AS M_UserActiveToken,
+			IFNULL(M_UserExpiredToken, '') AS M_UserExpiredToken,
+			IFNULL(M_UserIsActive, '') AS M_UserIsActive,
+			IFNULL(M_UserCreated, '') AS M_UserCreated,
+			IFNULL(M_UserCreatedUserID, '') AS M_UserCreatedUserID,
+			IFNULL(M_UserLastUpdated, '') AS M_UserLastUpdated,
+			IFNULL(M_UserLastUpdatedUserID, '') AS M_UserLastUpdatedUserID,
+			IFNULL(M_UserDeletedUserID, '') AS M_UserDeletedUserID,
+			IFNULL(M_UserDeleted, '') AS M_UserDeleted,
+			IFNULL(M_UserGroupCode, '') AS M_UserGroupCode,
+			IFNULL(M_UserGroupName, '') AS M_UserGroupName,
+			IFNULL(M_UserM_UserGroupID, '') AS M_UserM_UserGroupID,
+			IFNULL(M_UserGroupID, '') AS M_UserGroupID
+		FROM 
+			m_user 
+		JOIN m_usergroup
+		ON M_UserM_UserGroupID = M_UserGroupID
+		AND M_UserIsActive = 'Y'
+		AND M_UserGroupIsActive = 'Y'
+	`
+
+	// check jika parameter search nya tidak kosong
+	if search != "" {
+		query += fmt.Sprintf(" AND (M_UserFullName LIKE '%%%s%%' OR M_UserEmail LIKE '%%%s%%')", search, search)
+	} else {
+		search = "%%"
+	}
+
+	query += fmt.Sprintf(" ORDER BY M_UserGroupID  ASC")
+
+	logger, _ := zap.NewProduction()
+	defer logger.Sync()
+	logger.Info("QUERY SEARCH ONlY FOR COUNT TOTAL PAGES PAGINATION",
+		zap.String("query search", query),
+	)
+
+	if err := dbx.Handlex.Select(&userList, query); err != nil {
+		return nil, fmt.Errorf("error querying database: %v", err)
+	}
+
+	return userList, nil
+}
+
+func (su *ServicesMasterMenuUser) GetListMasterUserBySearch(search string) ([]models.MasterUser, error) {
+	var userList []models.MasterUser
+
+	query := `
+		SELECT 
+			ROW_NUMBER() OVER () AS nomor,
+			M_UserID,
+			IFNULL(M_UserEmail, '') AS M_UserEmail,
+			IFNULL(M_UserFullName, '') AS M_UserFullName,
+			IFNULL(M_UserLastAccess, '') AS M_UserLastAccess,
+			IFNULL(M_UserIsLoggedIn, '') AS M_UserIsLoggedIn,
+			IFNULL(M_UserActiveToken, '') AS M_UserActiveToken,
+			IFNULL(M_UserExpiredToken, '') AS M_UserExpiredToken,
+			IFNULL(M_UserIsActive, '') AS M_UserIsActive,
+			IFNULL(M_UserCreated, '') AS M_UserCreated,
+			IFNULL(M_UserCreatedUserID, '') AS M_UserCreatedUserID,
+			IFNULL(M_UserLastUpdated, '') AS M_UserLastUpdated,
+			IFNULL(M_UserLastUpdatedUserID, '') AS M_UserLastUpdatedUserID,
+			IFNULL(M_UserDeletedUserID, '') AS M_UserDeletedUserID,
+			IFNULL(M_UserDeleted, '') AS M_UserDeleted,
+			IFNULL(M_UserGroupCode, '') AS M_UserGroupCode,
+			IFNULL(M_UserGroupName, '') AS M_UserGroupName,
+			IFNULL(M_UserM_UserGroupID, '') AS M_UserM_UserGroupID,
+			IFNULL(M_UserGroupID, '') AS M_UserGroupID
+		FROM 
+			m_user 
+		JOIN m_usergroup
+		ON M_UserM_UserGroupID = M_UserGroupID
+		AND M_UserIsActive = 'Y'
+		AND M_UserGroupIsActive = 'Y'
+	`
+
+	// fmt.Errorf(search)
+	rowPerPage := 2
+	offset := 0
+
+	// check jika parameter search nya tidak kosong
+	if search != "" {
+		query += fmt.Sprintf(" AND (M_UserFullName LIKE '%%%s%%' OR M_UserEmail LIKE '%%%s%%')", search, search)
+	} else {
+		search = "%%"
+	}
+
+	// query += " ORDER BY M_UserGroupID ASC"
+	query += fmt.Sprintf(" ORDER BY M_UserGroupID ASC LIMIT %d OFFSET %d", rowPerPage, offset)
+
+	logger, _ := zap.NewProduction()
+	defer logger.Sync()
+	logger.Info("QUERY SEARCH ONlY AND SETTING LIMIT",
+		zap.String("query search", query),
+	)
+
+	if err := dbx.Handlex.Select(&userList, query); err != nil {
+		return nil, fmt.Errorf("error querying database: %v", err)
+	}
+
+	return userList, nil
+}
+
+func (su *ServicesMasterMenuUser) GetListMasterUserPagination(search string, currentPage int, rowPerPage int) ([]models.MasterUser, error) {
+	var userList []models.MasterUser
+
+	query := `
+		SELECT 
+			ROW_NUMBER() OVER () AS nomor,
+			M_UserID,
+			IFNULL(M_UserEmail, '') AS M_UserEmail,
+			IFNULL(M_UserFullName, '') AS M_UserFullName,
+			IFNULL(M_UserLastAccess, '') AS M_UserLastAccess,
+			IFNULL(M_UserIsLoggedIn, '') AS M_UserIsLoggedIn,
+			IFNULL(M_UserActiveToken, '') AS M_UserActiveToken,
+			IFNULL(M_UserExpiredToken, '') AS M_UserExpiredToken,
+			IFNULL(M_UserIsActive, '') AS M_UserIsActive,
+			IFNULL(M_UserCreated, '') AS M_UserCreated,
+			IFNULL(M_UserCreatedUserID, '') AS M_UserCreatedUserID,
+			IFNULL(M_UserLastUpdated, '') AS M_UserLastUpdated,
+			IFNULL(M_UserLastUpdatedUserID, '') AS M_UserLastUpdatedUserID,
+			IFNULL(M_UserDeletedUserID, '') AS M_UserDeletedUserID,
+			IFNULL(M_UserDeleted, '') AS M_UserDeleted,
+			IFNULL(M_UserGroupCode, '') AS M_UserGroupCode,
+			IFNULL(M_UserGroupName, '') AS M_UserGroupName,
+			IFNULL(M_UserM_UserGroupID, '') AS M_UserM_UserGroupID,
+			IFNULL(M_UserGroupID, '') AS M_UserGroupID
+		FROM 
+			m_user 
+		JOIN m_usergroup
+		ON M_UserM_UserGroupID = M_UserGroupID
+		AND M_UserIsActive = 'Y'
+		AND M_UserGroupIsActive = 'Y'
+	`
+
+	// rmaxPerPage := 2
+	// rpage := (currentPage - 1) * rmaxPerPage
+
+	offset := (currentPage - 1) * rowPerPage
+	// offset := currentPage
+
+	if search != "" {
+		query += fmt.Sprintf(" AND (M_UserEmail LIKE '%%%s%%' OR M_UserFullName LIKE '%%%s%%')", search, search)
+	} else {
+		search = "%%"
+	}
+
+	query += fmt.Sprintf(" ORDER BY M_UserGroupID ASC LIMIT %d OFFSET %d", rowPerPage, offset)
+
+	logger, _ := zap.NewProduction()
+	defer logger.Sync()
+	logger.Info("QUERY SEARCH WITH PAGINATION",
+		zap.String("query search", query),
+	)
+
+	if err := dbx.Handlex.Select(&userList, query); err != nil {
+		return nil, fmt.Errorf("error querying database: %v", err)
+	}
+
+	return userList, nil
+}
diff --git a/views/dev/mastermenuuser/mastermenuuser.templ b/views/dev/mastermenuuser/mastermenuuser.templ
new file mode 100644
index 0000000..f08eafa
--- /dev/null
+++ b/views/dev/mastermenuuser/mastermenuuser.templ
@@ -0,0 +1,230 @@
+package mastermenuuser
+
+import (
+	"cpone/layout"
+	"cpone/models"
+	"cpone/component/modal"
+	"strconv"
+)
+
+// "cpone/component/sidebar_user_profile"
+templ ContentMasterMenuUserV1(contentID string, breadcrumb templ.Component, tablecontent templ.Component, inputanSearch templ.Component) {
+	<div class="container-fluid">
+		<div class="row align-items-center mb-10">
+			<div class="col-md-10 col-sm-12 p-0 ">
+				@breadcrumb
+			</div>
+			<div class="col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none">
+				// <div class="d-block align-items-center">
+				<div class="d-flex justify-content-end">
+					<button
+						type="button"
+						class="btn btn-primary"
+						data-toggle="modal"
+						data-target="#dialogNew"
+					>Add New</button>
+				</div>
+			</div>
+			<div class="col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5">
+				<button type="button" class="btn btn-primary btn-block">Add New</button>
+			</div>
+		</div>
+		// table content
+		@tablecontent
+		<div class="d-flex justify-content-center text-primary">
+			<div class="htmx-indicator spinner-border" role="status" id="indicator">
+				<span class="sr-only"></span>
+			</div>
+		</div>
+		@modalcomponent.Modal("dialogNew", "New - User", DialogNewBody("", ""), DialogNewAction(), BtnCloseNew())
+		@modalcomponent.Modal("dialogEdit", "Edit - User", DialogEditBody("", ""), DialogEditAction(), BtnCloseNew())
+		@JSkuMasterUserV1()
+	</div>
+}
+
+templ TableRowMasterUserV1(data []models.MasterUser) {
+	// /usergroup/edit
+	// <a
+	// 	id="btneditug"
+	// 	type="button"
+	// 	class="btneditusgp col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2"
+	// 	onclick="htmx.trigger('#btneditug', 'htmx:abort')"
+	// 	hx-target="#modalbdyEdit"
+	// 	hx-swap="innerHTML"
+	// 	hx-get={ "/client/usergroup/edit?id=" + strconv.Itoa(v.UserGroupID) }
+	// 	hx-on::before-request="ShowLoading()"
+	// 	hx-on::after-request="ShowForm()"
+	// 	data-toggle="modal"
+	// 	data-target="#dialogEdit"
+	// >
+	// 	Edit
+	// </a>
+	if len(data) == 0 {
+		<tr>
+			<td colspan="4" class="text-center">Data Tidak Ditemukan</td>
+		</tr>
+	}
+	for _, v := range data {
+		<tr>
+			<td>{ v.M_UserEmail }</td>
+			<td>{ v.M_UserFullName }</td>
+            <td>{ v.M_UserGroupName }</td>
+			<td>
+				<div class="row px-5 d-flex justify-content-around">
+					<a
+						id="btneditug"
+						type="button"
+						class="btneditusgp col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2"
+						data-toggle="modal"
+						data-target={ "#dialogEdit" + strconv.Itoa(v.M_UserID) }
+					>
+						Edit
+					</a>
+					<a
+						type="button"
+						class="col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2"
+						data-toggle="modal"
+						data-target={ "#dialogDelete" + strconv.Itoa(v.M_UserID) }
+					>Hapus</a>
+					@modalcomponent.Modal("dialogEdit"+strconv.Itoa(v.M_UserID),
+						"Edit - User",
+						DialogEditBody(v.M_UserGroupCode, v.M_UserGroupName),
+						DialogEditAction(),
+						BtnCloseNew())
+					@modalcomponent.ModalConfirmation(
+						"dialogDelete"+strconv.Itoa(v.M_UserID),
+						"Konfirmasi",
+						"Apakah anda yakin menghapus user berikut ?", BtnCloseDeleteMasterUserV1(),
+						[]string{"Email", "Nama Staff", "User Group"}, []string{v.M_UserEmail, v.M_UserFullName, v.M_UserGroupName}, DialogDeleteMasterUserActionV1())
+				</div>
+			</td>
+		</tr>
+	}
+}
+
+templ DialogDeleteMasterUserActionV1() {
+	<div>
+		<button
+			type="button"
+			class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
+			data-dismiss="modal"
+		>
+			Batal
+		</button>
+		<button
+			type="button"
+			class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
+		>
+			Yakin
+		</button>
+	</div>
+}
+
+templ BtnCloseDeleteMasterUserV1() {
+	<button
+		type="button"
+		class="close"
+		data-dismiss="modal"
+		aria-label="Close"
+	>
+		<i aria-hidden="true" class="ki ki-close"></i>
+	</button>
+}
+
+templ JSkuMasterUserV1() {
+	<script>
+		 function ShowLoading(evt) {
+        document
+          .getElementById("modalLoadEdit")
+          .setAttribute("style", "display:block !important;");
+        document
+          .getElementById("modalbdyEdit")
+          .setAttribute("style", "display:none !important;");
+		  console.log(evt);
+      }
+      function ShowForm() {
+        document
+          .getElementById("modalLoadEdit")
+          .setAttribute("style", "display:none !important;");
+        document
+          .getElementById("modalbdyEdit")
+          .setAttribute("style", "display:block !important;;");
+      }
+	</script>
+}
+
+templ PaginationMasterUserV1() {
+	<div class="d-flex justify-content-between align-items-center flex-wrap">
+		<div class="d-flex flex-wrap py-2 mr-3">
+			<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-double-arrow-back icon-xs"></i></a>
+			<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-arrow-back icon-xs"></i></a>
+			<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">...</a>
+			<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">23</a>
+			<a href="#" class="btn btn-icon btn-sm border-0 btn-light btn-hover-primary active mr-2 my-1">24</a>
+			<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">25</a>
+			<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">26</a>
+			<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">27</a>
+			<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">28</a>
+			<a href="#" class="btn btn-icon btn-sm border-0 btn-light mr-2 my-1">...</a>
+			<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-arrow-next icon-xs"></i></a>
+			<a href="#" class="btn btn-icon btn-sm btn-light mr-2 my-1"><i class="ki ki-bold-double-arrow-next icon-xs"></i></a>
+		</div>
+	</div>
+}
+
+templ CssMasterMenuUserV1x() {
+	<link
+		rel="stylesheet"
+		href="assets/css/googlefont/poppins.css"
+	/>
+	<link
+		rel="stylesheet"
+		href="assets/css/googlefont/publicsans.css"
+	/>
+	<link
+		rel="stylesheet"
+		href="assets/css/googlefont/roboto.css"
+	/>
+	<style>
+    body {
+      background-color: white;
+      /* padding-right: 100px;
+            padding-left: 100px; */
+    }
+    #div-chart {
+        /* overflow-x: scroll; */
+        margin: 40px 10vw 40px 10vw;
+    }
+    .title {
+        font-size:20px;
+        font-weight: bold;
+    }
+    #title {
+        font-weight: 600;
+    }
+    
+</style>
+}
+
+templ JsMasterMenuUserV1x() {
+}
+
+// for item dropdown
+templ ItemDropdown(dataDropdown []models.UserGroupV1) {
+    if len(dataDropdown) == 0 {
+        <option value="0" disabled selected>Tidak Ada Data</option>
+    } else {
+        for _, v := range dataDropdown {
+            <option value={ v.M_UserGroupID } >{ v.M_UserGroupName }</option>
+        }
+    }
+}
+
+templ ShowMasterMenuUserV1x(title string, cmp templ.Component, css templ.Component, js templ.Component,
+	navbarmenu templ.Component,
+	navbaruser templ.Component,
+	userprofile templ.Component) {
+	@layout.CorporateLayout(title, css, js, navbarmenu, navbaruser, userprofile) {
+		@cmp
+	}
+}
diff --git a/views/dev/mastermenuuser/mastermenuuser_templ.go b/views/dev/mastermenuuser/mastermenuuser_templ.go
new file mode 100644
index 0000000..72ce865
--- /dev/null
+++ b/views/dev/mastermenuuser/mastermenuuser_templ.go
@@ -0,0 +1,374 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.2.663
+package mastermenuuser
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import "context"
+import "io"
+import "bytes"
+
+import (
+	"cpone/component/modal"
+	"cpone/layout"
+	"cpone/models"
+	"strconv"
+)
+
+// "cpone/component/sidebar_user_profile"
+func ContentMasterMenuUserV1(contentID string, breadcrumb templ.Component, tablecontent templ.Component, inputanSearch templ.Component) templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
+		if !templ_7745c5c3_IsBuffer {
+			templ_7745c5c3_Buffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"container-fluid\"><div class=\"row align-items-center mb-10\"><div class=\"col-md-10 col-sm-12 p-0 \">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = breadcrumb.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div><div class=\"col-md-2 d-none d-lg-block d-xl-block d-md-block d-sm-none\"><div class=\"d-flex justify-content-end\"><button type=\"button\" class=\"btn btn-primary\" data-toggle=\"modal\" data-target=\"#dialogNew\">Add New</button></div></div><div class=\"col-md-2 d-block d-lg-none d-xl-none d-md-none d-sm-block justify-content-center px-5\"><button type=\"button\" class=\"btn btn-primary btn-block\">Add New</button></div></div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = tablecontent.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"d-flex justify-content-center text-primary\"><div class=\"htmx-indicator spinner-border\" role=\"status\" id=\"indicator\"><span class=\"sr-only\"></span></div></div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = modalcomponent.Modal("dialogNew", "New - User", DialogNewBody("", ""), DialogNewAction(), BtnCloseNew()).Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = modalcomponent.Modal("dialogEdit", "Edit - User", DialogEditBody("", ""), DialogEditAction(), BtnCloseNew()).Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = JSkuMasterUserV1().Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if !templ_7745c5c3_IsBuffer {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func TableRowMasterUserV1(data []models.MasterUser) templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
+		if !templ_7745c5c3_IsBuffer {
+			templ_7745c5c3_Buffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var2 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var2 == nil {
+			templ_7745c5c3_Var2 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		if len(data) == 0 {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<tr><td colspan=\"4\" class=\"text-center\">Data Tidak Ditemukan</td></tr>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		for _, v := range data {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<tr><td>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(v.M_UserEmail)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `views\dev\mastermenuuser\mastermenuuser.templ`, Line: 69, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</td><td>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(v.M_UserFullName)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `views\dev\mastermenuuser\mastermenuuser.templ`, Line: 70, Col: 25}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</td><td>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(v.M_UserGroupName)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `views\dev\mastermenuuser\mastermenuuser.templ`, Line: 71, Col: 35}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</td><td><div class=\"row px-5 d-flex justify-content-around\"><a id=\"btneditug\" type=\"button\" class=\"btneditusgp col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-tosca mb-2\" data-toggle=\"modal\" data-target=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs("#dialogEdit" + strconv.Itoa(v.M_UserID))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `views\dev\mastermenuuser\mastermenuuser.templ`, Line: 79, Col: 60}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\">Edit\r</a> <a type=\"button\" class=\"col-12 col-sm-12 col-md-12 col-lg-5 col-xl-5 col-xxl-5 btn btn-light-danger mb-2\" data-toggle=\"modal\" data-target=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs("#dialogDelete" + strconv.Itoa(v.M_UserID))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `views\dev\mastermenuuser\mastermenuuser.templ`, Line: 87, Col: 62}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\">Hapus</a>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = modalcomponent.Modal("dialogEdit"+strconv.Itoa(v.M_UserID),
+				"Edit - User",
+				DialogEditBody(v.M_UserGroupCode, v.M_UserGroupName),
+				DialogEditAction(),
+				BtnCloseNew()).Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = modalcomponent.ModalConfirmation(
+				"dialogDelete"+strconv.Itoa(v.M_UserID),
+				"Konfirmasi",
+				"Apakah anda yakin menghapus user berikut ?", BtnCloseDeleteMasterUserV1(),
+				[]string{"Email", "Nama Staff", "User Group"}, []string{v.M_UserEmail, v.M_UserFullName, v.M_UserGroupName}, DialogDeleteMasterUserActionV1()).Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></td></tr>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if !templ_7745c5c3_IsBuffer {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func DialogDeleteMasterUserActionV1() templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
+		if !templ_7745c5c3_IsBuffer {
+			templ_7745c5c3_Buffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var8 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var8 == nil {
+			templ_7745c5c3_Var8 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div><button type=\"button\" class=\"btn btn-outline-secondary font-weight-bolder rounded-lg mr-4\" data-dismiss=\"modal\">Batal\r</button> <button type=\"button\" class=\"btn btn-primary btn-shadow font-weight-bold rounded-lg\">Yakin\r</button></div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if !templ_7745c5c3_IsBuffer {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func BtnCloseDeleteMasterUserV1() templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
+		if !templ_7745c5c3_IsBuffer {
+			templ_7745c5c3_Buffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var9 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var9 == nil {
+			templ_7745c5c3_Var9 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<button type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-label=\"Close\"><i aria-hidden=\"true\" class=\"ki ki-close\"></i></button>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if !templ_7745c5c3_IsBuffer {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func JSkuMasterUserV1() templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
+		if !templ_7745c5c3_IsBuffer {
+			templ_7745c5c3_Buffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var10 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var10 == nil {
+			templ_7745c5c3_Var10 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<script>\r\n\t\t function ShowLoading(evt) {\r\n        document\r\n          .getElementById(\"modalLoadEdit\")\r\n          .setAttribute(\"style\", \"display:block !important;\");\r\n        document\r\n          .getElementById(\"modalbdyEdit\")\r\n          .setAttribute(\"style\", \"display:none !important;\");\r\n\t\t  console.log(evt);\r\n      }\r\n      function ShowForm() {\r\n        document\r\n          .getElementById(\"modalLoadEdit\")\r\n          .setAttribute(\"style\", \"display:none !important;\");\r\n        document\r\n          .getElementById(\"modalbdyEdit\")\r\n          .setAttribute(\"style\", \"display:block !important;;\");\r\n      }\r\n\t</script>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if !templ_7745c5c3_IsBuffer {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func PaginationMasterUserV1() templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
+		if !templ_7745c5c3_IsBuffer {
+			templ_7745c5c3_Buffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var11 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var11 == nil {
+			templ_7745c5c3_Var11 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"d-flex justify-content-between align-items-center flex-wrap\"><div class=\"d-flex flex-wrap py-2 mr-3\"><a href=\"#\" class=\"btn btn-icon btn-sm btn-light mr-2 my-1\"><i class=\"ki ki-bold-double-arrow-back icon-xs\"></i></a> <a href=\"#\" class=\"btn btn-icon btn-sm btn-light mr-2 my-1\"><i class=\"ki ki-bold-arrow-back icon-xs\"></i></a> <a href=\"#\" class=\"btn btn-icon btn-sm border-0 btn-light mr-2 my-1\">...</a> <a href=\"#\" class=\"btn btn-icon btn-sm border-0 btn-light mr-2 my-1\">23</a> <a href=\"#\" class=\"btn btn-icon btn-sm border-0 btn-light btn-hover-primary active mr-2 my-1\">24</a> <a href=\"#\" class=\"btn btn-icon btn-sm border-0 btn-light mr-2 my-1\">25</a> <a href=\"#\" class=\"btn btn-icon btn-sm border-0 btn-light mr-2 my-1\">26</a> <a href=\"#\" class=\"btn btn-icon btn-sm border-0 btn-light mr-2 my-1\">27</a> <a href=\"#\" class=\"btn btn-icon btn-sm border-0 btn-light mr-2 my-1\">28</a> <a href=\"#\" class=\"btn btn-icon btn-sm border-0 btn-light mr-2 my-1\">...</a> <a href=\"#\" class=\"btn btn-icon btn-sm btn-light mr-2 my-1\"><i class=\"ki ki-bold-arrow-next icon-xs\"></i></a> <a href=\"#\" class=\"btn btn-icon btn-sm btn-light mr-2 my-1\"><i class=\"ki ki-bold-double-arrow-next icon-xs\"></i></a></div></div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if !templ_7745c5c3_IsBuffer {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func CssMasterMenuUserV1x() templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
+		if !templ_7745c5c3_IsBuffer {
+			templ_7745c5c3_Buffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var12 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var12 == nil {
+			templ_7745c5c3_Var12 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<link rel=\"stylesheet\" href=\"assets/css/googlefont/poppins.css\"><link rel=\"stylesheet\" href=\"assets/css/googlefont/publicsans.css\"><link rel=\"stylesheet\" href=\"assets/css/googlefont/roboto.css\"><style>\r\n    body {\r\n      background-color: white;\r\n      /* padding-right: 100px;\r\n            padding-left: 100px; */\r\n    }\r\n    #div-chart {\r\n        /* overflow-x: scroll; */\r\n        margin: 40px 10vw 40px 10vw;\r\n    }\r\n    .title {\r\n        font-size:20px;\r\n        font-weight: bold;\r\n    }\r\n    #title {\r\n        font-weight: 600;\r\n    }\r\n    \r\n</style>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if !templ_7745c5c3_IsBuffer {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func JsMasterMenuUserV1x() templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
+		if !templ_7745c5c3_IsBuffer {
+			templ_7745c5c3_Buffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var13 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var13 == nil {
+			templ_7745c5c3_Var13 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		if !templ_7745c5c3_IsBuffer {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func ShowMasterMenuUserV1x(title string, cmp templ.Component, css templ.Component, js templ.Component,
+	navbarmenu templ.Component,
+	navbaruser templ.Component,
+	userprofile templ.Component) templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
+		if !templ_7745c5c3_IsBuffer {
+			templ_7745c5c3_Buffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var14 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var14 == nil {
+			templ_7745c5c3_Var14 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Var15 := templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
+			if !templ_7745c5c3_IsBuffer {
+				templ_7745c5c3_Buffer = templ.GetBuffer()
+				defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
+			}
+			templ_7745c5c3_Err = cmp.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			if !templ_7745c5c3_IsBuffer {
+				_, templ_7745c5c3_Err = io.Copy(templ_7745c5c3_W, templ_7745c5c3_Buffer)
+			}
+			return templ_7745c5c3_Err
+		})
+		templ_7745c5c3_Err = layout.CorporateLayout(title, css, js, navbarmenu, navbaruser, userprofile).Render(templ.WithChildren(ctx, templ_7745c5c3_Var15), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if !templ_7745c5c3_IsBuffer {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
+		}
+		return templ_7745c5c3_Err
+	})
+}
diff --git a/views/dev/mastermenuuser/modaladduser.templ b/views/dev/mastermenuuser/modaladduser.templ
new file mode 100644
index 0000000..75a5fe5
--- /dev/null
+++ b/views/dev/mastermenuuser/modaladduser.templ
@@ -0,0 +1,56 @@
+package mastermenuuser
+
+import (
+	"cpone/models"
+	"cpone/component/customtextfield"
+)
+
+templ DialogNewBody(code string, name string) {
+	<div id="modalbdy">
+		@customtextfield.CustomTextFieldv2(
+			models.CustomTextFieldv2Prm{
+				Label:       "Kode user group",
+				Name:        "usergroupcode",
+				Placeholder: "Kode user Group",
+				Type:        "text",
+				Value:       code,
+			})
+		@customtextfield.CustomTextFieldv2(
+			models.CustomTextFieldv2Prm{
+				Label:       "Nama User Group",
+				Name:        "usergroupname",
+				Placeholder: "Nama User Group",
+				Type:        "text",
+				Value:       name,
+			})
+	</div>
+}
+
+templ DialogNewAction() {
+	<div>
+		<button
+			type="button"
+			class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
+			data-dismiss="modal"
+		>
+			Batal
+		</button>
+		<button
+			type="button"
+			class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
+		>
+			Save changes
+		</button>
+	</div>
+}
+
+templ BtnCloseNew() {
+	<button
+		type="button"
+		class="close"
+		data-dismiss="modal"
+		aria-label="Close"
+	>
+		<i aria-hidden="true" class="ki ki-close"></i>
+	</button>
+}
diff --git a/views/dev/mastermenuuser/modaladduser_templ.go b/views/dev/mastermenuuser/modaladduser_templ.go
new file mode 100644
index 0000000..95f1fe1
--- /dev/null
+++ b/views/dev/mastermenuuser/modaladduser_templ.go
@@ -0,0 +1,114 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.2.663
+package mastermenuuser
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import "context"
+import "io"
+import "bytes"
+
+import (
+	"cpone/component/customtextfield"
+	"cpone/models"
+)
+
+func DialogNewBody(code string, name string) templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
+		if !templ_7745c5c3_IsBuffer {
+			templ_7745c5c3_Buffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div id=\"modalbdy\">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = customtextfield.CustomTextFieldv2(
+			models.CustomTextFieldv2Prm{
+				Label:       "Kode user group",
+				Name:        "usergroupcode",
+				Placeholder: "Kode user Group",
+				Type:        "text",
+				Value:       code,
+			}).Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = customtextfield.CustomTextFieldv2(
+			models.CustomTextFieldv2Prm{
+				Label:       "Nama User Group",
+				Name:        "usergroupname",
+				Placeholder: "Nama User Group",
+				Type:        "text",
+				Value:       name,
+			}).Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if !templ_7745c5c3_IsBuffer {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func DialogNewAction() templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
+		if !templ_7745c5c3_IsBuffer {
+			templ_7745c5c3_Buffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var2 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var2 == nil {
+			templ_7745c5c3_Var2 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div><button type=\"button\" class=\"btn btn-outline-secondary font-weight-bolder rounded-lg mr-4\" data-dismiss=\"modal\">Batal\r</button> <button type=\"button\" class=\"btn btn-primary btn-shadow font-weight-bold rounded-lg\">Save changes\r</button></div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if !templ_7745c5c3_IsBuffer {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func BtnCloseNew() templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
+		if !templ_7745c5c3_IsBuffer {
+			templ_7745c5c3_Buffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var3 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var3 == nil {
+			templ_7745c5c3_Var3 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<button type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-label=\"Close\"><i aria-hidden=\"true\" class=\"ki ki-close\"></i></button>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if !templ_7745c5c3_IsBuffer {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
+		}
+		return templ_7745c5c3_Err
+	})
+}
diff --git a/views/dev/mastermenuuser/modaledituser.templ b/views/dev/mastermenuuser/modaledituser.templ
new file mode 100644
index 0000000..fe2320d
--- /dev/null
+++ b/views/dev/mastermenuuser/modaledituser.templ
@@ -0,0 +1,79 @@
+package mastermenuuser
+
+import (
+	"cpone/models"
+	"cpone/component/customtextfield"
+)
+
+templ DialogEditForm(code string, name string) {
+	@customtextfield.CustomTextFieldv2(
+		models.CustomTextFieldv2Prm{
+			Label:       "Kode user group",
+			Name:        "usergroupcode",
+			Placeholder: "Kode user Group",
+			Type:        "text",
+			Value:       code,
+		})
+	@customtextfield.CustomTextFieldv2(
+		models.CustomTextFieldv2Prm{
+			Label:       "Nama User Group",
+			Name:        "usergroupname",
+			Placeholder: "Nama User Group",
+			Type:        "text",
+			Value:       name,
+		})
+}
+
+templ DialogEditBody(code string, name string) {
+	<div id="modalbdyEdit">
+		@DialogEditForm(code, name)
+	</div>
+	<div>
+		// <div class="text-center text-primary" id="modalLoadEdit" style="">
+		// 	<div class="spinner-border" role="status"></div>
+		// </div>
+	</div>
+}
+
+templ LoadingSpinner() {
+	<div id="modalbdyEdit">
+		<div class="text-center text-primary">
+			<div class="spinner-border" role="status"></div>
+		</div>
+	</div>
+}
+
+templ DialogEditAction() {
+	<div>
+		<button
+			id="btledit"
+			type="button"
+			hx-swap="delete"
+			hx-target="#modalbdyEdit"
+			onclick="htmx.trigger('.btneditusgp', 'htmx:abort')"
+			class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4"
+			data-dismiss="modal"
+		>
+			Batal
+		</button>
+		<button
+			type="button"
+			class="btn btn-primary btn-shadow font-weight-bold rounded-lg"
+		>
+			Save changes
+		</button>
+	</div>
+}
+
+templ BtnCloseEdit() {
+	<button
+		type="button"
+		class="close"
+		data-dismiss="modal"
+		aria-label="Close"
+		hx-target="#modalbdyEdit"
+		onclick="htmx.trigger('.btneditusgp', 'htmx:abort')"
+	>
+		<i aria-hidden="true" class="ki ki-close"></i>
+	</button>
+}
diff --git a/views/dev/mastermenuuser/modaledituser_templ.go b/views/dev/mastermenuuser/modaledituser_templ.go
new file mode 100644
index 0000000..6c3eb72
--- /dev/null
+++ b/views/dev/mastermenuuser/modaledituser_templ.go
@@ -0,0 +1,162 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.2.663
+package mastermenuuser
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import "context"
+import "io"
+import "bytes"
+
+import (
+	"cpone/component/customtextfield"
+	"cpone/models"
+)
+
+func DialogEditForm(code string, name string) templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
+		if !templ_7745c5c3_IsBuffer {
+			templ_7745c5c3_Buffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = customtextfield.CustomTextFieldv2(
+			models.CustomTextFieldv2Prm{
+				Label:       "Kode user group",
+				Name:        "usergroupcode",
+				Placeholder: "Kode user Group",
+				Type:        "text",
+				Value:       code,
+			}).Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = customtextfield.CustomTextFieldv2(
+			models.CustomTextFieldv2Prm{
+				Label:       "Nama User Group",
+				Name:        "usergroupname",
+				Placeholder: "Nama User Group",
+				Type:        "text",
+				Value:       name,
+			}).Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if !templ_7745c5c3_IsBuffer {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func DialogEditBody(code string, name string) templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
+		if !templ_7745c5c3_IsBuffer {
+			templ_7745c5c3_Buffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var2 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var2 == nil {
+			templ_7745c5c3_Var2 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div id=\"modalbdyEdit\">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = DialogEditForm(code, name).Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div><div></div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if !templ_7745c5c3_IsBuffer {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func LoadingSpinner() templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
+		if !templ_7745c5c3_IsBuffer {
+			templ_7745c5c3_Buffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var3 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var3 == nil {
+			templ_7745c5c3_Var3 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div id=\"modalbdyEdit\"><div class=\"text-center text-primary\"><div class=\"spinner-border\" role=\"status\"></div></div></div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if !templ_7745c5c3_IsBuffer {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func DialogEditAction() templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
+		if !templ_7745c5c3_IsBuffer {
+			templ_7745c5c3_Buffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var4 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var4 == nil {
+			templ_7745c5c3_Var4 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div><button id=\"btledit\" type=\"button\" hx-swap=\"delete\" hx-target=\"#modalbdyEdit\" onclick=\"htmx.trigger(&#39;.btneditusgp&#39;, &#39;htmx:abort&#39;)\" class=\"btn btn-outline-secondary font-weight-bolder rounded-lg mr-4\" data-dismiss=\"modal\">Batal\r</button> <button type=\"button\" class=\"btn btn-primary btn-shadow font-weight-bold rounded-lg\">Save changes\r</button></div>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if !templ_7745c5c3_IsBuffer {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
+		}
+		return templ_7745c5c3_Err
+	})
+}
+
+func BtnCloseEdit() templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
+		if !templ_7745c5c3_IsBuffer {
+			templ_7745c5c3_Buffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var5 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var5 == nil {
+			templ_7745c5c3_Var5 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<button type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-label=\"Close\" hx-target=\"#modalbdyEdit\" onclick=\"htmx.trigger(&#39;.btneditusgp&#39;, &#39;htmx:abort&#39;)\"><i aria-hidden=\"true\" class=\"ki ki-close\"></i></button>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if !templ_7745c5c3_IsBuffer {
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
+		}
+		return templ_7745c5c3_Err
+	})
+}