import { jsxs as t, Fragment as ie, jsx as e } from "react/jsx-runtime";
import { useTranslateProvider as se } from "@/common/languageTranslator/TranslationContext";
import p from "@/common/fontAwesomeIcons/FontAwesomeIcons";
import { Paper as A, Box as i, Typography as s, Button as x, Chip as j, TextField as Q, InputAdornment as de, Divider as ce, List as pe, ListItem as me, ListItemButton as ue, ListItemText as fe, Tooltip as F, IconButton as G, Dialog as be, DialogTitle as he, DialogContent as xe, Autocomplete as ye, DialogActions as ge } from "@mui/material";
import K from "@mui/material/Grid2";
import m from "prop-types";
import { useState as l, useEffect as J, Suspense as ve, lazy as Ce } from "react";
import { useForm as Te } from "react-hook-form";
const Ie = Ce(() => import("./TableDetails-DzREeJkm-B-WEBbQz.js"));
function ke({
  tableList: n,
  tablesInfo: W,
  allTableList: y,
  allTablesInfo: D,
  formSubmitted: V,
  reloadComponents: Y
}) {
  const [M, $] = l(""), [g, v] = l(""), [C, q] = l({}), [L, T] = l({}), [u, H] = l({}), [U, I] = l({}), h = n ? n.filter((o) => o.toLowerCase().includes(M.toLowerCase())) : [], [X, f] = l(!1), [Z, k] = l(!1), [d, S] = l(), [N, b] = l(!1), [_, z] = l(!1), [ee, R] = l(!1), { translate: P } = se();
  Te({
    defaultValues: {
      field1: "",
      field2: "",
      field3: ""
    }
  }), J(() => {
    let o = {}, r = {};
    v(n[0]), o = B(W), q((a) => ({ ...a, ...o })), r = B(D), H((a) => ({ ...a, ...r }));
  }, [W, D]), J(() => {
    T(() => C[n[0]]), I(() => u[n[0]]);
  }, [C, u]);
  const oe = (o) => {
    const r = o.toLowerCase();
    return r.includes("int") || r.includes("timestamp") || r === "boolean" || r.includes("serial") || r.includes("date") ? "INTEGER" : (r.includes("char") || r.includes("text") || r.includes("varchar"), "TEXT");
  }, B = (o) => {
    const r = {};
    return o.forEach((a) => {
      const c = JSON.parse(a.columnInfo), le = Object.keys(c).map((E) => ({
        name: E,
        type: oe(c[E])
      })), ne = a.mediaConfiguration !== void 0 ? JSON.parse(a.mediaConfiguration) : null;
      r[a.tableName] = {
        columnInfo: le,
        modifiedOnQuery: a.modifiedOnQuery ? a.modifiedOnQuery : null,
        primaryKey: a.primaryKey ? a.primaryKey : null,
        selectQuery: a.selectQuery ? a.selectQuery : null,
        userData: a.userData !== void 0 ? a.userData : null,
        hasMedia: a.hasMedia !== void 0 ? a.hasMedia : null,
        mediaConfiguration: ne,
        syncByDefault: a.syncByDefault ? a.syncByDefault : !1
      };
    }), r;
  }, ae = () => {
    b(!1), k(!0), S();
  }, re = () => {
    f(!1), b(!0);
  }, O = () => {
    k(!1);
  }, te = () => {
    if (d) {
      const o = { ...u[d] };
      o && (o.columnInfo = []), v(d), T(() => o), I(() => u[d]), z(!0), b(!1), f(!0);
    }
    k(!1), S(() => "");
  }, w = (o) => {
    v(o), T(() => C[o]), I(() => u[o]), f(!1), b(!1), z(!1);
  };
  return /* @__PURE__ */ t(ie, { children: [
    /* @__PURE__ */ t(
      A,
      {
        elevation: 0,
        sx: {
          p: { xs: 2.5, md: 3 },
          mt: 2,
          mb: 3,
          border: "1px solid",
          borderColor: "divider",
          borderRadius: 3,
          backgroundColor: "background.paper"
        },
        children: [
          /* @__PURE__ */ t(i, { sx: { display: "flex", flexDirection: "column", gap: 3 }, children: [
            /* @__PURE__ */ t(
              i,
              {
                sx: {
                  display: "flex",
                  justifyContent: "space-between",
                  alignItems: "flex-start",
                  flexWrap: "wrap",
                  gap: 2
                },
                children: [
                  /* @__PURE__ */ t(i, { sx: { minWidth: { xs: "100%", lg: "40%" } }, children: [
                    /* @__PURE__ */ e(s, { variant: "h5", sx: { fontWeight: 800, color: "text.primary", mb: 0.5 }, children: P("Database Management") }),
                    /* @__PURE__ */ e(s, { variant: "body2", color: "text.secondary", children: "Manage synced tables, create new entities, and configure mobile database schemas." })
                  ] }),
                  /* @__PURE__ */ t(i, { sx: { display: "flex", alignItems: "center", gap: 1.5, flexWrap: "wrap" }, children: [
                    /* @__PURE__ */ e(
                      x,
                      {
                        variant: "outlined",
                        size: "small",
                        sx: {
                          borderRadius: 2,
                          fontWeight: 600,
                          px: 2,
                          textTransform: "none",
                          borderColor: "divider",
                          color: "text.primary",
                          "&:hover": { backgroundColor: "action.hover", borderColor: "text.disabled" }
                        },
                        startIcon: /* @__PURE__ */ e(p, { iconName: "faRotate" }),
                        onClick: () => ae(),
                        children: "Sync Table"
                      }
                    ),
                    /* @__PURE__ */ e(
                      x,
                      {
                        size: "small",
                        variant: "contained",
                        sx: {
                          borderRadius: 2,
                          fontWeight: 600,
                          px: 2,
                          boxShadow: "none",
                          textTransform: "none"
                        },
                        startIcon: /* @__PURE__ */ e(p, { iconName: "faPlus" }),
                        onClick: () => re(),
                        children: "Create Table"
                      }
                    )
                  ] })
                ]
              }
            ),
            /* @__PURE__ */ t(
              i,
              {
                sx: {
                  display: "flex",
                  justifyContent: "space-between",
                  alignItems: "center",
                  flexWrap: "wrap",
                  gap: 2,
                  backgroundColor: "action.hover",
                  p: 1.5,
                  borderRadius: 2.5,
                  border: "1px solid",
                  borderColor: "divider"
                },
                children: [
                  /* @__PURE__ */ t(i, { sx: { display: "flex", alignItems: "center", gap: 1.5 }, children: [
                    /* @__PURE__ */ e(
                      j,
                      {
                        label: `${(n == null ? void 0 : n.length) || 0} Synced`,
                        size: "small",
                        color: "primary",
                        variant: "filled",
                        sx: { fontWeight: 700, borderRadius: 2, px: 0.5 }
                      }
                    ),
                    /* @__PURE__ */ e(
                      j,
                      {
                        label: `${(y == null ? void 0 : y.length) || 0} Total`,
                        size: "small",
                        variant: "outlined",
                        sx: { fontWeight: 600, borderRadius: 2, px: 0.5, borderColor: "divider" }
                      }
                    )
                  ] }),
                  /* @__PURE__ */ e(
                    Q,
                    {
                      value: M,
                      size: "small",
                      placeholder: "Search synced tables...",
                      onChange: (o) => $(o.target.value),
                      InputProps: {
                        startAdornment: /* @__PURE__ */ e(de, { position: "start", children: /* @__PURE__ */ e(p, { iconName: "faMagnifyingGlass" }) }),
                        sx: {
                          backgroundColor: "background.paper",
                          borderRadius: 2,
                          minWidth: 260
                        }
                      }
                    }
                  )
                ]
              }
            )
          ] }),
          /* @__PURE__ */ e(ce, { sx: { my: 3 } }),
          /* @__PURE__ */ t(K, { container: !0, spacing: 2.5, children: [
            /* @__PURE__ */ e(K, { size: 3, children: /* @__PURE__ */ t(
              A,
              {
                variant: "outlined",
                sx: {
                  borderRadius: 2.5,
                  overflow: "hidden",
                  maxHeight: "72vh",
                  display: "flex",
                  flexDirection: "column"
                },
                children: [
                  /* @__PURE__ */ t(
                    i,
                    {
                      sx: {
                        px: 2,
                        py: 1.5,
                        backgroundColor: "action.hover",
                        borderBottom: "1px solid",
                        borderColor: "divider"
                      },
                      children: [
                        /* @__PURE__ */ e(s, { variant: "subtitle2", sx: { fontWeight: 700, color: "text.primary" }, children: P("Synced Tables") }),
                        /* @__PURE__ */ t(s, { variant: "caption", color: "text.secondary", children: [
                          h.length,
                          " of ",
                          (n == null ? void 0 : n.length) || 0,
                          " tables"
                        ] })
                      ]
                    }
                  ),
                  /* @__PURE__ */ e(i, { sx: { overflowY: "auto", flex: 1 }, children: h.length ? /* @__PURE__ */ e(pe, { disablePadding: !0, children: h.map((o, r) => {
                    const a = g === o;
                    return /* @__PURE__ */ e(
                      me,
                      {
                        disablePadding: !0,
                        secondaryAction: /* @__PURE__ */ t(
                          i,
                          {
                            sx: {
                              display: "flex",
                              gap: 0.25,
                              opacity: a ? 1 : 0,
                              transition: "opacity 0.2s"
                            },
                            children: [
                              /* @__PURE__ */ e(F, { title: "Edit table", arrow: !0, placement: "top", children: /* @__PURE__ */ e(
                                G,
                                {
                                  size: "small",
                                  onClick: (c) => {
                                    c.stopPropagation(), w(o), f(!0);
                                  },
                                  sx: {
                                    color: "primary.main",
                                    "&:hover": { backgroundColor: "primary.50" }
                                  },
                                  children: /* @__PURE__ */ e(p, { iconName: "faPen", className: "text-[0.75rem]" })
                                }
                              ) }),
                              /* @__PURE__ */ e(F, { title: "Delete table", arrow: !0, placement: "top", children: /* @__PURE__ */ e(
                                G,
                                {
                                  size: "small",
                                  onClick: (c) => {
                                    c.stopPropagation(), w(o), R(!0);
                                  },
                                  sx: {
                                    color: "error.main",
                                    "&:hover": { backgroundColor: "error.50" }
                                  },
                                  children: /* @__PURE__ */ e(p, { iconName: "faTrash", className: "text-[0.75rem]" })
                                }
                              ) })
                            ]
                          }
                        ),
                        sx: {
                          borderBottom: r === h.length - 1 ? "none" : "1px solid",
                          borderColor: "divider",
                          "&:hover .MuiBox-root": { opacity: "1 !important" }
                        },
                        children: /* @__PURE__ */ e(
                          ue,
                          {
                            selected: a,
                            onClick: () => w(o),
                            sx: {
                              py: 1,
                              px: 2,
                              transition: "all 0.15s ease",
                              "&.Mui-selected": {
                                backgroundColor: "primary.50",
                                borderLeft: "3px solid",
                                borderLeftColor: "primary.main",
                                "&:hover": { backgroundColor: "primary.100" }
                              },
                              "&:hover": { backgroundColor: "action.hover" }
                            },
                            children: /* @__PURE__ */ e(
                              fe,
                              {
                                primary: /* @__PURE__ */ e(
                                  s,
                                  {
                                    variant: "body2",
                                    sx: {
                                      fontWeight: a ? 600 : 400,
                                      color: a ? "primary.dark" : "text.primary",
                                      fontSize: "0.82rem",
                                      overflow: "hidden",
                                      textOverflow: "ellipsis",
                                      whiteSpace: "nowrap",
                                      maxWidth: "160px"
                                    },
                                    children: o
                                  }
                                )
                              }
                            )
                          }
                        )
                      },
                      r + 1
                    );
                  }) }) : /* @__PURE__ */ t(i, { sx: { p: 3, textAlign: "center" }, children: [
                    /* @__PURE__ */ e(p, { iconName: "faInbox", className: "text-[2rem] text-gray-300" }),
                    /* @__PURE__ */ e(s, { variant: "body2", color: "text.secondary", sx: { mt: 1 }, children: n.length < 1 ? "No tables synced" : "No tables match your search." })
                  ] }) })
                ]
              }
            ) }),
            /* @__PURE__ */ e(ve, { children: (!!g && !!L || N) && /* @__PURE__ */ e(
              Ie,
              {
                tableInfo: L,
                table: g,
                isEditMode: X,
                updateEditMode: f,
                tableCompleteInfo: U,
                formSubmitted: V,
                reloadComponents: Y,
                isCreateTableMode: N,
                isSyncTableMode: _,
                updateCreateTableMode: b,
                openDeleteModal: ee,
                setOpenDeleteModal: R
              }
            ) })
          ] })
        ]
      }
    ),
    /* @__PURE__ */ t(
      be,
      {
        open: Z,
        onClose: O,
        maxWidth: "sm",
        fullWidth: !0,
        PaperProps: {
          sx: { borderRadius: 3, p: 1 }
        },
        children: [
          /* @__PURE__ */ t(he, { sx: { fontWeight: 700, pb: 1 }, children: [
            "Sync a Table",
            /* @__PURE__ */ e(s, { variant: "body2", color: "text.secondary", children: "Select an existing database table to sync with the mobile app." })
          ] }),
          /* @__PURE__ */ e(xe, { children: /* @__PURE__ */ e(
            ye,
            {
              options: y.filter((o) => !n.includes(o)),
              getOptionLabel: (o) => o,
              value: d,
              onChange: (o, r) => S(r),
              renderInput: (o) => /* @__PURE__ */ e(
                Q,
                {
                  ...o,
                  label: "Table",
                  placeholder: "Search and select a table...",
                  size: "small",
                  sx: { mt: 1 }
                }
              )
            }
          ) }),
          /* @__PURE__ */ t(ge, { sx: { px: 3, pb: 2 }, children: [
            /* @__PURE__ */ e(
              x,
              {
                onClick: O,
                variant: "outlined",
                size: "small",
                sx: { borderRadius: 2, textTransform: "none" },
                children: "Cancel"
              }
            ),
            /* @__PURE__ */ e(
              x,
              {
                variant: "contained",
                size: "small",
                onClick: () => te(),
                disabled: !d,
                sx: { borderRadius: 2, textTransform: "none", boxShadow: "none" },
                children: "Sync Table"
              }
            )
          ] })
        ]
      }
    )
  ] });
}
ke.propTypes = {
  tableList: m.any,
  tablesInfo: m.any,
  allTableList: m.any,
  allTablesInfo: m.any,
  formSubmitted: m.bool,
  reloadComponents: m.any
};
export {
  ke as default
};
//# sourceMappingURL=TableList-B9hr05Hs-BIsMbnIV.js.map
