amplify-studio icon indicating copy to clipboard operation
amplify-studio copied to clipboard

Form builder does not show all Data models

Open matart15 opened this issue 2 years ago • 5 comments

Before opening, please confirm:

JavaScript Framework

React

Amplify APIs

Not applicable

Amplify Categories

Not applicable

Environment information

# Put output below this line
  [email protected]
Ok to proceed? (y) y

  System:
    OS: Linux 5.15 Ubuntu 22.04.1 LTS 22.04.1 LTS (Jammy Jellyfish)
    CPU: (8) x64 Intel(R) Core(TM) i7-7700 CPU @ 3.60GHz
    Memory: 3.53 GB / 7.71 GB
    Container: Yes
    Shell: 5.8.1 - /usr/bin/zsh
  Binaries:
    Node: 18.14.0 - ~/.nvm/versions/node/v18.14.0/bin/node
    Yarn: 1.22.19 - ~/.nvm/versions/node/v18.14.0/bin/yarn
    npm: 9.3.1 - ~/.nvm/versions/node/v18.14.0/bin/npm
  npmPackages:
    @ampproject/toolbox-optimizer:  undefined ()
    @aws-amplify/ui-react: ^4.3.8 => 4.3.8
    @aws-amplify/ui-react-internal:  undefined ()
    @babel/core:  undefined ()
    @babel/runtime:  7.15.4
    @edge-runtime/primitives:  2.0.0
    @hapi/accept:  undefined ()
    @napi-rs/triples:  undefined ()
    @next/font: 13.1.6 => 13.1.6
    @next/react-dev-overlay:  undefined ()
    @segment/ajv-human-errors:  undefined ()
    @types/node: 18.13.0 => 18.13.0
    @types/react-dom: 18.0.11 => 18.0.11
    @vercel/nft:  undefined ()
    acorn:  undefined ()
    amphtml-validator:  undefined ()
    anser:  undefined ()
    arg:  undefined ()
    assert:  undefined ()
    async-retry:  undefined ()
    async-sema:  undefined ()
    aws-amplify: ^5.0.14 => 5.0.14
    babel-packages:  undefined ()
    browserify-zlib:  undefined ()
    browserslist:  undefined ()
    buffer:  undefined ()
    bytes:  undefined ()
    chalk:  undefined ()
    ci-info:  undefined ()
    cli-select:  undefined ()
    client-only:  0.0.1
    comment-json:  undefined ()
    compression:  undefined ()
    conf:  undefined ()
    constants-browserify:  undefined ()
    content-disposition:  undefined ()
    content-type:  undefined ()
    cookie:  undefined ()
    cross-spawn:  undefined ()
    crypto-browserify:  undefined ()
    css.escape:  undefined ()
    cssnano-simple:  undefined ()
    data-uri-to-buffer:  undefined ()
    debug:  undefined ()
    devalue:  undefined ()
    domain-browser:  undefined ()
    edge-runtime:  undefined ()
    eslint: 8.34.0 => 8.34.0
    eslint-config-next: 13.1.6 => 13.1.6
    events:  undefined ()
    find-cache-dir:  undefined ()
    find-up:  undefined ()
    fresh:  undefined ()
    get-orientation:  undefined ()
    glob:  undefined ()
    gzip-size:  undefined ()
    http-proxy:  undefined ()
    https-browserify:  undefined ()
    icss-utils:  undefined ()
    ignore-loader:  undefined ()
    image-size:  undefined ()
    ini: ^1.3.5 => 1.3.8
    inquirer: ^6.5.1 => 6.5.2
    is-animated:  undefined ()
    is-docker:  undefined ()
    is-wsl:  undefined ()
    jest-worker:  undefined ()
    json5:  undefined ()
    jsonwebtoken:  undefined ()
    loader-utils:  undefined ()
    lodash.curry:  undefined ()
    lru-cache:  undefined ()
    micromatch:  undefined ()
    mini-css-extract-plugin:  undefined ()
    nanoid:  undefined ()
    native-url:  undefined ()
    neo-async:  undefined ()
    next: 13.1.6 => 13.1.6
    node-fetch:  undefined ()
    node-html-parser:  undefined ()
    ora:  undefined ()
    os-browserify:  undefined ()
    p-limit:  undefined ()
    path-browserify:  undefined ()
    platform:  undefined ()
    postcss-flexbugs-fixes:  undefined ()
    postcss-modules-extract-imports:  undefined ()
    postcss-modules-local-by-default:  undefined ()
    postcss-modules-scope:  undefined ()
    postcss-modules-values:  undefined ()
    postcss-preset-env:  undefined ()
    postcss-safe-parser:  undefined ()
    postcss-scss:  undefined ()
    postcss-value-parser:  undefined ()
    process:  undefined ()
    punycode:  undefined ()
    querystring-es3:  undefined ()
    raw-body:  undefined ()
    react: 18.2.0 => 18.2.0 (18.3.0-next-3ba7add60-20221201)
    react-dom: 18.2.0 => 18.2.0 (18.3.0-next-3ba7add60-20221201)
    react-is:  18.2.0
    react-refresh:  0.12.0
    react-server-dom-webpack:  undefined ()
    regenerator-runtime:  0.13.4
    sass-loader:  undefined ()
    scheduler:  undefined ()
    schema-utils:  undefined ()
    semver:  undefined ()
    send:  undefined ()
    server-only:  0.0.1
    setimmediate:  undefined ()
    shell-quote:  undefined ()
    source-map:  undefined ()
    stacktrace-parser:  undefined ()
    stream-browserify:  undefined ()
    stream-http:  undefined ()
    string-hash:  undefined ()
    string_decoder:  undefined ()
    strip-ansi:  undefined ()
    tar:  undefined ()
    terser:  undefined ()
    text-table:  undefined ()
    timers-browserify:  undefined ()
    tty-browserify:  undefined ()
    typescript: 4.9.5 => 4.9.5
    ua-parser-js:  undefined ()
    undici:  undefined ()
    unistore:  undefined ()
    util:  undefined ()
    vm-browserify:  undefined ()
    watchpack:  undefined ()
    web-vitals:  undefined ()
    webpack:  undefined ()
    webpack-sources:  undefined ()
    ws:  undefined ()
  npmGlobalPackages:
    @aws-amplify/cli: 10.7.2
    corepack: 0.15.3
    npm: 9.3.1
    nps: 5.10.0
    yarn: 1.22.19


Describe the bug

I have 3 data models. none of them set auth rules.

スクリーンショット 2023-02-17 002147

I did not create Form on Steps and FieldSettings

スクリーンショット 2023-02-17 002215

When I try to create Step Form

It does not show up. Only 1 of them shows

スクリーンショット 2023-02-17 002234

Expected behavior

all three data model show up on Form builder

Reproduction steps

create 3 data model

Code Snippet

// Put your code below this line.

Log output

// Put your logs below this line


aws-exports.js

No response

Manual configuration

No response

Additional configuration

No response

Mobile Device

No response

Mobile Operating System

No response

Mobile Browser

No response

Mobile Browser Version

No response

Additional information and screenshots

No response

matart15 avatar Feb 16 '23 15:02 matart15

Hi @matart15 sending this to the Studio repo for better assistance

tannerabread avatar Feb 16 '23 16:02 tannerabread

Hey @matart15, thank you for reaching out. Currently, Amplify form builder does not support non model types, required relationships or required fields. For the models to appear in the form builder, I would suggest modifying the fields as non required.

For example: image

type Workflow @model @auth(rules: [{allow: public}]) {
  id: ID!
  Steps: [Step] @hasMany(indexName: "byWorkflow", fields: ["id"])
}

enum FormFieldType {
  SHORT_TEXT
  NUMBER
  CHOICE
  LONG_TEXT
}

type FormField @model @auth(rules: [{allow: public}]) {
  id: ID!
  stepID: ID @index(name: "byStep")
  label: String
  name: String
  type: FormFieldType
  placeholder: String
  dateName: String
  isRequired: Boolean
}

type Step @model @auth(rules: [{allow: public}]) {
  id: ID!
  FormFields: [FormField] @hasMany(indexName: "byStep", fields: ["id"])
  workflowID: ID @index(name: "byWorkflow")
}

On modifying to the above schema, I was able to build forms for the Step and FormField models. image

ykethan avatar Feb 16 '23 18:02 ykethan

@tannerabread @ykethan Thank you.

For now I will change my model fields into non required. then change back when I finish building UI.

should I create new issue for feature request?

matart15 avatar Feb 17 '23 00:02 matart15

Hey @matart15, I will mark this issue as feature request to enable support for form creation when relationships and fields are required

ykethan avatar Feb 17 '23 14:02 ykethan

Here is much easier aws amplify forms solution. Check it out.

Irishgeoff11 avatar Oct 04 '23 01:10 Irishgeoff11