Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
P
purescript-gargantext
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Grégoire Locqueville
purescript-gargantext
Commits
2f2b9b24
Commit
2f2b9b24
authored
1 year ago
by
Alexandre Delanoë
Browse files
Options
Browse Files
Download
Plain Diff
Merge remote-tracking branch 'origin/arturo-dev-node-term-rerendering-rc1.x' into dev-merge
parents
06a7913d
70eae499
Changes
11
Hide whitespace changes
Inline
Side-by-side
Showing
11 changed files
with
370 additions
and
246 deletions
+370
-246
bootstrap-darkster.css
dist/styles/bootstrap-darkster.css
+41
-30
bootstrap-default.css
dist/styles/bootstrap-default.css
+41
-30
bootstrap-greyson.css
dist/styles/bootstrap-greyson.css
+41
-30
bootstrap-herbie.css
dist/styles/bootstrap-herbie.css
+41
-30
bootstrap-monotony.css
dist/styles/bootstrap-monotony.css
+41
-30
NgramsTable.purs
src/Gargantext/Components/NgramsTable.purs
+35
-28
Tree.purs
src/Gargantext/Components/NgramsTable/Tree.purs
+73
-31
Tabs.purs
src/Gargantext/Components/Nodes/Annuaire/Tabs.purs
+2
-1
Tabs.purs
...gantext/Components/Nodes/Annuaire/User/Contacts/Tabs.purs
+2
-1
Tabs.purs
src/Gargantext/Components/Nodes/Lists/Tabs.purs
+2
-1
_list.sass
src/sass/_legacy/_list.sass
+51
-34
No files found.
dist/styles/bootstrap-darkster.css
View file @
2f2b9b24
...
...
@@ -10887,22 +10887,12 @@ select.form-control {
z-index
:
initial
;
}
.ngrams-table-container__header
{
display
:
flex
;
align-items
:
center
;
justify-content
:
space-between
;
background-color
:
#0d0d0d
;
position
:
sticky
;
top
:
56px
;
z-index
:
2
;
padding
:
0.75rem
1.25rem
;
border-bottom
:
1px
solid
#dee2e6
;
}
.ngrams-table-container__navigation
{
display
:
flex
;
justify-content
:
space-between
;
align-items
:
center
;
margin-bottom
:
8px
;
margin-top
:
16px
;
margin-bottom
:
16px
;
}
.ngrams-table-container__add-term
{
margin-top
:
12px
;
...
...
@@ -10921,20 +10911,46 @@ select.form-control {
top
:
1px
;
padding-right
:
8px
;
}
.ngrams-table-container__
action-term
{
.ngrams-table-container__
selection-cta
{
margin-left
:
12px
;
display
:
flex
;
align-items
:
center
;
gap
:
8px
;
font-size
:
1
4
px
;
font-size
:
1
5
px
;
}
.ngrams-table-container__action-term
::before
{
content
:
"┌"
;
color
:
#6C757D
;
font-size
:
18px
;
line-height
:
0
;
position
:
relative
;
padding-right
:
16px
;
.ngrams-table-container__table-wrapper
{
margin-left
:
-16px
;
margin-right
:
-16px
;
margin-bottom
:
-32px
;
}
.ngrams-table-container__actions
{
display
:
flex
;
align-items
:
center
;
justify-content
:
space-between
;
background-color
:
#000000
;
position
:
sticky
;
top
:
56px
;
z-index
:
2
;
padding
:
0.75rem
16px
;
border-bottom
:
2px
solid
#dee2e6
;
}
.ngrams-table-container__table
{
display
:
flex
;
gap
:
16px
;
}
.ngrams-table-container__table
.ngrams-tree-edit-real
{
width
:
416px
;
min-width
:
264px
;
flex-grow
:
0
;
flex-shrink
:
1
;
align-self
:
flex-start
;
position
:
sticky
;
margin-top
:
16px
;
margin-bottom
:
16px
;
top
:
calc
(
56px
+
64px
+
16px
);
}
.ngrams-table-container__table
thead
th
{
border-top-width
:
0
;
}
.ngrams-table-container__table
tbody
{
padding-left
:
1.25rem
;
...
...
@@ -10951,10 +10967,8 @@ select.form-control {
outline
:
0
;
}
.ngrams-table-container__table
th
:nth-child
(
2
)
{
padding-left
:
32px
;
}
.ngrams-table-container__table
th
:nth-child
(
3
)
{
width
:
25%
;
min-width
:
280px
;
}
.ngrams-table-container__table
td
:nth-child
(
1
)
{
padding
:
initial
;
...
...
@@ -10970,23 +10984,20 @@ select.form-control {
}
.ngrams-table-container__table
td
:nth-child
(
2
)
{
padding-left
:
32px
;
margin-left
:
12px
;
}
.ngrams-table-container__table
td
:nth-child
(
2
)
.tree-loaded-plus
{
.ngrams-table-container__table
td
:nth-child
(
3
)
.tree-loaded-plus
{
visibility
:
hidden
;
position
:
relative
;
top
:
1px
;
margin-left
:
12
px
;
margin-left
:
8
px
;
}
.ngrams-table-container__table
tr
:hover
.tree-loaded-plus
{
visibility
:
unset
;
}
.ngrams-tree-edit-real
{
min-width
:
416px
;
width
:
fit-content
;
border-color
:
#FF550B
;
margin-top
:
16px
;
margin-bottom
:
16px
;
}
.ngrams-tree-edit-real__actions
{
display
:
flex
;
...
...
This diff is collapsed.
Click to expand it.
dist/styles/bootstrap-default.css
View file @
2f2b9b24
...
...
@@ -10834,22 +10834,12 @@ select.form-control {
z-index
:
initial
;
}
.ngrams-table-container__header
{
display
:
flex
;
align-items
:
center
;
justify-content
:
space-between
;
background-color
:
#fff
;
position
:
sticky
;
top
:
56px
;
z-index
:
2
;
padding
:
0.75rem
1.25rem
;
border-bottom
:
1px
solid
#dee2e6
;
}
.ngrams-table-container__navigation
{
display
:
flex
;
justify-content
:
space-between
;
align-items
:
center
;
margin-bottom
:
8px
;
margin-top
:
16px
;
margin-bottom
:
16px
;
}
.ngrams-table-container__add-term
{
margin-top
:
12px
;
...
...
@@ -10868,20 +10858,46 @@ select.form-control {
top
:
1px
;
padding-right
:
8px
;
}
.ngrams-table-container__
action-term
{
.ngrams-table-container__
selection-cta
{
margin-left
:
12px
;
display
:
flex
;
align-items
:
center
;
gap
:
8px
;
font-size
:
1
4
px
;
font-size
:
1
5
px
;
}
.ngrams-table-container__action-term
::before
{
content
:
"┌"
;
color
:
#CED4DA
;
font-size
:
18px
;
line-height
:
0
;
position
:
relative
;
padding-right
:
16px
;
.ngrams-table-container__table-wrapper
{
margin-left
:
-16px
;
margin-right
:
-16px
;
margin-bottom
:
-32px
;
}
.ngrams-table-container__actions
{
display
:
flex
;
align-items
:
center
;
justify-content
:
space-between
;
background-color
:
#fff
;
position
:
sticky
;
top
:
56px
;
z-index
:
2
;
padding
:
0.75rem
16px
;
border-bottom
:
2px
solid
#dee2e6
;
}
.ngrams-table-container__table
{
display
:
flex
;
gap
:
16px
;
}
.ngrams-table-container__table
.ngrams-tree-edit-real
{
width
:
416px
;
min-width
:
264px
;
flex-grow
:
0
;
flex-shrink
:
1
;
align-self
:
flex-start
;
position
:
sticky
;
margin-top
:
16px
;
margin-bottom
:
16px
;
top
:
calc
(
56px
+
64px
+
16px
);
}
.ngrams-table-container__table
thead
th
{
border-top-width
:
0
;
}
.ngrams-table-container__table
tbody
{
padding-left
:
1.25rem
;
...
...
@@ -10898,10 +10914,8 @@ select.form-control {
outline
:
0
;
}
.ngrams-table-container__table
th
:nth-child
(
2
)
{
padding-left
:
32px
;
}
.ngrams-table-container__table
th
:nth-child
(
3
)
{
width
:
25%
;
min-width
:
280px
;
}
.ngrams-table-container__table
td
:nth-child
(
1
)
{
padding
:
initial
;
...
...
@@ -10917,23 +10931,20 @@ select.form-control {
}
.ngrams-table-container__table
td
:nth-child
(
2
)
{
padding-left
:
32px
;
margin-left
:
12px
;
}
.ngrams-table-container__table
td
:nth-child
(
2
)
.tree-loaded-plus
{
.ngrams-table-container__table
td
:nth-child
(
3
)
.tree-loaded-plus
{
visibility
:
hidden
;
position
:
relative
;
top
:
1px
;
margin-left
:
12
px
;
margin-left
:
8
px
;
}
.ngrams-table-container__table
tr
:hover
.tree-loaded-plus
{
visibility
:
unset
;
}
.ngrams-tree-edit-real
{
min-width
:
416px
;
width
:
fit-content
;
border-color
:
#005a9a
;
margin-top
:
16px
;
margin-bottom
:
16px
;
}
.ngrams-tree-edit-real__actions
{
display
:
flex
;
...
...
This diff is collapsed.
Click to expand it.
dist/styles/bootstrap-greyson.css
View file @
2f2b9b24
...
...
@@ -10596,22 +10596,12 @@ select.form-control {
z-index
:
initial
;
}
.ngrams-table-container__header
{
display
:
flex
;
align-items
:
center
;
justify-content
:
space-between
;
background-color
:
#fff
;
position
:
sticky
;
top
:
56px
;
z-index
:
2
;
padding
:
0.75rem
1.25rem
;
border-bottom
:
1px
solid
#dee2e6
;
}
.ngrams-table-container__navigation
{
display
:
flex
;
justify-content
:
space-between
;
align-items
:
center
;
margin-bottom
:
8px
;
margin-top
:
16px
;
margin-bottom
:
16px
;
}
.ngrams-table-container__add-term
{
margin-top
:
12px
;
...
...
@@ -10630,20 +10620,46 @@ select.form-control {
top
:
1px
;
padding-right
:
8px
;
}
.ngrams-table-container__
action-term
{
.ngrams-table-container__
selection-cta
{
margin-left
:
12px
;
display
:
flex
;
align-items
:
center
;
gap
:
8px
;
font-size
:
1
4
px
;
font-size
:
1
5
px
;
}
.ngrams-table-container__action-term
::before
{
content
:
"┌"
;
color
:
#CED4DA
;
font-size
:
18px
;
line-height
:
0
;
position
:
relative
;
padding-right
:
16px
;
.ngrams-table-container__table-wrapper
{
margin-left
:
-16px
;
margin-right
:
-16px
;
margin-bottom
:
-32px
;
}
.ngrams-table-container__actions
{
display
:
flex
;
align-items
:
center
;
justify-content
:
space-between
;
background-color
:
#fff
;
position
:
sticky
;
top
:
56px
;
z-index
:
2
;
padding
:
0.75rem
16px
;
border-bottom
:
2px
solid
#dee2e6
;
}
.ngrams-table-container__table
{
display
:
flex
;
gap
:
16px
;
}
.ngrams-table-container__table
.ngrams-tree-edit-real
{
width
:
416px
;
min-width
:
264px
;
flex-grow
:
0
;
flex-shrink
:
1
;
align-self
:
flex-start
;
position
:
sticky
;
margin-top
:
16px
;
margin-bottom
:
16px
;
top
:
calc
(
56px
+
64px
+
16px
);
}
.ngrams-table-container__table
thead
th
{
border-top-width
:
0
;
}
.ngrams-table-container__table
tbody
{
padding-left
:
1.25rem
;
...
...
@@ -10660,10 +10676,8 @@ select.form-control {
outline
:
0
;
}
.ngrams-table-container__table
th
:nth-child
(
2
)
{
padding-left
:
32px
;
}
.ngrams-table-container__table
th
:nth-child
(
3
)
{
width
:
25%
;
min-width
:
280px
;
}
.ngrams-table-container__table
td
:nth-child
(
1
)
{
padding
:
initial
;
...
...
@@ -10679,23 +10693,20 @@ select.form-control {
}
.ngrams-table-container__table
td
:nth-child
(
2
)
{
padding-left
:
32px
;
margin-left
:
12px
;
}
.ngrams-table-container__table
td
:nth-child
(
2
)
.tree-loaded-plus
{
.ngrams-table-container__table
td
:nth-child
(
3
)
.tree-loaded-plus
{
visibility
:
hidden
;
position
:
relative
;
top
:
1px
;
margin-left
:
12
px
;
margin-left
:
8
px
;
}
.ngrams-table-container__table
tr
:hover
.tree-loaded-plus
{
visibility
:
unset
;
}
.ngrams-tree-edit-real
{
min-width
:
416px
;
width
:
fit-content
;
border-color
:
#2f3c48
;
margin-top
:
16px
;
margin-bottom
:
16px
;
}
.ngrams-tree-edit-real__actions
{
display
:
flex
;
...
...
This diff is collapsed.
Click to expand it.
dist/styles/bootstrap-herbie.css
View file @
2f2b9b24
...
...
@@ -10844,22 +10844,12 @@ select.form-control {
z-index
:
initial
;
}
.ngrams-table-container__header
{
display
:
flex
;
align-items
:
center
;
justify-content
:
space-between
;
background-color
:
#fff
;
position
:
sticky
;
top
:
56px
;
z-index
:
2
;
padding
:
0.75rem
1.25rem
;
border-bottom
:
1px
solid
#dee2e6
;
}
.ngrams-table-container__navigation
{
display
:
flex
;
justify-content
:
space-between
;
align-items
:
center
;
margin-bottom
:
8px
;
margin-top
:
16px
;
margin-bottom
:
16px
;
}
.ngrams-table-container__add-term
{
margin-top
:
12px
;
...
...
@@ -10878,20 +10868,46 @@ select.form-control {
top
:
1px
;
padding-right
:
8px
;
}
.ngrams-table-container__
action-term
{
.ngrams-table-container__
selection-cta
{
margin-left
:
12px
;
display
:
flex
;
align-items
:
center
;
gap
:
8px
;
font-size
:
1
4
px
;
font-size
:
1
5
px
;
}
.ngrams-table-container__action-term
::before
{
content
:
"┌"
;
color
:
#CED4DA
;
font-size
:
18px
;
line-height
:
0
;
position
:
relative
;
padding-right
:
16px
;
.ngrams-table-container__table-wrapper
{
margin-left
:
-16px
;
margin-right
:
-16px
;
margin-bottom
:
-32px
;
}
.ngrams-table-container__actions
{
display
:
flex
;
align-items
:
center
;
justify-content
:
space-between
;
background-color
:
#fff
;
position
:
sticky
;
top
:
56px
;
z-index
:
2
;
padding
:
0.75rem
16px
;
border-bottom
:
2px
solid
#dee2e6
;
}
.ngrams-table-container__table
{
display
:
flex
;
gap
:
16px
;
}
.ngrams-table-container__table
.ngrams-tree-edit-real
{
width
:
416px
;
min-width
:
264px
;
flex-grow
:
0
;
flex-shrink
:
1
;
align-self
:
flex-start
;
position
:
sticky
;
margin-top
:
16px
;
margin-bottom
:
16px
;
top
:
calc
(
56px
+
64px
+
16px
);
}
.ngrams-table-container__table
thead
th
{
border-top-width
:
0
;
}
.ngrams-table-container__table
tbody
{
padding-left
:
1.25rem
;
...
...
@@ -10908,10 +10924,8 @@ select.form-control {
outline
:
0
;
}
.ngrams-table-container__table
th
:nth-child
(
2
)
{
padding-left
:
32px
;
}
.ngrams-table-container__table
th
:nth-child
(
3
)
{
width
:
25%
;
min-width
:
280px
;
}
.ngrams-table-container__table
td
:nth-child
(
1
)
{
padding
:
initial
;
...
...
@@ -10927,23 +10941,20 @@ select.form-control {
}
.ngrams-table-container__table
td
:nth-child
(
2
)
{
padding-left
:
32px
;
margin-left
:
12px
;
}
.ngrams-table-container__table
td
:nth-child
(
2
)
.tree-loaded-plus
{
.ngrams-table-container__table
td
:nth-child
(
3
)
.tree-loaded-plus
{
visibility
:
hidden
;
position
:
relative
;
top
:
1px
;
margin-left
:
12
px
;
margin-left
:
8
px
;
}
.ngrams-table-container__table
tr
:hover
.tree-loaded-plus
{
visibility
:
unset
;
}
.ngrams-tree-edit-real
{
min-width
:
416px
;
width
:
fit-content
;
border-color
:
#083358
;
margin-top
:
16px
;
margin-bottom
:
16px
;
}
.ngrams-tree-edit-real__actions
{
display
:
flex
;
...
...
This diff is collapsed.
Click to expand it.
dist/styles/bootstrap-monotony.css
View file @
2f2b9b24
...
...
@@ -10845,22 +10845,12 @@ select.form-control {
z-index
:
initial
;
}
.ngrams-table-container__header
{
display
:
flex
;
align-items
:
center
;
justify-content
:
space-between
;
background-color
:
#fff
;
position
:
sticky
;
top
:
56px
;
z-index
:
2
;
padding
:
0.75rem
1.25rem
;
border-bottom
:
1px
solid
#dee2e6
;
}
.ngrams-table-container__navigation
{
display
:
flex
;
justify-content
:
space-between
;
align-items
:
center
;
margin-bottom
:
8px
;
margin-top
:
16px
;
margin-bottom
:
16px
;
}
.ngrams-table-container__add-term
{
margin-top
:
12px
;
...
...
@@ -10879,20 +10869,46 @@ select.form-control {
top
:
1px
;
padding-right
:
8px
;
}
.ngrams-table-container__
action-term
{
.ngrams-table-container__
selection-cta
{
margin-left
:
12px
;
display
:
flex
;
align-items
:
center
;
gap
:
8px
;
font-size
:
1
4
px
;
font-size
:
1
5
px
;
}
.ngrams-table-container__action-term
::before
{
content
:
"┌"
;
color
:
#CED4DA
;
font-size
:
18px
;
line-height
:
0
;
position
:
relative
;
padding-right
:
16px
;
.ngrams-table-container__table-wrapper
{
margin-left
:
-16px
;
margin-right
:
-16px
;
margin-bottom
:
-32px
;
}
.ngrams-table-container__actions
{
display
:
flex
;
align-items
:
center
;
justify-content
:
space-between
;
background-color
:
#fff
;
position
:
sticky
;
top
:
56px
;
z-index
:
2
;
padding
:
0.75rem
16px
;
border-bottom
:
2px
solid
#dee2e6
;
}
.ngrams-table-container__table
{
display
:
flex
;
gap
:
16px
;
}
.ngrams-table-container__table
.ngrams-tree-edit-real
{
width
:
416px
;
min-width
:
264px
;
flex-grow
:
0
;
flex-shrink
:
1
;
align-self
:
flex-start
;
position
:
sticky
;
margin-top
:
16px
;
margin-bottom
:
16px
;
top
:
calc
(
56px
+
64px
+
16px
);
}
.ngrams-table-container__table
thead
th
{
border-top-width
:
0
;
}
.ngrams-table-container__table
tbody
{
padding-left
:
1.25rem
;
...
...
@@ -10909,10 +10925,8 @@ select.form-control {
outline
:
0
;
}
.ngrams-table-container__table
th
:nth-child
(
2
)
{
padding-left
:
32px
;
}
.ngrams-table-container__table
th
:nth-child
(
3
)
{
width
:
25%
;
min-width
:
280px
;
}
.ngrams-table-container__table
td
:nth-child
(
1
)
{
padding
:
initial
;
...
...
@@ -10928,23 +10942,20 @@ select.form-control {
}
.ngrams-table-container__table
td
:nth-child
(
2
)
{
padding-left
:
32px
;
margin-left
:
12px
;
}
.ngrams-table-container__table
td
:nth-child
(
2
)
.tree-loaded-plus
{
.ngrams-table-container__table
td
:nth-child
(
3
)
.tree-loaded-plus
{
visibility
:
hidden
;
position
:
relative
;
top
:
1px
;
margin-left
:
12
px
;
margin-left
:
8
px
;
}
.ngrams-table-container__table
tr
:hover
.tree-loaded-plus
{
visibility
:
unset
;
}
.ngrams-tree-edit-real
{
min-width
:
416px
;
width
:
fit-content
;
border-color
:
#222222
;
margin-top
:
16px
;
margin-bottom
:
16px
;
}
.ngrams-tree-edit-real__actions
{
display
:
flex
;
...
...
This diff is collapsed.
Click to expand it.
src/Gargantext/Components/NgramsTable.purs
View file @
2f2b9b24
...
...
@@ -3,7 +3,7 @@ module Gargantext.Components.NgramsTable
, CommonProps
, TreeEdit
, NgramsTreeEditProps
, getNgramsChildrenAff
, getNgramsChildrenAff
Request
, initialTreeEdit
, mainNgramsTable
) where
...
...
@@ -127,13 +127,15 @@ type PreConversionRows = Seq.Seq NgramsElement
type TableContainerProps =
( addCallback :: String -> Effect Unit
, dispatch :: Dispatch
, getNgramsChildren :: NgramsTerm -> Aff (Array NgramsTerm)
, getNgramsChildrenAff :: Maybe (NgramsTerm -> Aff (Array NgramsTerm))
, getNgramsChildren :: Maybe (NgramsTerm -> Array NgramsTerm)
, ngramsSelection :: Set NgramsTerm
, ngramsTable :: NgramsTable
, path :: T.Box PageParams
, queryExactMatches :: Boolean
, syncResetButton :: Array R.Element
, tabNgramType :: CTabNgramType
, treeEdit :: Record NgramsTreeEditProps
)
tableContainer :: Record TableContainerProps -> Record TT.TableContainerProps -> R.Element
...
...
@@ -141,13 +143,13 @@ tableContainer p q = R.createElement (tableContainerCpt p) q []
tableContainerCpt :: Record TableContainerProps -> R.Component TT.TableContainerProps
tableContainerCpt { addCallback
, dispatch
, getNgramsChildren
, ngramsSelection
, ngramsTable: ngramsTableCache
, path
, queryExactMatches
, syncResetButton
, tabNgramType
, treeEdit
} = here.component "tableContainer" cpt where
cpt props _ = do
-- | States
...
...
@@ -186,7 +188,7 @@ tableContainerCpt { addCallback
pure $
H.div
{ class
n
ame: "ngrams-table-container" }
{ class
N
ame: "ngrams-table-container" }
[
-- Portal filters
...
...
@@ -278,15 +280,19 @@ tableContainerCpt { addCallback
]
,
H.div
{ className: "
card
" }
{ className: "
ngrams-table-container__table-wrapper
" }
[
H.div
{ className: intercalate " "
[ "ngrams-table-container__
header
"
[ "ngrams-table-container__
actions
"
]
}
[
B.wad
[]
syncResetButton
,
B.wad
[]
[
...
...
@@ -294,10 +300,6 @@ tableContainerCpt { addCallback
selectButtons (selectionsLength ngramsSelection)
]
,
B.wad
[]
syncResetButton
]
,
H.div
...
...
@@ -319,6 +321,8 @@ tableContainerCpt { addCallback
{}
props.tableBody
]
,
ngramsTreeEdit (treeEdit)
]
]
]
...
...
@@ -346,7 +350,7 @@ tableContainerCpt { addCallback
selectButtons 0 = mempty
selectButtons count =
H.div
{ className: "ngrams-table-container__
action-term
" }
{ className: "ngrams-table-container__
selection-cta
" }
[
B.wad
[]
...
...
@@ -502,7 +506,7 @@ loadedNgramsTableBodyCpt = here.component "loadedNgramsTableBody" cpt where
, path
, state
, tabNgramType
, treeEdit: treeEdit@{ getNgramsChildren }
, treeEdit: treeEdit@{ getNgramsChildren
Aff, getNgramsChildren
}
, versioned: Versioned { data: initTable }
} _ = do
treeEdit'@{ ngramsParent } <- T.useLive T.unequal treeEdit.box
...
...
@@ -562,6 +566,7 @@ loadedNgramsTableBodyCpt = here.component "loadedNgramsTableBody" cpt where
convertRow ngramsElement =
{ row: renderNgramsItem { dispatch: performAction
, getNgramsChildrenAff
, getNgramsChildren
, isEditing
, ngrams: ngramsElement ^. _NgramsElement <<< _ngrams
...
...
@@ -629,6 +634,7 @@ loadedNgramsTableBodyCpt = here.component "loadedNgramsTableBody" cpt where
, container: tableContainer
{ addCallback
, dispatch: performAction
, getNgramsChildrenAff
, getNgramsChildren
, ngramsSelection
, ngramsTable
...
...
@@ -636,6 +642,7 @@ loadedNgramsTableBodyCpt = here.component "loadedNgramsTableBody" cpt where
, queryExactMatches: exactMatches
, syncResetButton: [ syncResetButton ]
, tabNgramType
, treeEdit
}
, params
, rows: filteredConvertedRows
...
...
@@ -650,7 +657,7 @@ loadedNgramsTableBodyCpt = here.component "loadedNgramsTableBody" cpt where
scoreType
}
where
colNames = TT.ColumnName <$> [ "Select", "
Terms", "Score
"] -- see convOrderBy
colNames = TT.ColumnName <$> [ "Select", "
Score", "Terms
"] -- see convOrderBy
ngramsTableOrderWith :: Maybe (TT.OrderByDirection TT.ColumnName)
-> Seq.Seq NgramsElement
...
...
@@ -783,8 +790,8 @@ type MainNgramsTableProps = (
| CommonProps
)
getNgramsChildrenAff :: Session -> NodeID -> Array ListId -> TabType -> NgramsTerm -> Aff (Array NgramsTerm)
getNgramsChildrenAff session nodeId listIds tabType (NormNgramsTerm ngrams) = do
getNgramsChildrenAff
Request
:: Session -> NodeID -> Array ListId -> TabType -> NgramsTerm -> Aff (Array NgramsTerm)
getNgramsChildrenAff
Request
session nodeId listIds tabType (NormNgramsTerm ngrams) = do
res :: Either RESTError ({ data :: Array { children :: Array String, ngrams :: String }}) <- get session $ Routes.GetNgrams params (Just nodeId)
case res of
Left err -> pure []
...
...
@@ -831,23 +838,22 @@ mainNgramsTableCpt = here.component "mainNgramsTable" cpt
case cacheState' of
NT.CacheOn -> pure $ R.fragment
[ loadedNgramsTableHeader { searchQuery, params }
, ngramsTreeEdit (treeEdit)
, mainNgramsTableCacheOn (Record.merge props { state })
]
NT.CacheOff -> pure $ R.fragment
[loadedNgramsTableHeader { searchQuery, params}
, ngramsTreeEdit (treeEdit)
, mainNgramsTableCacheOff (Record.merge props { state })
]
type NgramsTreeEditProps =
( box :: T.Box TreeEdit
, getNgramsChildren :: NgramsTerm -> Aff (Array NgramsTerm)
( box :: T.Box TreeEdit
, getNgramsChildrenAff :: Maybe (NgramsTerm -> Aff (Array NgramsTerm))
, getNgramsChildren :: Maybe (NgramsTerm -> Array NgramsTerm)
--, ngramsLocalPatch :: T.Box NgramsTablePatch
, onCancelRef :: NgramsActionRef
, onNgramsClickRef :: R.Ref (Maybe NgramsClick)
, onSaveRef :: NgramsActionRef
, onCancelRef
:: NgramsActionRef
, onNgramsClickRef
:: R.Ref (Maybe NgramsClick)
, onSaveRef
:: NgramsActionRef
)
ngramsTreeEdit :: R2.Leaf NgramsTreeEditProps
...
...
@@ -860,14 +866,13 @@ ngramsTreeEditCpt = here.component "ngramsTreeEdit" cpt where
ngramsParentFocused <- T.useFocused (_.ngramsParent) (\a b -> b { ngramsParent = a}) box
ngramsParentFocused' <- T.useLive T.unequal ngramsParentFocused
let
gutter = B.wad_ [ "mb-2", "d-inline-block" ]
pure $ if isEditingFocused'
pure $
if isEditingFocused'
then case ngramsParentFocused' of
Nothing ->
gutter
Nothing ->
mempty
Just ngramsParent' -> ngramsTreeEditReal (Record.merge props { ngramsParent' })
else
gutter
else
mempty
type NgramsTreeEditRealProps =
( ngramsParent' :: NgramsTerm
...
...
@@ -878,6 +883,7 @@ ngramsTreeEditReal = R2.leaf ngramsTreeEditRealCpt
ngramsTreeEditRealCpt :: R.Component NgramsTreeEditRealProps
ngramsTreeEditRealCpt = here.component "ngramsTreeEditReal" cpt where
cpt { box
, getNgramsChildrenAff
, getNgramsChildren
, ngramsParent'
, onCancelRef
...
...
@@ -936,7 +942,8 @@ ngramsTreeEditRealCpt = here.component "ngramsTreeEditReal" cpt where
{ className: "card-body" }
[
renderNgramsTree
{ getNgramsChildren: gnc
{ getNgramsChildrenAff: Just gnc
, getNgramsChildren: Nothing
, ngramsClick
, ngramsDepth
, ngramsEdit
...
...
This diff is collapsed.
Click to expand it.
src/Gargantext/Components/NgramsTable/Tree.purs
View file @
2f2b9b24
...
...
@@ -3,7 +3,6 @@ module Gargantext.Components.NgramsTable.Tree where
import Gargantext.Prelude
import Data.Array as A
import Data.Either (Either(..))
import Data.Lens ((^..), (^.), view)
import Data.Lens.Fold (folded)
import Data.Lens.Index (ix)
...
...
@@ -12,16 +11,16 @@ import Data.List as L
import Data.Maybe (Maybe(..), maybe)
import Data.Set (Set)
import Data.Set as Set
import Data.Tuple.Nested ((/\))
import Effect (Effect)
import Effect.Aff (Aff)
import Effect.Aff (Aff, launchAff_)
import Effect.Class (liftEffect)
import Gargantext.Components.Bootstrap as B
import Gargantext.Components.Bootstrap.Types (
ComponentStatus(..),
Variant(..))
import Gargantext.Components.Bootstrap.Types (Variant(..))
import Gargantext.Components.Table as Tbl
import Gargantext.Config.REST (logRESTError)
import Gargantext.Core.NgramsTable.Functions (applyNgramsPatches, setTermListA, tablePatchHasNgrams)
import Gargantext.Core.NgramsTable.Types (Action(..), NgramsClick, NgramsDepth, NgramsElement, NgramsTable, NgramsTablePatch, NgramsTerm, _NgramsElement, _NgramsRepoElement, _children, _list, _ngrams, _occurrences, ngramsTermText, replace)
import Gargantext.Hooks.Loader (useLoader)
import Gargantext.Prelude (Unit, bind, const, map, mempty, not, otherwise, pure, show, unit, ($), (+), (<<<), (<>), (==), (>), (||))
import Gargantext.Hooks.FirstEffect (useFirstEffect')
import Gargantext.Types as GT
import Gargantext.Utils ((?))
import Gargantext.Utils.Reactix as R2
...
...
@@ -38,7 +37,8 @@ here = R2.here "Gargantext.Components.NgramsTable.Tree"
type RenderNgramsTree =
( getNgramsChildren :: NgramsTerm -> Aff (Array NgramsTerm)
( getNgramsChildrenAff :: Maybe (NgramsTerm -> Aff (Array NgramsTerm))
, getNgramsChildren :: Maybe (NgramsTerm -> Array NgramsTerm)
--, ngramsChildren :: List NgramsTerm
, ngramsClick :: NgramsClick
, ngramsDepth :: NgramsDepth
...
...
@@ -53,13 +53,20 @@ renderNgramsTree p = R.createElement renderNgramsTreeCpt p []
renderNgramsTreeCpt :: R.Component RenderNgramsTree
renderNgramsTreeCpt = here.component "renderNgramsTree" cpt
where
cpt { getNgramsChildren, ngramsClick, ngramsDepth, ngramsEdit, ngramsStyle } _ = do
cpt { getNgramsChildrenAff
, getNgramsChildren
, ngramsClick
, ngramsDepth
, ngramsEdit
, ngramsStyle
} _ = do
pure $
H.ul
{ className: "render-ngrams-tree" }
[ H.span { className: "tree" }
[ H.span { className: "righthanded" }
[ tree { getNgramsChildren
, getNgramsChildrenAff
--, ngramsChildren
, ngramsClick
, ngramsDepth
...
...
@@ -88,28 +95,61 @@ tag tagProps =
-}
type TreeProps =
( getNgramsChildren :: NgramsTerm -> Aff (Array NgramsTerm)
, ngramsEdit :: NgramsClick
( getNgramsChildrenAff :: Maybe (NgramsTerm -> Aff (Array NgramsTerm))
, getNgramsChildren :: Maybe (NgramsTerm -> Array NgramsTerm)
, ngramsEdit :: NgramsClick
--, ngramsTable :: NgramsTable
| TagProps
)
-- | /!\ Multiple issues to deal in this specific component:
-- | - stack of patch surgery: monolitic use of the <doctable> +
-- | design choice of rendering ngrams children on the fly +
-- | setting up a facade for the `getNgramsChildren` thunk ALWAYS as an
-- | `Aff` even if not necessary
-- | - ReactJS re-rendering flaw causing flickering UI effect
-- | - PureScript pattern matching recursive limitation
-- |
-- | ↳ workaround: employ a delegation pattern with the an input bearing
-- | both the `Aff` thunk and a pure one. Note that we could create a
-- | Typing way, due to the PureScript limitation (see above)
tree :: Record TreeProps -> R.Element
tree p = R.createElement treeCpt p []
treeCpt :: R.Component TreeProps
treeCpt = here.component "tree" cpt where
cpt props@{ getNgramsChildren, ngramsDepth } _ = do
let loader p = do
res <- getNgramsChildren p
pure $ Right res
let render nc = treeLoaded (Record.merge props { ngramsChildren: L.fromFoldable nc })
useLoader { errorHandler
, loader
, path: ngramsDepth.ngrams
, render }
where
errorHandler = logRESTError here "[tree]"
cpt props@{ getNgramsChildrenAff
, getNgramsChildren
, ngramsDepth
} _ = do
-- | States
-- |
defaultNgramsChildren <- R.useMemo $ const $
maybe
(mempty :: List NgramsTerm)
(\thunk -> L.fromFoldable $ thunk ngramsDepth.ngrams)
getNgramsChildren
ngramsChildren /\ ngramsChildren' <-
R2.useBox' (defaultNgramsChildren :: List NgramsTerm)
-- | Hooks
-- |
useFirstEffect' $ maybe
(R.nothing)
(\aff -> launchAff_ do
res <- aff ngramsDepth.ngrams
liftEffect $
flip T.write_ ngramsChildren' $ L.fromFoldable res
)
(getNgramsChildrenAff)
-- | Render
-- |
pure $
treeLoaded (Record.merge props { ngramsChildren })
type TreeLoaded =
( ngramsChildren :: List NgramsTerm
...
...
@@ -183,8 +223,9 @@ treeLoadedCpt = here.component "treeLoaded" cpt where
H.ul {} <<< map (\ngrams -> tree ((Record.delete (Proxy :: Proxy "ngramsChildren") params) { ngramsDepth = {depth, ngrams} })) <<< L.toUnfoldable
type RenderNgramsItem =
( dispatch :: Action -> Effect Unit
, getNgramsChildren :: NgramsTerm -> Aff (Array NgramsTerm)
( dispatch :: Action -> Effect Unit
, getNgramsChildrenAff :: Maybe (NgramsTerm -> Aff (Array NgramsTerm))
, getNgramsChildren :: Maybe (NgramsTerm -> Array NgramsTerm)
, isEditing :: T.Box Boolean
, ngrams :: NgramsTerm
, ngramsElement :: NgramsElement
...
...
@@ -212,6 +253,10 @@ renderNgramsItemCpt = here.component "renderNgramsItem" cpt
pure $ Tbl.makeRow
[
selected
,
B.wad'
[ "pl-3" ] $
show $ A.length $ A.fromFoldable (ngramsElement ^. _NgramsElement <<< _occurrences)
,
H.div {}
( if isEditing'
...
...
@@ -231,7 +276,8 @@ renderNgramsItemCpt = here.component "renderNgramsItem" cpt
else
[
renderNgramsTree
{ getNgramsChildren: getNgramsChildren'
{ getNgramsChildrenAff: Nothing
, getNgramsChildren: Just $ getNgramsChildren'
, ngramsClick
, ngramsDepth
, ngramsEdit
...
...
@@ -240,10 +286,6 @@ renderNgramsItemCpt = here.component "renderNgramsItem" cpt
}
]
)
,
B.wad'
[ "pl-3" ] $
show $ A.length $ A.fromFoldable (ngramsElement ^. _NgramsElement <<< _occurrences)
]
where
ngramsDepth = { ngrams, depth: 0 }
...
...
@@ -261,8 +303,8 @@ renderNgramsItemCpt = here.component "renderNgramsItem" cpt
, ngramsStagePatch: mempty
, ngramsValidPatch: mempty
, ngramsVersion: 0 } ngramsTable
getNgramsChildren' :: NgramsTerm -> A
ff (Array NgramsTerm)
getNgramsChildren' n =
pure $
A.fromFoldable $ ngramsChildren n
getNgramsChildren' :: NgramsTerm -> A
rray NgramsTerm
getNgramsChildren' n = A.fromFoldable $ ngramsChildren n
ngramsChildren n = tbl ^.. ix n <<< _NgramsRepoElement <<< _children <<< folded
ngramsClick =
Just <<< dispatch <<< CoreAction <<< cycleTermListItem <<< view _ngrams
...
...
This diff is collapsed.
Click to expand it.
src/Gargantext/Components/Nodes/Annuaire/Tabs.purs
View file @
2f2b9b24
...
...
@@ -131,7 +131,8 @@ ngramsViewCpt = here.component "ngramsView" cpt where
, tabType: TabPairing (TabNgramType $ modeTabType mode)
, tabNgramType: modeTabType' mode
, treeEdit: { box: treeEditBox
, getNgramsChildren: \_ -> pure []
, getNgramsChildrenAff: Nothing
, getNgramsChildren: Nothing
, onCancelRef
, onNgramsClickRef
, onSaveRef }
...
...
This diff is collapsed.
Click to expand it.
src/Gargantext/Components/Nodes/Annuaire/User/Contacts/Tabs.purs
View file @
2f2b9b24
...
...
@@ -161,7 +161,8 @@ ngramsViewCpt = here.component "ngramsView" cpt
, tabNgramType
, tabType
, treeEdit: { box: treeEditBox
, getNgramsChildren: \_ -> pure []
, getNgramsChildrenAff: Nothing
, getNgramsChildren: Nothing
, onCancelRef
, onNgramsClickRef
, onSaveRef }
...
...
This diff is collapsed.
Click to expand it.
src/Gargantext/Components/Nodes/Lists/Tabs.purs
View file @
2f2b9b24
...
...
@@ -121,7 +121,8 @@ ngramsViewCpt = here.component "ngramsView" cpt where
, tabNgramType
, tabType
, treeEdit: { box: treeEditBox
, getNgramsChildren: NT.getNgramsChildrenAff session nodeId listIds tabType
, getNgramsChildrenAff: Just $ NT.getNgramsChildrenAffRequest session nodeId listIds tabType
, getNgramsChildren: Nothing
, onCancelRef
, onNgramsClickRef
, onSaveRef }
...
...
This diff is collapsed.
Click to expand it.
src/sass/_legacy/_list.sass
View file @
2f2b9b24
...
...
@@ -63,7 +63,6 @@
flex-grow
:
0
flex-shrink
:
1
///////////////////////////////////////////////////:
.ngrams-table-search-button
...
...
@@ -79,22 +78,12 @@
.ngrams-table-container
&
__header
display
:
flex
align-items
:
center
justify-content
:
space-between
background-color
:
$card-bg
position
:
sticky
top
:
$topbar-height
z-index
:
z-index
(
'main'
,
'topbar'
)
padding
:
$card-spacer-y
$card-spacer-x
border-bottom
:
1px
solid
$border-color
&
__navigation
display
:
flex
justify-content
:
space-between
align-items
:
center
margin-bottom
:
space-x
(
1
)
margin-top
:
space-x
(
2
)
margin-bottom
:
space-x
(
2
)
&
__add-term
margin-top
:
space-x
(
1
.5
)
...
...
@@ -115,22 +104,55 @@
top
:
$offset-y
padding-right
:
space-x
(
1
)
&
__
action-term
&
__
selection-cta
margin-left
:
space-x
(
1
.5
)
display
:
flex
align-items
:
center
gap
:
space-x
(
1
)
font-size
:
1
4
px
font-size
:
1
5
px
&
:
:
before
content
:
"┌"
color
:
$gray-400
font-size
:
18px
line-height
:
0
position
:
relative
padding-right
:
space-x
(
2
)
&
__table-wrapper
// @XXX: reset "main-page__main-route" wrapper margin
// see Gargantext.Components.Router)
margin-left
:
-
space-x
(
2
)
margin-right
:
-
space-x
(
2
)
margin-bottom
:
-
space-x
(
4
)
//
(
+
another
trimmed
gutter
)
&
__actions
display
:
flex
align-items
:
center
justify-content
:
space-between
background-color
:
$body-bg
position
:
sticky
top
:
$topbar-height
z-index
:
z-index
(
'main'
,
'topbar'
)
padding
:
$card-spacer-y
space-x
(
2
)
border-bottom
:
2px
solid
$border-color
&
__table
display
:
flex
gap
:
space-x
(
2
)
.ngrams-tree-edit-real
$width
:
416px
$min-width
:
264px
$empirical-action-row-height
:
64px
$offset-y
:
space-x
(
2
)
width
:
$width
min-width
:
$min-width
flex-grow
:
0
flex-shrink
:
1
align-self
:
flex-start
position
:
sticky
margin-top
:
$offset-y
margin-bottom
:
$offset-y
top
:
calc
(
#{
$topbar-height
}
+
#{
$empirical-action-row-height
}
+
#{
$offset-y
}
)
// reduce top border → due to the "__actions" bottom one
thead
th
border-top-width
:
0
tbody
padding-left
:
$card-spacer-x
...
...
@@ -140,11 +162,12 @@
&
__table
$select-column-width
:
100px
$score-column-width
:
25%
$score-column-min-width
:
280px
/// as of now (one-based index):
/// nth(1) → "Select"
/// nth(2) → "
Terms
"
/// nth(3) → "
Score
"
/// nth(2) → "
Score
"
/// nth(3) → "
Terms
"
// (header)
th
:nth-child
(
1
)
...
...
@@ -153,9 +176,8 @@
input
@include
clickable
th
:nth-child
(
2
)
padding-left
:
space-x
(
4
)
th
:nth-child
(
3
)
width
:
$score-column-width
min-width
:
$score-column-min-width
// (rows)
td
:nth-child
(
1
)
...
...
@@ -171,6 +193,8 @@
padding-top
:
$offset-y
td
:nth-child
(
2
)
padding-left
:
space-x
(
4
)
margin-left
:
space-x
(
1
.5
)
td
:nth-child
(
3
)
.tree-loaded-plus
$offset-y
:
1px
...
...
@@ -178,7 +202,7 @@
visibility
:
hidden
position
:
relative
top
:
$offset-y
margin-left
:
space-x
(
1
.5
)
margin-left
:
space-x
(
1
)
tr
:hover
...
...
@@ -189,14 +213,7 @@
///////////////////////////////////////////////////:
.ngrams-tree-edit-real
// empirical value fitting the best size of the render tree
$min-with
:
416px
min-width
:
$min-with
width
:
fit-content
//
growing
purpose
border-color
:
$primary
margin-top
:
space-x
(
2
)
margin-bottom
:
space-x
(
2
)
&
__actions
display
:
flex
...
...
This diff is collapsed.
Click to expand it.
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment