@kaspernj/api-maker 1.0.2053 → 1.0.2054

package/src/super-admin/edit-page/edit-attribute-checkbox.jsx

@@ -1,84 +0,0 @@
-import React, {useMemo} from "react"
-import {StyleSheet, View} from "react-native"
-import Checkbox from "../../utils/checkbox"
-import BaseComponent from "../../base-component"
-import memo from "set-state-compare/src/memo"
-import PropTypes from "prop-types"
-import propTypesExact from "prop-types-exact"
-import {shapeComponent} from "set-state-compare/src/shape-component"
-import {useForm} from "../../form"
-
-const styles = StyleSheet.create({
-  checkbox: {
-    marginRight: 4
-  }
-})
-
-export default memo(shapeComponent(class EditAttributeInput extends BaseComponent {
-  static propTypes = propTypesExact({
-    attributeName: PropTypes.string.isRequired,
-    id: PropTypes.string.isRequired,
-    label: PropTypes.string.isRequired,
-    model: PropTypes.object.isRequired,
-    name: PropTypes.string.isRequired
-  })
-
-  setup() {
-    const {attributeName, id, name} = this.p
-
-    this.form = useForm()
-    this.useStates({
-      checked: this.tt.defaultChecked
-    })
-
-    this.dataSet = useMemo(
-      () => ({
-        attribute: attributeName,
-        id,
-        name
-      }),
-      [attributeName, id, name]
-    )
-
-    useMemo(() => {
-      if (this.form) {
-        this.form.setValue(name, this.s.checked)
-      }
-    }, [])
-  }
-
-  defaultChecked = () => this.p.model[this.p.attributeName]() || false
-
-  render() {
-    const {dataSet} = this.tt
-    const {attributeName, label, model} = this.p
-    const {checked} = this.s
-
-    if (!(attributeName in model)) {
-      throw new Error(`${attributeName} isn't set on the resource ${model.modelClassData().name}`)
-    }
-
-    return (
-      <View
-        dataSet={this.rootViewDataSet ||= {component: "api-maker/super-admin/edit-page/edit-attribute-input"}}
-        style={this.rootViewStyle ||= {flexDirection: "row", alignItems: "center"}}
-      >
-        <Checkbox
-          checked={checked}
-          dataSet={dataSet}
-          label={label}
-          onCheckedChange={this.tt.onCheckedChange}
-          style={styles.checkbox}
-        />
-      </View>
-    )
-  }
-
-  onCheckedChange = (newChecked) => {
-    if (this.form) {
-      this.form.setValue(this.p.name, newChecked)
-    }
-
-    this.setState({checked: newChecked})
-  }
-}))

package/src/super-admin/edit-page/edit-attribute-content.jsx

@@ -1,57 +0,0 @@
-import BaseComponent from "../../base-component"
-import memo from "set-state-compare/src/memo"
-import PropTypes from "prop-types"
-import propTypesExact from "prop-types-exact"
-import {shapeComponent} from "set-state-compare/src/shape-component"
-import {useForm} from "../../form"
-import {useMemo} from "react"
-
-export default memo(shapeComponent(class EditAttributeContent extends BaseComponent {
-  static propTypes = propTypesExact({
-    attribute: PropTypes.object.isRequired,
-    id: PropTypes.string.isRequired,
-    model: PropTypes.object.isRequired,
-    name: PropTypes.string.isRequired
-  })
-
-  setup() {
-    this.form = useForm()
-    this.useStates({
-      value: () => this.defaultValue()
-    })
-  }
-
-  render() {
-    const {attribute, id, model} = this.props
-
-    if (!(attribute.attribute in model)) {
-      throw new Error(`${attribute.attribute} isn't set on the resource ${model.modelClassData().name}`)
-    }
-
-    const contentArgs = useMemo(() => ({
-      inputProps: {
-        attribute: attribute.attribute,
-        defaultValue: this.defaultValue(),
-        id,
-        model
-      },
-      onChangeValue: this.tt.onChangeValue,
-      value: this.s.value
-    }), [attribute.attribute, id, model, this.s.value])
-
-    return attribute.content(contentArgs)
-  }
-
-  defaultValue = () => {
-    if (!(this.p.attribute.attribute in this.p.model)) {
-      throw new Error(`No attribute called ${this.p.attribute.attribute} in model ${this.p.model.modelClassData().name}`)
-    }
-
-    return this.p.model[this.p.attribute.attribute]() || ""
-  }
-
-  onChangeValue = (newValue) => {
-    this.setState({value: newValue})
-    this.tt.form.setValue(this.p.name, newValue)
-  }
-}))

package/src/super-admin/edit-page/edit-attribute-input.jsx

@@ -1,79 +0,0 @@
-import React, {useMemo} from "react"
-import {TextInput, View} from "react-native"
-import BaseComponent from "../../base-component"
-import memo from "set-state-compare/src/memo"
-import PropTypes from "prop-types"
-import propTypesExact from "prop-types-exact"
-import {shapeComponent} from "set-state-compare/src/shape-component"
-import Text from "../../utils/text"
-import {useForm} from "../../form"
-
-export default memo(shapeComponent(class EditAttributeInput extends BaseComponent {
-  static propTypes = propTypesExact({
-    attributeName: PropTypes.string.isRequired,
-    id: PropTypes.string.isRequired,
-    label: PropTypes.string.isRequired,
-    model: PropTypes.object.isRequired,
-    name: PropTypes.string.isRequired
-  })
-
-  setup() {
-    const {name} = this.p
-
-    this.form = useForm()
-    this.useStates({
-      value: this.defaultValue()
-    })
-
-    useMemo(() => {
-      if (this.form) {
-        this.form.setValue(name, this.s.value)
-      }
-    }, [])
-  }
-
-  defaultValue = () => this.p.model[this.p.attributeName]() || ""
-
-  render() {
-    const {attributeName, id, label, model, name} = this.p
-    const {value} = this.s
-
-    if (!(attributeName in model)) {
-      throw new Error(`${attributeName} isn't set on the resource ${model.modelClassData().name}`)
-    }
-
-    return (
-      <View dataSet={{component: "api-maker/super-admin/edit-page/edit-attribute-input"}}>
-        <Text>{label}</Text>
-        <View>
-          <TextInput
-            dataSet={this.cache("textInputDataSet", {
-              attribute: attributeName,
-              id,
-              name
-            }, [attributeName, id, name])}
-            onChangeText={this.tt.onChangeText}
-            style={this.textInputStyle ||= {
-              paddingTop: 9,
-              paddingRight: 13,
-              paddingBottom: 9,
-              paddingLeft: 13,
-              borderRadius: 5,
-              backgroundColor: "#fff",
-              border: "1px solid #cecece"
-            }}
-            value={value}
-          />
-        </View>
-      </View>
-    )
-  }
-
-  onChangeText = (newValue) => {
-    if (this.form) {
-      this.form.setValue(this.p.name, newValue)
-    }
-
-    this.setState({value: newValue})
-  }
-}))

package/src/super-admin/edit-page/edit-attribute.jsx

@@ -1,84 +0,0 @@
-import BaseComponent from "../../base-component"
-import {digg} from "diggerize"
-import EditAttributeCheckbox from "./edit-attribute-checkbox"
-import EditAttributeContent from "./edit-attribute-content"
-import EditAttributeInput from "./edit-attribute-input"
-import * as inflection from "inflection"
-import Locales from "shared/locales"
-import memo from "set-state-compare/src/memo"
-import PropTypes from "prop-types"
-import propTypesExact from "prop-types-exact"
-import React from "react"
-import {View} from "react-native"
-import {shapeComponent} from "set-state-compare/src/shape-component"
-
-export default memo(shapeComponent(class EditAttribute extends BaseComponent {
-  static propTypes = propTypesExact({
-    attribute: PropTypes.object.isRequired,
-    model: PropTypes.object,
-    modelClass: PropTypes.func
-  })
-
-  render() {
-    const {attribute, model, modelClass} = this.props
-    const availableLocales = Locales.availableLocales()
-    const camelizedLower = digg(modelClass.modelClassData(), "camelizedLower")
-    const modelAttribute = modelClass.attributes().find((modelAttributeI) => modelAttributeI.name() == attribute.attribute)
-
-    return (
-      <View
-        dataSet={this.rootViewDataSet ||= {component: "api-maker/super-admin/edit-page/edit-attribute"}}
-        style={this.cache("rootViewStyle", {marginBottom: attribute.translated ? undefined : 12}, [attribute.translated])}
-      >
-        {(() => {
-          if (attribute.content) {
-            return (
-              <EditAttributeContent
-                attribute={attribute}
-                id={`${inflection.underscore(camelizedLower)}_${inflection.underscore(attribute.attribute)}`}
-                model={model}
-                name={inflection.underscore(attribute.attribute)}
-              />
-            )
-          } else if (attribute.translated) {
-            return (
-              <>
-                {availableLocales.map((locale) =>
-                  <View key={locale} style={this.localeViewStyle ||= {marginBottom: 12}}>
-                    <EditAttributeInput
-                      attributeName={`${attribute.attribute}${inflection.camelize(locale)}`}
-                      id={`${inflection.underscore(camelizedLower)}_${inflection.underscore(attribute.attribute)}_${locale}`}
-                      label={`${modelClass.humanAttributeName(attribute.attribute)} (${locale})`}
-                      model={model}
-                      name={`${inflection.underscore(attribute.attribute)}_${locale}`}
-                    />
-                  </View>
-                )}
-              </>
-            )
-          } else if (modelAttribute?.getColumn()?.getType() == "boolean") {
-            return (
-              <EditAttributeCheckbox
-                attributeName={attribute.attribute}
-                id={`${inflection.underscore(camelizedLower)}_${inflection.underscore(attribute.attribute)}`}
-                label={modelClass.humanAttributeName(attribute.attribute)}
-                model={model}
-                name={inflection.underscore(attribute.attribute)}
-              />
-            )
-          } else {
-            return (
-              <EditAttributeInput
-                attributeName={attribute.attribute}
-                id={`${inflection.underscore(camelizedLower)}_${inflection.underscore(attribute.attribute)}`}
-                label={modelClass.humanAttributeName(attribute.attribute)}
-                model={model}
-                name={inflection.underscore(attribute.attribute)}
-              />
-            )
-          }
-        })()}
-      </View>
-    )
-  }
-}))

package/src/super-admin/edit-page.jsx

@@ -1,117 +0,0 @@
-import {Pressable, View} from "react-native"
-import BaseComponent from "../base-component"
-import ConfigReader from "./config-reader"
-import {digg} from "diggerize"
-import EditAttribute from "./edit-page/edit-attribute"
-import {FlashNotifications} from "flash-notifications"
-import {Form} from "../form"
-import * as inflection from "inflection"
-import Locales from "shared/locales"
-import memo from "set-state-compare/src/memo"
-import Params from "../params"
-import PropTypes from "prop-types"
-import propTypesExact from "prop-types-exact"
-import React from "react"
-import {shapeComponent} from "set-state-compare/src/shape-component"
-import Text from "../utils/text"
-import useCurrentUser from "../use-current-user"
-import useModel from "../use-model"
-import useQueryParams from "on-location-changed/build/use-query-params"
-
-export default memo(shapeComponent(class ApiMakerSuperAdminEditPage extends BaseComponent {
-  static propTypes = propTypesExact({
-    modelClass: PropTypes.func.isRequired
-  })
-
-  setup() {
-    const {modelClass} = this.p
-    const modelClassName = modelClass.modelClassData().name
-    const availableLocales = Locales.availableLocales()
-    this.configReader = ConfigReader.forModel(modelClass)
-    const currentUser = useCurrentUser()
-    const queryParams = useQueryParams()
-    const selectedModelAttributes = ["id"]
-    const selectedAttributes = {}
-    this.attributes = this.configReader.modelConfig?.edit?.attributes
-
-    if (!this.attributes) {
-      throw new Error(`No 'attributes' given from edit config for ${modelClass.modelClassData().name}`)
-    }
-
-    for (const attribute of this.attributes) {
-      if (attribute.translated) {
-        for (const locale of availableLocales) {
-          selectedModelAttributes.push(`${attribute.attribute}${inflection.camelize(locale)}`)
-        }
-      } else {
-        selectedModelAttributes.push(attribute.attribute)
-      }
-    }
-
-    selectedAttributes[modelClassName] = selectedModelAttributes
-
-    const useModelResult = useModel(modelClass, {
-      cacheArgs: [currentUser?.id()],
-      loadByQueryParam: (props) => props.queryParams.model_id,
-      newIfNoId: this.configReader.modelConfig?.edit?.newIfNoId || true,
-      preload: this.configReader.modelConfig?.edit?.preload,
-      select: selectedAttributes
-    })
-
-    const modelIdVarName = `${inflection.camelize(modelClass.modelClassData().name, true)}Id`
-    const modelVarName = inflection.camelize(modelClass.modelClassData().name, true)
-
-    this.model = digg(useModelResult, modelVarName)
-    this.modelId = queryParams.model_id
-    this.modelArgs = {}
-    this.modelArgs[modelIdVarName] = this.modelId
-    this.useStates({form: null})
-  }
-
-  render() {
-    const {attributes, model} = this.tt
-    const {modelClass} = this.p
-    const extraContent = this.configReader.modelConfig?.edit?.extraContentconst
-
-    return (
-      <View dataSet={this.rootViewDataSet ||= {class: "super-admin--edit-page"}}>
-        <Form setForm={this.setStates.form}>
-          {model && attributes?.map((attribute) =>
-            <EditAttribute attribute={attribute} key={attribute.attribute} model={model} modelClass={modelClass} />
-          )}
-          {extraContent && extraContent(modelArgs)}
-          <Pressable
-            dataSet={this.pressableDataSet ||= {class: "submit-button"}}
-            onPress={this.tt.onSubmit}
-            style={this.pressableStyle ||= {
-              paddingTop: 18,
-              paddingRight: 24,
-              paddingBottom: 18,
-              paddingLeft: 24,
-              borderRadius: 10,
-              backgroundColor: "#4c93ff",
-              marginTop: 10
-            }}
-          >
-            <Text style={this.buttonTextStyle ||= {color: "#fff"}}>
-              Submit
-            </Text>
-          </Pressable>
-        </Form>
-      </View>
-    )
-  }
-
-  onSubmit = async () => {
-    try {
-      const {model} = this.tt
-      const formObject = this.s.form.asObject()
-
-      model.assignAttributes(formObject)
-      await model.save()
-      Params.changeParams({mode: undefined, model_id: model.id()})
-    } catch (error) {
-      FlashNotifications.errorResponse(error)
-    }
-  }
-}))

package/src/super-admin/has-edit-config.js

@@ -1,15 +0,0 @@
-import ConfigReader from "./config-reader"
-
-const hasEditConfig = (modelClass) => {
-  const configReader = ConfigReader.forModel(modelClass)
-  const extraContent = configReader.modelConfig?.edit?.extraContentconst
-  const attributes = configReader.modelConfig?.edit?.attributes
-
-  if (attributes || extraContent) {
-    return true
-  }
-
-  return false
-}
-
-export default hasEditConfig

package/src/super-admin/index-page.jsx

@@ -1,23 +0,0 @@
-import BaseComponent from "../base-component"
-import memo from "set-state-compare/src/memo"
-import ModelClassTable from "./model-class-table"
-import PropTypes from "prop-types"
-import React from "react"
-import {shapeComponent} from "set-state-compare/src/shape-component"
-import {View} from "react-native"
-
-export default memo(shapeComponent(class ApiMakerSuperAdminIndexPage extends BaseComponent {
-  static propTypes = {
-    modelClass: PropTypes.func.isRequired
-  }
-
-  render() {
-    const {modelClass} = this.props
-
-    return (
-      <View dataSet={{component: "super-admin--index-page"}}>
-        <ModelClassTable modelClass={modelClass} />
-      </View>
-    )
-  }
-}))

package/src/super-admin/index.jsx

@@ -1,219 +0,0 @@
-import React, {useMemo} from "react"
-import {Pressable, StyleSheet, View} from "react-native"
-import BaseComponent from "../base-component"
-import ConfigReader from "./config-reader"
-import EditPage from "./edit-page"
-import hasEditConfig from "./has-edit-config"
-import IndexPage from "./index-page"
-import Layout from "./layout/index"
-import Link from "../link"
-import memo from "set-state-compare/src/memo"
-import * as models from "models"
-import Params from "../params"
-import {shapeComponent} from "set-state-compare/src/shape-component"
-import ShowPage from "./show-page/index"
-import ShowReflectionActions from "./show-reflection-actions"
-import ShowReflectionPage from "./show-reflection-page"
-import Text from "../utils/text"
-import useCanCan from "../use-can-can"
-import useCurrentUser from "../use-current-user"
-import useQueryParams from "on-location-changed/build/use-query-params"
-import useStyles from "../use-styles"
-
-const styles = StyleSheet.create({
-  actionsView: {
-    flexDirection: "row",
-    alignItems: "center"
-  },
-  createNewModelLink: {
-    marginLeft: 10,
-    marginRight: 10
-  },
-  destroyModelLink: {
-    marginLeft: 10,
-    marginRight: 10
-  },
-  editModelLink: {
-    marginLeft: 10,
-    marginRight: 10
-  }
-})
-
-export default memo(shapeComponent(class ApiMakerSuperAdmin extends BaseComponent {
-  setup() {
-    this.queryParams = useQueryParams()
-
-    if (this.queryParams.model) {
-      this.modelClass = models[this.queryParams.model]
-    } else {
-      this.modelClass = null
-    }
-
-    this.configReader = useMemo(() => this.modelClass && ConfigReader.forModel(this.modelClass), [this.modelClass])
-    this.modelId = this.queryParams.model_id
-    this.modelName = this.modelClass?.modelClassData()?.name
-    this.currentUser = useCurrentUser()
-
-    this.canCan = useCanCan(
-      () => {
-        const abilities = []
-
-        if (this.modelClass) abilities.push([this.modelClass, ["new"]])
-
-        return abilities
-      },
-      [this.currentUser?.id(), this.modelClass]
-    )
-
-    this.useStates({
-      model: undefined
-    })
-    useMemo(
-      () => { this.loadModel() },
-      [this.modelId]
-    )
-  }
-
-  loadModel = async () => {
-    const {configReader, modelClass, modelId, modelName} = this.tt
-
-    if (modelId && modelClass) {
-      const abilities = {}
-      const abilitiesForModel = ["destroy", "edit"]
-      const layoutSelect = configReader?.modelConfig?.layout?.select
-
-      abilities[modelName] = abilitiesForModel
-
-      const query = await modelClass
-        .ransack({id_eq: modelId})
-        .abilities(abilities)
-
-      if (layoutSelect) query.select(layoutSelect)
-
-      const model = await query.first()
-
-      this.setState({model})
-    } else {
-      this.setState({model: undefined})
-    }
-  }
-
-  render() {
-    const {canCan, configReader, modelClass, modelId, modelName, queryParams} = this.tt
-    const {model} = this.s
-    const modelConfigActions = configReader?.modelConfig?.actions
-    let pageToShow
-
-    if (queryParams.model && queryParams.model_id && queryParams.model_reflection) {
-      pageToShow = "show_reflection"
-    } else if (queryParams.model && queryParams.model_id && queryParams.mode == "edit") {
-      pageToShow = "edit"
-    } else if (queryParams.model && queryParams.model_id) {
-      pageToShow = "show"
-    } else if (queryParams.model && queryParams.mode == "new") {
-      pageToShow = "edit"
-    } else if (queryParams.model) {
-      pageToShow = "index"
-    } else {
-      pageToShow = "welcome"
-    }
-
-    const actionsViewStyle = useStyles(styles, "actionsView")
-
-    const actions = useMemo(
-      () => <View style={actionsViewStyle}>
-        {model && modelConfigActions && modelConfigActions({model})}
-        {modelClass && pageToShow == "index" &&
-          <>
-            {canCan?.can("new", modelClass) && hasEditConfig(modelClass) &&
-              <Link
-                dataSet={{class: "create-new-model-link"}}
-                style={styles.createNewModelLink}
-                to={Params.withParams({model: modelName, mode: "new"})}
-              >
-                <Text>
-                  Create new
-                </Text>
-              </Link>
-            }
-          </>
-        }
-        {model && pageToShow == "show" &&
-          <>
-            {model.can("edit") && hasEditConfig(modelClass) &&
-              <Link
-                dataSet={{class: "edit-model-link"}}
-                style={styles.editModelLink}
-                to={Params.withParams({model: modelName, model_id: modelId, mode: "edit"})}
-              >
-                <Text>
-                  Edit
-                </Text>
-              </Link>
-            }
-            {model.can("destroy") &&
-              <Pressable
-                dataSet={{class: "destroy-model-link"}}
-                onPress={this.tt.onDestroyClicked}
-                style={styles.destroyModelLink}
-              >
-                <Text>
-                  Delete
-                </Text>
-              </Pressable>
-            }
-          </>
-        }
-        {pageToShow == "show_reflection" &&
-          <ShowReflectionActions model={model} modelClass={modelClass} reflectionName={queryParams.model_reflection} />
-        }
-      </View>,
-      [canCan, configReader?.actions, model, modelClass, pageToShow]
-    )
-
-    return (
-      <Layout actions={actions} active={queryParams.model} headerTitle={modelClass?.modelName()?.human({count: 2})}>
-        {pageToShow == "index" &&
-          <IndexPage
-            key={`index-page-${modelName}`}
-            modelClass={modelClass}
-          />
-        }
-        {pageToShow == "show" &&
-          <ShowPage
-            key={`show-page-${modelName}-${modelId}`}
-            modelClass={modelClass}
-            modelId={modelId}
-          />
-        }
-        {pageToShow == "show_reflection" &&
-          <ShowReflectionPage
-            key={`show-reflection-page-${modelName}-${modelId}`}
-            modelClass={modelClass}
-            modelId={modelId}
-          />
-        }
-        {pageToShow == "edit" &&
-          <EditPage
-            key={`edit-page-${modelName}-${modelId}`}
-            modelClass={modelClass}
-          />
-        }
-      </Layout>
-    )
-  }
-
-  onDestroyClicked = async () => {
-    if (!confirm("Are you sure?")) {
-      return
-    }
-
-    try {
-      await this.s.model.destroy()
-
-      Params.changeParams({mode: undefined, model_id: undefined})
-    } catch (error) {
-      FlashNotifications.errorResponse(error)
-    }
-  }
-}))