feat: actions for services and categories

src/app/services/components/shared/ServicesTable/ServicesTable.tsx

@@ -6,6 +6,7 @@ import useServicesOuterTableColumns from "@/app/services/components/shared/Servi
 import { GroupedServices } from "@/app/services/components/shared/ServicesTable/types/GroupedServices";
 import { useServicesContext } from "@/app/services/contexts/ServicesContext";
 import BaseTable from "@/components/ui/BaseTable/BaseTable";
+import useIsMobile from "@/hooks/utils/useIsMobile";
 import { ServiceType } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/types/service";
 
 type Props = {
@@ -14,6 +15,7 @@ type Props = {
 
 const ServicesTable: FC<Props> = ({ serviceType }) => {
     const { servicesList } = useServicesContext();
+    const isMobile = useIsMobile();
 
     const [expandedCategoryIds, setExpandedCategoryIds] = useState<number[]>(
         []
@@ -53,6 +55,9 @@ const ServicesTable: FC<Props> = ({ serviceType }) => {
             verticalSpacing={"md"}
             groups={undefined}
             idAccessor={"category.id"}
+            styles={{
+                header: { zIndex: 1000 },
+            }}
             rowExpansion={{
                 allowMultiple: true,
                 expanded: {
@@ -69,6 +74,9 @@ const ServicesTable: FC<Props> = ({ serviceType }) => {
                     />
                 ),
             }}
+            style={{
+                marginInline: isMobile ? "var(--mantine-spacing-xs)" : "0",
+            }}
         />
     );
 };