Skip to content

P
purescript-gargantext
Commit d7ca82bd authored by arturo's avatar arturo
Browse files
Options

>>> continue

parent b2775d1d
Pipeline #2531 failed with stage
    Hide whitespace changes
    Inline Side-by-side
    Showing with 782 additions and 427 deletions
    dist/styles/bootstrap-darkster.css
    View file @ d7ca82bd
    ......@@ -10079,6 +10079,31 @@ h3 {
    background-color: inherit;
    }
    .phylo-config-form__row {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    }
    .phylo-config-form__group {
    margin-bottom: 24px;
    }
    .phylo-config-form .b-fieldset {
    margin-left: 1.25rem;
    margin-right: 1.25rem;
    }
    .phylo-config-form__col {
    width: 50%;
    }
    .phylo-config-form__col:first-child {
    padding-right: 8px;
    }
    .phylo-config-form__col:last-child {
    padding-left: 8px;
    }
    .phylo-config-form__submit {
    text-align: center;
    }
    .form-group {
    position: relative;
    margin-bottom: 24px;
    ......@@ -10943,6 +10968,20 @@ li .node.node-type-valid .text {
    background-color: #000;
    }
    .phylo-config-form {
    background-color: #0d0d0d;
    color: #cccccc;
    }
    .phylo-config-form__group {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    }
    .phylo-config-form__submit {
    padding: 0.75rem 1.25rem;
    background-color: #6f6f6f;
    border-top: 1px solid rgba(0, 0, 0, 0.6);
    }
    .code-editor .editor .code-area {
    flex-grow: 1;
    max-height: 200px;
    ......
    dist/styles/bootstrap-default.css
    View file @ d7ca82bd
    ......@@ -10030,6 +10030,31 @@ h3 {
    background-color: inherit;
    }
    .phylo-config-form__row {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    }
    .phylo-config-form__group {
    margin-bottom: 24px;
    }
    .phylo-config-form .b-fieldset {
    margin-left: 1.25rem;
    margin-right: 1.25rem;
    }
    .phylo-config-form__col {
    width: 50%;
    }
    .phylo-config-form__col:first-child {
    padding-right: 8px;
    }
    .phylo-config-form__col:last-child {
    padding-left: 8px;
    }
    .phylo-config-form__submit {
    text-align: center;
    }
    .form-group {
    position: relative;
    margin-bottom: 24px;
    ......@@ -10894,6 +10919,20 @@ li .node.node-type-valid .text {
    background-color: #fff;
    }
    .phylo-config-form {
    background-color: #fff;
    color: #212529;
    }
    .phylo-config-form__group {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    }
    .phylo-config-form__submit {
    padding: 0.75rem 1.25rem;
    background-color: rgba(0, 0, 0, 0.03);
    border-top: 1px solid rgba(0, 0, 0, 0.125);
    }
    .code-editor .editor .code-area {
    flex-grow: 1;
    max-height: 200px;
    ......
    dist/styles/bootstrap-greyson.css
    View file @ d7ca82bd
    ......@@ -9787,6 +9787,31 @@ h3 {
    background-color: inherit;
    }
    .phylo-config-form__row {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    }
    .phylo-config-form__group {
    margin-bottom: 24px;
    }
    .phylo-config-form .b-fieldset {
    margin-left: 1.25rem;
    margin-right: 1.25rem;
    }
    .phylo-config-form__col {
    width: 50%;
    }
    .phylo-config-form__col:first-child {
    padding-right: 8px;
    }
    .phylo-config-form__col:last-child {
    padding-left: 8px;
    }
    .phylo-config-form__submit {
    text-align: center;
    }
    .form-group {
    position: relative;
    margin-bottom: 24px;
    ......@@ -10651,6 +10676,20 @@ li .node.node-type-valid .text {
    background-color: #fff;
    }
    .phylo-config-form {
    background-color: #fff;
    color: #212529;
    }
    .phylo-config-form__group {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    }
    .phylo-config-form__submit {
    padding: 0.75rem 1.25rem;
    background-color: rgba(0, 0, 0, 0.03);
    border-top: 1px solid rgba(0, 0, 0, 0.125);
    }
    .code-editor .editor .code-area {
    flex-grow: 1;
    max-height: 200px;
    ......
    dist/styles/bootstrap-herbie.css
    View file @ d7ca82bd
    ......@@ -10036,6 +10036,31 @@ h3 {
    background-color: inherit;
    }
    .phylo-config-form__row {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    }
    .phylo-config-form__group {
    margin-bottom: 24px;
    }
    .phylo-config-form .b-fieldset {
    margin-left: 1.25rem;
    margin-right: 1.25rem;
    }
    .phylo-config-form__col {
    width: 50%;
    }
    .phylo-config-form__col:first-child {
    padding-right: 8px;
    }
    .phylo-config-form__col:last-child {
    padding-left: 8px;
    }
    .phylo-config-form__submit {
    text-align: center;
    }
    .form-group {
    position: relative;
    margin-bottom: 24px;
    ......@@ -10900,6 +10925,20 @@ li .node.node-type-valid .text {
    background-color: #fff;
    }
    .phylo-config-form {
    background-color: #fff;
    color: #212529;
    }
    .phylo-config-form__group {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    }
    .phylo-config-form__submit {
    padding: 0.75rem 1.25rem;
    background-color: rgba(0, 0, 0, 0.03);
    border-top: 1px solid rgba(0, 0, 0, 0.125);
    }
    .code-editor .editor .code-area {
    flex-grow: 1;
    max-height: 200px;
    ......
    dist/styles/bootstrap-monotony.css
    View file @ d7ca82bd
    ......@@ -10036,6 +10036,31 @@ h3 {
    background-color: inherit;
    }
    .phylo-config-form__row {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    }
    .phylo-config-form__group {
    margin-bottom: 24px;
    }
    .phylo-config-form .b-fieldset {
    margin-left: 1.25rem;
    margin-right: 1.25rem;
    }
    .phylo-config-form__col {
    width: 50%;
    }
    .phylo-config-form__col:first-child {
    padding-right: 8px;
    }
    .phylo-config-form__col:last-child {
    padding-left: 8px;
    }
    .phylo-config-form__submit {
    text-align: center;
    }
    .form-group {
    position: relative;
    margin-bottom: 24px;
    ......@@ -10900,6 +10925,20 @@ li .node.node-type-valid .text {
    background-color: #fff;
    }
    .phylo-config-form {
    background-color: #fff;
    color: #212529;
    }
    .phylo-config-form__group {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    }
    .phylo-config-form__submit {
    padding: 0.75rem 1.25rem;
    background-color: rgba(0, 0, 0, 0.03);
    border-top: 1px solid rgba(0, 0, 0, 0.125);
    }
    .code-editor .editor .code-area {
    flex-grow: 1;
    max-height: 200px;
    ......
    src/Gargantext/Components/Forest/Tree/Node/Action/Update.purs
    View file @ d7ca82bd
    ......@@ -3,36 +3,27 @@ module Gargantext.Components.Forest.Tree.Node.Action.Update where
    import Gargantext.Components.Forest.Tree.Node.Action.Update.Types
    import Gargantext.Prelude
    import DOM.Simple.Console (log, log3)
    import Data.Array as Array
    import DOM.Simple.Console (log3)
    import Data.Either (Either(..))
    import Data.Int as Int
    import Data.Maybe (Maybe(..), fromMaybe)
    import Data.Newtype (unwrap)
    import Data.Number as Number
    import Data.Maybe (Maybe(..))
    import Effect (Effect)
    import Effect.Aff (Aff, launchAff, launchAff_)
    import Effect.Class (liftEffect)
    import Effect.Aff (Aff, launchAff_)
    import Gargantext.Components.Bootstrap.Types (ComponentStatus(..))
    import Gargantext.Components.Forest.Tree.Node.Action.Types (Action(..))
    import Gargantext.Components.Forest.Tree.Node.Tools (formChoiceSafe, submitButton, panel)
    import Gargantext.Components.PhyloExplorer.API (Clique(..), CliqueFilter(..), TimeUnit(..), TimeUnitCriteria(..), UpdateData(..), toReflexiveTimeUnit)
    import Gargantext.Components.PhyloExplorer.API as Phylo
    import Gargantext.Components.PhyloExplorer.ConfigForm as PhyloForm
    import Gargantext.Components.PhyloExplorer.ConfigFormParser (useConfigFormParser)
    import Gargantext.Components.PhyloExplorer.ConfigFormParser as PhyloHook
    import Gargantext.Config.REST (RESTError, AffRESTError)
    import Gargantext.Routes as GR
    import Gargantext.Sessions (Session, post)
    import Gargantext.Types (ID, NodeType(..))
    import Gargantext.Types as GT
    import Gargantext.Utils (getter)
    import Gargantext.Utils.Reactix as R2
    import Reactix as R
    import Reactix.DOM.HTML as H
    import Record (merge)
    import Toestand as T
    import Unsafe.Coerce (unsafeCoerce)
    here :: R2.Here
    here = R2.here "Gargantext.Components.Forest.Tree.Node.Action.Update"
    ......@@ -104,21 +95,22 @@ updatePhyloCpt = here.component "updatePhylo" cpt where
    -- Helpers
    let
    -- @NOTE #219: use a config property returned by GET phylo route
    defaultData :: Phylo.UpdateData
    defaultData = Phylo.UpdateData
    { proximity: 0.1
    , synchrony: 0.1
    , quality: 0.1
    , exportFilter: 0.1
    { proximity: 0.5
    , synchrony: 0.5
    , quality: 0.5
    , exportFilter: 0.5
    , timeUnit: Phylo.Year $ Phylo.TimeUnitCriteria
    { period: 3
    , step: 1
    , matchingFrame: 5
    }
    , clique: FIS
    { support: 1
    , size: 2
    , clique: Phylo.MaxClique
    { size: 5
    , threshold: 0.0001
    , filter: Phylo.ByThreshold
    }
    }
    ......
    src/Gargantext/Components/PhyloExplorer/ConfigForm.purs
    View file @ d7ca82bd
    ......@@ -7,15 +7,16 @@ import Gargantext.Prelude
    import DOM.Simple.Console (log3)
    import Data.Either (Either(..))
    import Data.Foldable (intercalate)
    import Data.Foldable (foldl, intercalate)
    import Effect (Effect)
    import Gargantext.Components.Bootstrap as B
    import Gargantext.Components.Bootstrap.Types (ButtonVariant(..), ComponentStatus(..), Variant(..))
    import Gargantext.Components.PhyloExplorer.API (CliqueFilter(..), ReflexiveClique(..), ReflexiveTimeUnit(..))
    import Gargantext.Hooks.FormValidation (useFormValidation)
    import Gargantext.Hooks.FormValidation (VForm, useFormValidation)
    import Gargantext.Hooks.FormValidation.Unboxed as FV
    import Gargantext.Hooks.StateRecord (useStateRecord)
    import Gargantext.Hooks.StateRecord.Behaviors (setter)
    import Gargantext.Utils ((?))
    import Gargantext.Utils (nbsp, (?))
    import Gargantext.Utils.Reactix as R2
    import Reactix as R
    import Reactix.DOM.HTML as H
    ......@@ -55,8 +56,7 @@ component = R.hooksComponent "configForm" cpt where
    -- @onSubmit: exec whole form validation and execute callback
    onSubmit = do
    -- result <- fv.try (\_ -> formValidation state)
    result <- pure $ Right state
    result <- fv.try (\_ -> formValidation state)
    case result of
    Left err -> log3 "configForm validation error" state err
    Right _ -> props.callback state
    ......@@ -66,501 +66,566 @@ component = R.hooksComponent "configForm" cpt where
    pure $
    H.form
    { className: "document-form-creation" }
    { className: "phylo-config-form" }
    [
    -- Proximity
    H.div
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "proximity") ?
    "form-group--error" $
    mempty
    ]
    }
    { className: "phylo-config-form__group" }
    [
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Proximity" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    { className: "phylo-config-form__row" }
    [
    B.formInput $
    { type: "number"
    } `merge` bindStateKey "proximity"
    ,
    R2.if' (fv.hasError' "proximity") $
    H.div
    { className: "phylo-config-form__col" }
    [
    -- Proximity
    H.div
    { className: "form-group__error" }
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "proximity") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.text "Please enter a `Double` value (eg. 0.5)"
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Proximity" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    [
    B.formInput $
    { type: "number"
    } `merge` bindStateKey "proximity"
    ,
    R2.if' (fv.hasError' "proximity") $
    H.div
    { className: "form-group__error" }
    [
    H.text "Please enter a `Double` value (eg. 0.5)"
    ]
    ]
    ]
    ]
    ]
    ,
    -- Synchrony
    H.div
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "synchrony") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Synchrony" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    [
    B.formInput $
    { type: "number"
    } `merge` bindStateKey "synchrony"
    ,
    R2.if' (fv.hasError' "synchrony") $
    H.div
    { className: "phylo-config-form__col" }
    [
    -- Synchrony
    H.div
    { className: "form-group__error" }
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "synchrony") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.text "Please enter a `Double` value (eg. 0.5)"
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Synchrony" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    [
    B.formInput $
    { type: "number"
    } `merge` bindStateKey "synchrony"
    ,
    R2.if' (fv.hasError' "synchrony") $
    H.div
    { className: "form-group__error" }
    [
    H.text "Please enter a `Double` value (eg. 0.5)"
    ]
    ]
    ]
    ]
    ]
    ,
    -- Quality
    H.div
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "quality") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Quality" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    { className: "phylo-config-form__row" }
    [
    B.formInput $
    { type: "number"
    } `merge` bindStateKey "quality"
    ,
    R2.if' (fv.hasError' "quality") $
    H.div
    { className: "phylo-config-form__col" }
    [
    -- Quality
    H.div
    { className: "form-group__error" }
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "quality") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.text "Please enter a `Double` value (eg. 0.5)"
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Quality" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    [
    B.formInput $
    { type: "number"
    } `merge` bindStateKey "quality"
    ,
    R2.if' (fv.hasError' "quality") $
    H.div
    { className: "form-group__error" }
    [
    H.text "Please enter a `Double` value (eg. 0.5)"
    ]
    ]
    ]
    ]
    ]
    ,
    -- Export filter
    H.div
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "exportFilter") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Export filter" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    [
    B.formInput $
    { type: "number"
    } `merge` bindStateKey "exportFilter"
    ,
    R2.if' (fv.hasError' "exportFilter") $
    H.div
    { className: "phylo-config-form__col" }
    [
    -- Export filter
    H.div
    { className: "form-group__error" }
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "exportFilter") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.text "Please enter a `Double` value (eg. 0.5)"
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Export filter" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    [
    B.formInput $
    { type: "number"
    } `merge` bindStateKey "exportFilter"
    ,
    R2.if' (fv.hasError' "exportFilter") $
    H.div
    { className: "form-group__error" }
    [
    H.text "Please enter a `Double` value (eg. 0.5)"
    ]
    ]
    ]
    ]
    ]
    ]
    ,
    -- Time Unit
    B.fieldset
    { titleSlot: H.text "Time unit" }
    { className: "phylo-config-form__group"
    , titleSlot: H.text "Time unit"
    }
    [
    -- Granularity
    H.div
    { className: intercalate " "
    [ "form-group"
    ]
    }
    { className: "phylo-config-form__row" }
    [
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Granularity" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    { className: "phylo-config-form__col" }
    [
    B.formSelect
    (bindStateKey "granularity")
    -- Granularity
    H.div
    { className: intercalate " "
    [ "form-group"
    ]
    }
    [
    H.option
    { value: show Year_ }
    [ H.text "Year" ]
    ,
    H.option
    { value: show Month_ }
    [ H.text "Month" ]
    ,
    H.option
    { value: show Week_ }
    [ H.text "Week" ]
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Granularity" ]
    ]
    ,
    H.option
    { value: show Day_ }
    [ H.text "Day" ]
    ]
    ]
    ]
    ,
    -- Period
    H.div
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "period") ?
    "form-group--error" $
    mempty
    H.div
    { className: "form-group__field" }
    [
    B.formSelect
    (bindStateKey "granularity")
    [
    H.option
    { value: show Year_ }
    [ H.text "Year" ]
    ,
    H.option
    { value: show Month_ }
    [ H.text "Month" ]
    ,
    H.option
    { value: show Week_ }
    [ H.text "Week" ]
    ,
    H.option
    { value: show Day_ }
    [ H.text "Day" ]
    ]
    ]
    ]
    }
    [
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Period" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    { className: "phylo-config-form__col" }
    [
    B.formInput $
    { type: "number"
    } `merge` bindStateKey "period"
    ,
    R2.if' (fv.hasError' "period") $
    -- Period
    H.div
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "period") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.div
    { className: "form-group__error" }
    { className: "form-group__label" }
    [
    H.text "Please enter an `Int` value (eg. 3)"
    H.label {} [ H.text "Period" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    [
    B.formInput $
    { type: "number"
    } `merge` bindStateKey "period"
    ,
    R2.if' (fv.hasError' "period") $
    H.div
    { className: "form-group__error" }
    [
    H.text "Please enter an `Int` value (eg. 3)"
    ]
    ]
    ]
    ]
    ,
    -- Step
    H.div
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "step") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Step" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    [
    B.formInput $
    { type: "number"
    } `merge` bindStateKey "step"
    ,
    R2.if' (fv.hasError' "step") $
    -- Step
    H.div
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "step") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.div
    { className: "form-group__error" }
    { className: "form-group__label" }
    [
    H.text "Please enter an `Int` value (eg. 3)"
    H.label {} [ H.text "Step" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    [
    B.formInput $
    { type: "number"
    } `merge` bindStateKey "step"
    ,
    R2.if' (fv.hasError' "step") $
    H.div
    { className: "form-group__error" }
    [
    H.text "Please enter an `Int` value (eg. 3)"
    ]
    ]
    ]
    ]
    ,
    -- Matching frame
    H.div
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "matchingFrame") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Matching frame" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    [
    B.formInput $
    { type: "number"
    } `merge` bindStateKey "matchingFrame"
    ,
    R2.if' (fv.hasError' "matchingFrame") $
    -- Matching frame
    H.div
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "matchingFrame") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.div
    { className: "form-group__error" }
    { className: "form-group__label" }
    [
    H.text "Please enter an `Int` value (eg. 3)"
    H.label {} [ H.text "Matching frame" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    [
    B.formInput $
    { type: "number"
    } `merge` bindStateKey "matchingFrame"
    ,
    R2.if' (fv.hasError' "matchingFrame") $
    H.div
    { className: "form-group__error" }
    [
    H.text "Please enter an `Int` value (eg. 3)"
    ]
    ]
    ]
    ]
    ]
    ]
    ,
    -- Clique
    B.fieldset
    { titleSlot: H.text "Clique" }
    { className: "phylo-config-form__group"
    , titleSlot: H.text "Clique algorithm"
    }
    [
    -- Clique type
    H.div
    { className: intercalate " "
    [ "form-group"
    ]
    }
    { className: "phylo-config-form__row" }
    [
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Type" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    { className: "phylo-config-form__col" }
    [
    -- Clique type
    H.div
    { className: "btn-group"
    , role: "group"
    { className: intercalate " "
    [ "form-group"
    ]
    }
    [
    B.button
    { callback: \_ -> setter stateBox "cliqueType" $ show FIS_
    , variant: OutlinedButtonVariant Secondary
    , className: state.cliqueType == show FIS_ ?
    "active" $
    ""
    }
    H.div
    { className: "form-group__label" }
    [
    H.text "FIS"
    H.label {} [ H.text "Type" ]
    ]
    ,
    B.button
    { callback: \_ -> setter stateBox "cliqueType" $ show MaxClique_
    , variant: OutlinedButtonVariant Secondary
    , className: state.cliqueType == show MaxClique_ ?
    "active" $
    ""
    }
    H.div
    { className: "form-group__field" }
    [
    H.text "MaxClique"
    H.div
    { className: "btn-group"
    , role: "group"
    }
    [
    B.button
    { callback: \_ -> setter stateBox "cliqueType" $ show FIS_
    -- , variant: OutlinedButtonVariant Secondary
    , variant: ButtonVariant Light
    , className: state.cliqueType == show FIS_ ?
    "active" $
    ""
    }
    [
    H.text "FIS"
    ]
    ,
    B.button
    { callback: \_ -> setter stateBox "cliqueType" $ show MaxClique_
    -- , variant: OutlinedButtonVariant Secondary
    , variant: ButtonVariant Light
    , className: state.cliqueType == show MaxClique_ ?
    "active" $
    ""
    }
    [
    H.text "MaxClique"
    ]
    ]
    ]
    ]
    ]
    ]
    ,
    -- TYPE::FIS_
    R2.if' (state.cliqueType == show FIS_) $ R.fragment
    [
    -- Support
    H.div
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "support") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Support" ]
    ]
    ,
    ,
    -- TYPE::FIS_
    R2.if' (state.cliqueType == show FIS_) $
    H.div
    { className: "form-group__field" }
    { className: "phylo-config-form__col" }
    [
    B.formInput $
    bindStateKey "support"
    ,
    R2.if' (fv.hasError' "support") $
    -- Support
    H.div
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "support") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.div
    { className: "form-group__error" }
    { className: "form-group__label" }
    [
    H.text "Please enter an `Int` value (eg. 3)"
    H.label {} [ H.text "Support" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    [
    B.formInput $
    bindStateKey "support"
    ,
    R2.if' (fv.hasError' "support") $
    H.div
    { className: "form-group__error" }
    [
    H.text "Please enter an `Int` value (eg. 3)"
    ]
    ]
    ]
    ]
    ,
    -- Size
    H.div
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "size") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Size" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    [
    B.formInput $
    bindStateKey "size"
    ,
    R2.if' (fv.hasError' "sjze") $
    -- Size
    H.div
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "size") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.div
    { className: "form-group__error" }
    { className: "form-group__label" }
    [
    H.text "Please enter an `Int` value (eg. 3)"
    H.label {} [ H.text "Size" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    [
    B.formInput $
    bindStateKey "size"
    ,
    R2.if' (fv.hasError' "sjze") $
    H.div
    { className: "form-group__error" }
    [
    H.text "Please enter an `Int` value (eg. 3)"
    ]
    ]
    ]
    ]
    ]
    ,
    -- TYPE::MaxClique_
    R2.if' (state.cliqueType == show MaxClique_) $ R.fragment
    [
    -- Size
    H.div
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "size") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Size" ]
    ]
    ,
    ,
    -- TYPE::MaxClique_
    R2.if' (state.cliqueType == show MaxClique_) $
    H.div
    { className: "form-group__field" }
    { className: "phylo-config-form__col" }
    [
    B.formInput $
    { type: "number"
    } `merge` bindStateKey "size"
    ,
    R2.if' (fv.hasError' "sjze") $
    -- Size
    H.div
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "size") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.div
    { className: "form-group__error" }
    { className: "form-group__label" }
    [
    H.text "Please enter an `Int` value (eg. 3)"
    H.label {} [ H.text "Size" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    [
    B.formInput $
    { type: "number"
    } `merge` bindStateKey "size"
    ,
    R2.if' (fv.hasError' "size") $
    H.div
    { className: "form-group__error" }
    [
    H.text "Please enter an `Int` value (eg. 3)"
    ]
    ]
    ]
    ]
    ,
    -- Treshold
    H.div
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "threshold") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Treshold" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    [
    B.formInput $
    { type: "number"
    } `merge` bindStateKey "threshold"
    ,
    R2.if' (fv.hasError' "threshold") $
    -- Treshold
    H.div
    { className: intercalate " "
    [ "form-group"
    , (fv.hasError' "threshold") ?
    "form-group--error" $
    mempty
    ]
    }
    [
    H.div
    { className: "form-group__error" }
    { className: "form-group__label" }
    [
    H.text "Please enter a `Double` value (eg. 0.5)"
    H.label {} [ H.text "Treshold" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    [
    B.formInput $
    { type: "number"
    } `merge` bindStateKey "threshold"
    ,
    R2.if' (fv.hasError' "threshold") $
    H.div
    { className: "form-group__error" }
    [
    H.text "Please enter a `Double` value (eg. 0.5)"
    ]
    ]
    ]
    ]
    ,
    -- Clique filter
    H.div
    { className: intercalate " "
    [ "form-group"
    ]
    }
    [
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Filter type" ]
    ]
    ,
    H.div
    { className: "form-group__field" }
    [
    B.formSelect
    ( bindStateKey "cliqueFilter" )
    ,
    -- Clique filter
    H.div
    { className: intercalate " "
    [ "form-group"
    ]
    }
    [
    H.option
    { value: show ByThreshold }
    [ H.text "By threshold" ]
    H.div
    { className: "form-group__label" }
    [
    H.label {} [ H.text "Filter type" ]
    ]
    ,
    H.option
    { value: show ByNeighbours }
    [ H.text "By neighbours" ]
    H.div
    { className: "form-group__field" }
    [
    B.formSelect
    ( bindStateKey "cliqueFilter" )
    [
    H.option
    { value: show ByThreshold }
    [ H.text "By threshold" ]
    ,
    H.option
    { value: show ByNeighbours }
    [ H.text "By neighbours" ]
    ]
    ]
    ]
    ]
    ]
    ]
    ]
    ,
    -- Submit
    H.div { className: "document-form-creation__submit" }
    H.div { className: "phylo-config-form__submit" }
    [
    B.button
    { callback: \_ -> onSubmit
    , status: props.status == Deferred ? Deferred $ Enabled
    , variant: ButtonVariant Primary
    , type: "submit"
    , block: true
    }
    [ H.text "Add" ]
    [
    B.icon { name: "refresh" }
    ,
    H.text $ nbsp 1
    ,
    H.text "Update!"
    ]
    ]
    ]
    ......@@ -585,27 +650,41 @@ type FormData =
    defaultData :: Record FormData
    defaultData =
    { proximity : ""
    , synchrony : ""
    , quality : ""
    , exportFilter : ""
    , granularity : ""
    , period : ""
    , step : ""
    , matchingFrame : ""
    { proximity : "1.0"
    , synchrony : "1.0"
    , quality : "1.0"
    , exportFilter : "1.0"
    , granularity : show Year_
    , period : "1"
    , step : "1"
    , matchingFrame : "1"
    , cliqueType : show FIS_
    , support : ""
    , size : ""
    , threshold : ""
    , support : "1"
    , size : "1"
    , threshold : "1"
    , cliqueFilter : show ByThreshold
    }
    -- formValidation :: Record FormData -> Effect VForm
    -- formValidation r = foldl append mempty rules
    -- where
    -- rules =
    -- [ FV.nonEmpty "title" r.title
    -- , FV.nonEmpty "source" r.source
    -- , FV.nonEmpty "authors" r.authors
    -- , FV.date "date" r.date
    -- ]
    formValidation :: Record FormData -> Effect VForm
    formValidation r = foldl append mempty rules
    where
    rules
    = [ FV.number "proximity" r.proximity
    , FV.number "synchrony" r.synchrony
    , FV.number "quality" r.quality
    , FV.number "exportFilter" r.exportFilter
    -- Time unit
    , FV.int "period" r.period
    , FV.int "step" r.step
    , FV.int "matchingFrame" r.matchingFrame
    ]
    -- Clique
    <> if (r.cliqueType == show FIS_)
    then
    [ FV.int "support" r.support
    , FV.int "size" r.size
    ]
    else
    [ FV.int "size" r.size
    , FV.number "threshold" r.threshold
    ]
    src/Gargantext/Hooks/FormValidation/Boxed.purs
    View file @ d7ca82bd
    ......@@ -3,11 +3,14 @@ module Gargantext.Hooks.FormValidation.Boxed
    , class NonEmpty, nonEmpty
    , class Minimum, minimum
    , class Maximum, maximum
    , lowercase, uppercase, email, date
    , lowercase, uppercase, email, date, number, int
    ) where
    import Gargantext.Prelude
    import Data.Int as Int
    import Data.Maybe (isNothing)
    import Data.Number as Number
    import Data.String (toLower, toUpper)
    import Data.String.CodeUnits (length)
    import Data.String.Regex (test)
    ......@@ -81,3 +84,15 @@ date field = T.read >=> case _ of
    input
    | (not $ test datePattern input) -> pure $ invalid [ field /\ "date" ]
    | otherwise -> pure $ pure unit
    number :: Field -> T.Box String -> Effect VForm
    number field = T.read >=> case _ of
    input
    | (isNothing $ Number.fromString input) -> pure $ invalid [ field /\ "number "]
    | otherwise -> pure $ pure unit
    int :: Field -> T.Box String -> Effect VForm
    int field = T.read >=> case _ of
    input
    | (isNothing $ Int.fromString input) -> pure $ invalid [ field /\ "int" ]
    | otherwise -> pure $ pure unit
    src/Gargantext/Hooks/FormValidation/Unboxed.purs
    View file @ d7ca82bd
    ......@@ -3,11 +3,14 @@ module Gargantext.Hooks.FormValidation.Unboxed
    , class NonEmpty, nonEmpty
    , class Minimum, minimum
    , class Maximum, maximum
    , lowercase, uppercase, email, date
    , lowercase, uppercase, email, date, number, int
    ) where
    import Gargantext.Prelude
    import Data.Maybe (isNothing)
    import Data.Number as Number
    import Data.Int as Int
    import Data.String (toLower, toUpper)
    import Data.String.CodeUnits (length)
    import Data.String.Regex (test)
    ......@@ -68,3 +71,13 @@ date :: Field -> String -> Effect VForm
    date field input
    | (not $ test datePattern input) = pure $ invalid [ field /\ "date" ]
    | otherwise = pure $ pure unit
    number :: Field -> String -> Effect VForm
    number field input
    | (isNothing $ Number.fromString input) = pure $ invalid [ field /\ "number" ]
    | otherwise = pure $ pure unit
    int :: Field -> String -> Effect VForm
    int field input
    | (isNothing $ Int.fromString input) = pure $ invalid [ field /\ "int" ]
    | otherwise = pure $ pure unit
    src/sass/_legacy/_tree.sass
    View file @ d7ca82bd
    ......@@ -454,3 +454,25 @@ li
    .tile-menu__popover
    border-radius: $border-radius
    background-color: $body-bg
    /////////////////////////////////////////
    .phylo-config-form
    // @TODO: manage background color for all node Box popup
    background-color: $card-bg
    // @TODO: manage the blue color set on all node Box popup
    color: $body-color
    &__group
    padding-left: $card-spacer-x
    padding-right: $card-spacer-x
    // Apply Bootstrap "cart-footer" rules (see "_card.scss")
    &__submit
    padding: $card-spacer-y $card-spacer-x
    color: $card-cap-color
    background-color: $card-cap-bg
    border-top: $card-border-width solid $card-border-color
    src/sass/components/_grouped.scss
    View file @ d7ca82bd
    ......@@ -136,3 +136,42 @@
    background-color: inherit;
    }
    }
    /// PhyloExplorer.ConfigForm
    ///-----------------------------------------------------------------------------
    .phylo-config-form {
    &__row {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    }
    &__group {
    // @TODO: generic "form-group" margin-bottom constant
    margin-bottom: space-x(3);
    }
    .b-fieldset {
    margin-left: $card-spacer-x;
    margin-right: $card-spacer-x;
    }
    &__col {
    width: 50%;
    &:first-child {
    padding-right: space-x(1);
    }
    &:last-child {
    padding-left: space-x(1);
    }
    }
    &__submit {
    text-align: center;
    }
    }
    Markdown is supported
    0% or
    You are about to add 0 people to the discussion. Proceed with caution.
    Finish editing this message first!
    Please register or to comment