Skip to content

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

[NgramsTable] Cache On and Group Terms 

* #419
parent 83b4876a
Pipeline #3022 failed with stage
    in 0 seconds
    Hide whitespace changes
    Inline Side-by-side
    Showing with 815 additions and 187 deletions
    dist/styles/bootstrap-darkster.css
    View file @ 250ba032
    ......@@ -8676,10 +8676,6 @@ a:focus, a:hover {
    user-select: none;
    }
    .cache-toggle {
    cursor: pointer;
    }
    .side-panel {
    background-color: #fff;
    padding: 0.3em;
    ......@@ -8882,6 +8878,15 @@ select.form-control {
    top: 6px;
    }
    .nodes-lists-layout-tabs .nav.nav-tabs,
    .nodes-texts-layout-tabs .nav.nav-tabs,
    .nodes-annuaire-layout-tabs .nav.nav-tabs {
    margin-left: -32px;
    margin-right: -32px;
    padding-left: 32px;
    padding-right: 32px;
    }
    .jitsi-iframe {
    height: 70em;
    }
    ......@@ -8955,7 +8960,7 @@ select.form-control {
    margin-right: 8px;
    }
    .search-button-prepend .input-group-text {
    .ngrams-table-search-button .input-group-text {
    width: 41px;
    z-index: initial;
    }
    ......@@ -8998,6 +9003,9 @@ select.form-control {
    .ngrams-tree-edit-real__actions .b-button {
    margin-right: 8px;
    }
    .ngrams-tree-edit-real .ngrams-tree-loaded-node a:hover {
    text-decoration: line-through;
    }
    .loaded-ngrams-table-header {
    text-align: center;
    ......@@ -9033,6 +9041,60 @@ select.form-control {
    margin-left: 13px;
    }
    .table-header-rename {
    margin-bottom: 8px;
    }
    .table-header-rename__header {
    display: flex;
    align-items: center;
    }
    .table-header-rename__header__line {
    border-bottom: 1px solid #343A40;
    border-top: none;
    height: 0;
    flex-grow: 1;
    margin-left: 32px;
    }
    .table-header-rename__cache {
    margin-top: 16px;
    }
    .table-header-rename__cache--on {
    font-weight: bold;
    }
    .table-header-rename__cache__button {
    margin-left: 16px;
    color: #303030;
    }
    .table-header-rename__cache__text {
    cursor: pointer;
    }
    .table-header-rename__cache__text:focus {
    outline: 0;
    }
    .table-header-rename__calendar__icon {
    margin-right: 4px;
    width: 16px;
    }
    .table-header-rename .renameable-wrapper--emphase .renameable-container__text {
    font-size: 1.75rem;
    font-family: "Comfortaa";
    }
    .renameable-container {
    display: flex;
    align-items: baseline;
    margin-bottom: 6px;
    }
    .renameable-container__icon {
    margin-right: 4px;
    font-size: 14px;
    width: 16px;
    text-align: center;
    }
    .renameable-container__button {
    margin-left: 16px;
    }
    .annotation-run {
    cursor: pointer;
    }
    ......
    dist/styles/bootstrap-default.css
    View file @ 250ba032
    ......@@ -8629,10 +8629,6 @@ a:focus, a:hover {
    user-select: none;
    }
    .cache-toggle {
    cursor: pointer;
    }
    .side-panel {
    background-color: #fff;
    padding: 0.3em;
    ......@@ -8835,6 +8831,15 @@ select.form-control {
    top: 6px;
    }
    .nodes-lists-layout-tabs .nav.nav-tabs,
    .nodes-texts-layout-tabs .nav.nav-tabs,
    .nodes-annuaire-layout-tabs .nav.nav-tabs {
    margin-left: -32px;
    margin-right: -32px;
    padding-left: 32px;
    padding-right: 32px;
    }
    .jitsi-iframe {
    height: 70em;
    }
    ......@@ -8908,7 +8913,7 @@ select.form-control {
    margin-right: 8px;
    }
    .search-button-prepend .input-group-text {
    .ngrams-table-search-button .input-group-text {
    width: 41px;
    z-index: initial;
    }
    ......@@ -8951,6 +8956,9 @@ select.form-control {
    .ngrams-tree-edit-real__actions .b-button {
    margin-right: 8px;
    }
    .ngrams-tree-edit-real .ngrams-tree-loaded-node a:hover {
    text-decoration: line-through;
    }
    .loaded-ngrams-table-header {
    text-align: center;
    ......@@ -8985,6 +8993,59 @@ select.form-control {
    margin-left: 13px;
    }
    .table-header-rename {
    margin-bottom: 8px;
    }
    .table-header-rename__header {
    display: flex;
    align-items: center;
    }
    .table-header-rename__header__line {
    border-bottom: 1px solid #E9ECEF;
    border-top: none;
    height: 0;
    flex-grow: 1;
    margin-left: 32px;
    }
    .table-header-rename__cache {
    margin-top: 16px;
    }
    .table-header-rename__cache--on {
    font-weight: bold;
    }
    .table-header-rename__cache__button {
    margin-left: 16px;
    color: #007bff;
    }
    .table-header-rename__cache__text {
    cursor: pointer;
    }
    .table-header-rename__cache__text:focus {
    outline: 0;
    }
    .table-header-rename__calendar__icon {
    margin-right: 4px;
    width: 16px;
    }
    .table-header-rename .renameable-wrapper--emphase .renameable-container__text {
    font-size: 1.75rem;
    }
    .renameable-container {
    display: flex;
    align-items: baseline;
    margin-bottom: 6px;
    }
    .renameable-container__icon {
    margin-right: 4px;
    font-size: 14px;
    width: 16px;
    text-align: center;
    }
    .renameable-container__button {
    margin-left: 16px;
    }
    .annotation-run {
    cursor: pointer;
    }
    ......
    dist/styles/bootstrap-greyson.css
    View file @ 250ba032
    ......@@ -8385,10 +8385,6 @@ a:focus, a:hover {
    user-select: none;
    }
    .cache-toggle {
    cursor: pointer;
    }
    .side-panel {
    background-color: #fff;
    padding: 0.3em;
    ......@@ -8591,6 +8587,15 @@ select.form-control {
    top: 6px;
    }
    .nodes-lists-layout-tabs .nav.nav-tabs,
    .nodes-texts-layout-tabs .nav.nav-tabs,
    .nodes-annuaire-layout-tabs .nav.nav-tabs {
    margin-left: -32px;
    margin-right: -32px;
    padding-left: 32px;
    padding-right: 32px;
    }
    .jitsi-iframe {
    height: 70em;
    }
    ......@@ -8664,7 +8669,7 @@ select.form-control {
    margin-right: 8px;
    }
    .search-button-prepend .input-group-text {
    .ngrams-table-search-button .input-group-text {
    width: 41px;
    z-index: initial;
    }
    ......@@ -8707,6 +8712,9 @@ select.form-control {
    .ngrams-tree-edit-real__actions .b-button {
    margin-right: 8px;
    }
    .ngrams-tree-edit-real .ngrams-tree-loaded-node a:hover {
    text-decoration: line-through;
    }
    .loaded-ngrams-table-header {
    text-align: center;
    ......@@ -8742,6 +8750,60 @@ select.form-control {
    margin-left: 13px;
    }
    .table-header-rename {
    margin-bottom: 8px;
    }
    .table-header-rename__header {
    display: flex;
    align-items: center;
    }
    .table-header-rename__header__line {
    border-bottom: 1px solid #E9ECEF;
    border-top: none;
    height: 0;
    flex-grow: 1;
    margin-left: 32px;
    }
    .table-header-rename__cache {
    margin-top: 16px;
    }
    .table-header-rename__cache--on {
    font-weight: bold;
    }
    .table-header-rename__cache__button {
    margin-left: 16px;
    color: #6f7f8c;
    }
    .table-header-rename__cache__text {
    cursor: pointer;
    }
    .table-header-rename__cache__text:focus {
    outline: 0;
    }
    .table-header-rename__calendar__icon {
    margin-right: 4px;
    width: 16px;
    }
    .table-header-rename .renameable-wrapper--emphase .renameable-container__text {
    font-size: 1.75rem;
    font-family: "Oswald";
    }
    .renameable-container {
    display: flex;
    align-items: baseline;
    margin-bottom: 6px;
    }
    .renameable-container__icon {
    margin-right: 4px;
    font-size: 14px;
    width: 16px;
    text-align: center;
    }
    .renameable-container__button {
    margin-left: 16px;
    }
    .annotation-run {
    cursor: pointer;
    }
    ......
    dist/styles/bootstrap-herbie.css
    View file @ 250ba032
    ......@@ -8633,10 +8633,6 @@ a:focus, a:hover {
    user-select: none;
    }
    .cache-toggle {
    cursor: pointer;
    }
    .side-panel {
    background-color: #fff;
    padding: 0.3em;
    ......@@ -8839,6 +8835,15 @@ select.form-control {
    top: 6px;
    }
    .nodes-lists-layout-tabs .nav.nav-tabs,
    .nodes-texts-layout-tabs .nav.nav-tabs,
    .nodes-annuaire-layout-tabs .nav.nav-tabs {
    margin-left: -32px;
    margin-right: -32px;
    padding-left: 32px;
    padding-right: 32px;
    }
    .jitsi-iframe {
    height: 70em;
    }
    ......@@ -8912,7 +8917,7 @@ select.form-control {
    margin-right: 8px;
    }
    .search-button-prepend .input-group-text {
    .ngrams-table-search-button .input-group-text {
    width: 41px;
    z-index: initial;
    }
    ......@@ -8955,6 +8960,9 @@ select.form-control {
    .ngrams-tree-edit-real__actions .b-button {
    margin-right: 8px;
    }
    .ngrams-tree-edit-real .ngrams-tree-loaded-node a:hover {
    text-decoration: line-through;
    }
    .loaded-ngrams-table-header {
    text-align: center;
    ......@@ -8990,6 +8998,60 @@ select.form-control {
    margin-left: 13px;
    }
    .table-header-rename {
    margin-bottom: 8px;
    }
    .table-header-rename__header {
    display: flex;
    align-items: center;
    }
    .table-header-rename__header__line {
    border-bottom: 1px solid #E9ECEF;
    border-top: none;
    height: 0;
    flex-grow: 1;
    margin-left: 32px;
    }
    .table-header-rename__cache {
    margin-top: 16px;
    }
    .table-header-rename__cache--on {
    font-weight: bold;
    }
    .table-header-rename__cache__button {
    margin-left: 16px;
    color: #F67280;
    }
    .table-header-rename__cache__text {
    cursor: pointer;
    }
    .table-header-rename__cache__text:focus {
    outline: 0;
    }
    .table-header-rename__calendar__icon {
    margin-right: 4px;
    width: 16px;
    }
    .table-header-rename .renameable-wrapper--emphase .renameable-container__text {
    font-size: 1.75rem;
    font-family: "Crete Round";
    }
    .renameable-container {
    display: flex;
    align-items: baseline;
    margin-bottom: 6px;
    }
    .renameable-container__icon {
    margin-right: 4px;
    font-size: 14px;
    width: 16px;
    text-align: center;
    }
    .renameable-container__button {
    margin-left: 16px;
    }
    .annotation-run {
    cursor: pointer;
    }
    ......
    dist/styles/bootstrap-monotony.css
    View file @ 250ba032
    ......@@ -8634,10 +8634,6 @@ a:focus, a:hover {
    user-select: none;
    }
    .cache-toggle {
    cursor: pointer;
    }
    .side-panel {
    background-color: #fff;
    padding: 0.3em;
    ......@@ -8840,6 +8836,15 @@ select.form-control {
    top: 6px;
    }
    .nodes-lists-layout-tabs .nav.nav-tabs,
    .nodes-texts-layout-tabs .nav.nav-tabs,
    .nodes-annuaire-layout-tabs .nav.nav-tabs {
    margin-left: -32px;
    margin-right: -32px;
    padding-left: 32px;
    padding-right: 32px;
    }
    .jitsi-iframe {
    height: 70em;
    }
    ......@@ -8913,7 +8918,7 @@ select.form-control {
    margin-right: 8px;
    }
    .search-button-prepend .input-group-text {
    .ngrams-table-search-button .input-group-text {
    width: 41px;
    z-index: initial;
    }
    ......@@ -8956,6 +8961,9 @@ select.form-control {
    .ngrams-tree-edit-real__actions .b-button {
    margin-right: 8px;
    }
    .ngrams-tree-edit-real .ngrams-tree-loaded-node a:hover {
    text-decoration: line-through;
    }
    .loaded-ngrams-table-header {
    text-align: center;
    ......@@ -8991,6 +8999,60 @@ select.form-control {
    margin-left: 13px;
    }
    .table-header-rename {
    margin-bottom: 8px;
    }
    .table-header-rename__header {
    display: flex;
    align-items: center;
    }
    .table-header-rename__header__line {
    border-bottom: 1px solid #E9ECEF;
    border-top: none;
    height: 0;
    flex-grow: 1;
    margin-left: 32px;
    }
    .table-header-rename__cache {
    margin-top: 16px;
    }
    .table-header-rename__cache--on {
    font-weight: bold;
    }
    .table-header-rename__cache__button {
    margin-left: 16px;
    color: #666666;
    }
    .table-header-rename__cache__text {
    cursor: pointer;
    }
    .table-header-rename__cache__text:focus {
    outline: 0;
    }
    .table-header-rename__calendar__icon {
    margin-right: 4px;
    width: 16px;
    }
    .table-header-rename .renameable-wrapper--emphase .renameable-container__text {
    font-size: 1.75rem;
    font-family: "Open Sans";
    }
    .renameable-container {
    display: flex;
    align-items: baseline;
    margin-bottom: 6px;
    }
    .renameable-container__icon {
    margin-right: 4px;
    font-size: 14px;
    width: 16px;
    text-align: center;
    }
    .renameable-container__button {
    margin-left: 16px;
    }
    .annotation-run {
    cursor: pointer;
    }
    ......
    src/Gargantext/Components/NgramsTable.purs
    View file @ 250ba032
    ......@@ -398,8 +398,8 @@ type Props =
    type LoadedNgramsTableHeaderProps =
    ( searchQuery :: T.Box SearchQuery )
    loadedNgramsTableHeader :: R2.Component LoadedNgramsTableHeaderProps
    loadedNgramsTableHeader = R.createElement loadedNgramsTableHeaderCpt
    loadedNgramsTableHeader :: R2.Leaf LoadedNgramsTableHeaderProps
    loadedNgramsTableHeader = R2.leaf loadedNgramsTableHeaderCpt
    loadedNgramsTableHeaderCpt :: R.Component LoadedNgramsTableHeaderProps
    loadedNgramsTableHeaderCpt = here.component "loadedNgramsTableHeader" cpt where
    cpt { searchQuery } _ = pure $
    ......@@ -740,17 +740,17 @@ mainNgramsTable = R.createElement mainNgramsTableCpt
    mainNgramsTableCpt :: R.Component MainNgramsTableProps
    mainNgramsTableCpt = here.component "mainNgramsTable" cpt
    where
    cpt props@{ cacheState, path, session, tabType, treeEdit } _ = do
    cpt props@{ cacheState, path, treeEdit } _ = do
    searchQuery <- T.useFocused (_.searchQuery) (\a b -> b { searchQuery = a }) path
    cacheState' <- T.useLive T.unequal cacheState
    onCancelRef <- R.useRef Nothing
    onNgramsClickRef <- R.useRef Nothing
    onSaveRef <- R.useRef Nothing
    -- onCancelRef <- R.useRef Nothing
    -- onNgramsClickRef <- R.useRef Nothing
    -- onSaveRef <- R.useRef Nothing
    state <- T.useBox initialState
    ngramsLocalPatch <- T.useFocused (_.ngramsLocalPatch) (\a b -> b { ngramsLocalPatch = a }) state
    -- ngramsLocalPatch <- T.useFocused (_.ngramsLocalPatch) (\a b -> b { ngramsLocalPatch = a }) state
    nodeId <- T.useFocused (_.nodeId) (\a b -> b { nodeId = a }) path
    nodeId' <- T.useLive T.unequal nodeId
    -- nodeId <- T.useFocused (_.nodeId) (\a b -> b { nodeId = a }) path
    -- nodeId' <- T.useLive T.unequal nodeId
    -- let treeEdit = { box: treeEditBox
    -- , getNgramsChildren: getNgramsChildrenAff session nodeId' tabType
    ......@@ -763,17 +763,17 @@ mainNgramsTableCpt = here.component "mainNgramsTable" cpt
    case cacheState' of
    NT.CacheOn -> pure $ R.fragment
    [
    loadedNgramsTableHeader { searchQuery } []
    , mainNgramsTableCacheOn (Record.merge props { state }) []
    [ loadedNgramsTableHeader { searchQuery }
    , ngramsTreeEdit (treeEdit)
    , mainNgramsTableCacheOn (Record.merge props { state })
    ]
    NT.CacheOff -> pure $ R.fragment
    [
    loadedNgramsTableHeader { searchQuery } []
    , ngramsTreeEdit (treeEdit) []
    , mainNgramsTableCacheOff (Record.merge props { state }) []
    [loadedNgramsTableHeader { searchQuery }
    , ngramsTreeEdit (treeEdit)
    , mainNgramsTableCacheOff (Record.merge props { state })
    ]
    type NgramsTreeEditProps =
    ( box :: T.Box TreeEdit
    , getNgramsChildren :: NgramsTerm -> Aff (Array NgramsTerm)
    ......@@ -783,8 +783,8 @@ type NgramsTreeEditProps =
    , onSaveRef :: NgramsActionRef
    )
    ngramsTreeEdit :: R2.Component NgramsTreeEditProps
    ngramsTreeEdit = R.createElement ngramsTreeEditCpt
    ngramsTreeEdit :: R2.Leaf NgramsTreeEditProps
    ngramsTreeEdit = R2.leaf ngramsTreeEditCpt
    ngramsTreeEditCpt :: R.Component NgramsTreeEditProps
    ngramsTreeEditCpt = here.component "ngramsTreeEdit" cpt where
    cpt props@{ box } _ = do
    ......@@ -799,15 +799,15 @@ ngramsTreeEditCpt = here.component "ngramsTreeEdit" cpt where
    pure $ if isEditingFocused'
    then case ngramsParentFocused' of
    Nothing -> gutter
    Just ngramsParent' -> ngramsTreeEditReal (Record.merge props { ngramsParent' }) []
    Just ngramsParent' -> ngramsTreeEditReal (Record.merge props { ngramsParent' })
    else gutter
    type NgramsTreeEditRealProps =
    ( ngramsParent' :: NgramsTerm
    | NgramsTreeEditProps )
    ngramsTreeEditReal :: R2.Component NgramsTreeEditRealProps
    ngramsTreeEditReal = R.createElement ngramsTreeEditRealCpt
    ngramsTreeEditReal :: R2.Leaf NgramsTreeEditRealProps
    ngramsTreeEditReal = R2.leaf ngramsTreeEditRealCpt
    ngramsTreeEditRealCpt :: R.Component NgramsTreeEditRealProps
    ngramsTreeEditRealCpt = here.component "ngramsTreeEditReal" cpt where
    cpt { box
    ......@@ -922,8 +922,8 @@ type MainNgramsTableCacheProps =
    ( state :: T.Box State
    | MainNgramsTableProps )
    mainNgramsTableCacheOn :: R2.Component MainNgramsTableCacheProps
    mainNgramsTableCacheOn = R.createElement mainNgramsTableCacheOnCpt
    mainNgramsTableCacheOn :: R2.Leaf MainNgramsTableCacheProps
    mainNgramsTableCacheOn = R2.leaf mainNgramsTableCacheOnCpt
    mainNgramsTableCacheOnCpt :: R.Component MainNgramsTableCacheProps
    mainNgramsTableCacheOnCpt = here.component "mainNgramsTableCacheOn" cpt where
    cpt { afterSync
    ......@@ -969,8 +969,8 @@ mainNgramsTableCacheOnCpt = here.component "mainNgramsTableCacheOn" cpt where
    handleResponse :: VersionedNgramsTable -> VersionedNgramsTable
    handleResponse v = v
    mainNgramsTableCacheOff :: R2.Component MainNgramsTableCacheProps
    mainNgramsTableCacheOff = R.createElement mainNgramsTableCacheOffCpt
    mainNgramsTableCacheOff :: R2.Leaf MainNgramsTableCacheProps
    mainNgramsTableCacheOff = R2.leaf mainNgramsTableCacheOffCpt
    mainNgramsTableCacheOffCpt :: R.Component MainNgramsTableCacheProps
    mainNgramsTableCacheOffCpt = here.component "mainNgramsTableCacheOff" cpt where
    cpt { afterSync
    ......
    src/Gargantext/Components/NgramsTable/Search.purs
    View file @ 250ba032
    ......@@ -45,42 +45,73 @@ type SearchButtonProps =
    searchButton :: R2.Component SearchButtonProps
    searchButton = R.createElement searchButtonCpt
    searchButtonCpt :: R.Component SearchButtonProps
    searchButtonCpt = here.component "searchButton" cpt where
    cpt { inputRef, searchQuery } _ = do
    -- | States
    -- |
    searchQuery' <- T.useLive T.unequal searchQuery
    -- | Behaviors
    -- |
    let
    onReset _ = do
    R2.setInputValue inputRef ""
    T.write_ "" searchQuery
    onSubmit _ = do
    T.write_ (R2.getInputValue inputRef) searchQuery
    -- | Render
    -- |
    pure $
    H.div
    { className: "search-button-append input-group-append" }
    { className: intercalate " "
    [ "ngrams-table-search-button"
    , "input-group-append"
    ]
    }
    [
    if searchQuery' /= ""
    then
    R.fragment
    [ B.button
    [
    B.button
    { variant: ButtonVariant Light
    , callback: \_ -> do
    R2.setInputValue inputRef ""
    T.write_ "" searchQuery
    , className: "input-group-text" }
    [ B.icon
    , callback: onReset
    , className: "input-group-text"
    }
    [
    B.icon
    { name: "times"
    , className: "text-danger"
    }
    ]
    , B.button { callback: \_ -> T.write_ (R2.getInputValue inputRef) searchQuery
    , className: "input-group-text" }
    [ B.icon { name: "search" }
    ,
    B.button
    { variant: ButtonVariant Light
    , callback: onSubmit
    , className: "input-group-text"
    }
    [ B.icon
    { name: "search"
    , className: "text-secondary"
    }
    ]
    ]
    else
    B.button { callback: \_ -> T.write_ (R2.getInputValue inputRef) searchQuery
    , className: "input-group-text" }
    [ B.icon
    { name: "search" }
    ]
    B.button
    { variant: ButtonVariant Light
    , callback: onSubmit
    , className: "input-group-text"
    }
    [ B.icon
    { name: "search"
    , className: "text-secondary"
    }
    ]
    ]
    type SearchFieldInputProps =
    ......@@ -109,4 +140,3 @@ searchFieldInputCpt = here.component "searchFieldInput" cpt where
    T.write_ (R2.getInputValue inputRef) searchQuery
    else
    pure unit
    src/Gargantext/Components/Nodes/Annuaire/Tabs.purs
    View file @ 250ba032
    ......@@ -68,7 +68,12 @@ tabsCpt = here.component "tabs" cpt where
    yearFilter <- T.useBox (Nothing :: Maybe Year)
    chartReload <- T.useBox T2.newReload
    pure $ Tab.tabs { activeTab, tabs: tabs' yearFilter chartReload props }
    pure $
    Tab.tabs
    { activeTab
    , tabs: tabs' yearFilter chartReload props
    , className: "nodes-annuaire-layout-tabs"
    }
    tabs' yearFilter chartReload props@{ boxes, defaultListId, sidePanel } =
    [ "Documents" /\ docs
    , "Patents" /\ ngramsView (viewProps Patents)
    ......