Skip to content

Commit

Permalink
refactor: fix line focus dom functionality
Browse files Browse the repository at this point in the history
  • Loading branch information
@plyr4
plyr4 committed Jan 25, 2024
1 parent 02686f0 commit 1da9ac1
Show file tree
Hide file tree
Showing 6 changed files with 208 additions and 78 deletions.
2 changes: 1 addition & 1 deletion src/elm/Components/Logs.elm
View file
Original file line number Diff line number Diff line change
Expand Up @@ -152,7 +152,7 @@ viewLine shared props logLine lineNumber =
[ button
[ Util.onClickPreventDefault <|
props.msgs.pushUrlHash
{ hash = Focus.lineRangeId props.resourceType props.resourceNumber lineNumber props.lineFocus shared.shift
{ hash = Focus.resourceLineRangeId props.resourceType props.resourceNumber lineNumber props.lineFocus shared.shift
}
, Util.testAttribute <| String.join "-" [ "log", "line", "num", props.resourceType, props.resourceNumber, String.fromInt lineNumber ]
, id <| Focus.resourceAndLineToFocusId props.resourceType props.resourceNumber lineNumber
Expand Down
48 changes: 37 additions & 11 deletions src/elm/Pages/Org_/Repo_/Build_.elm
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,8 @@ import Debug exposing (log)
import Dict exposing (Dict)
import Effect exposing (Effect)
import FeatherIcons
import Html exposing (Html, code, details, div, small, summary, text)
import Html.Attributes exposing (attribute, class, id)
import Html exposing (Html, button, code, details, div, small, summary, text)
import Html.Attributes exposing (attribute, class, classList, id)
import Html.Events exposing (onClick)
import Http
import Http.Detailed
Expand Down Expand Up @@ -83,7 +83,7 @@ init shared route () =
, logs = Dict.empty
, logLineFocus =
route.hash
|> Focus.parseFocusFragment
|> Focus.parseResourceFocusTargetFromFragment
|> (\ft -> ( ft.resourceNumber, ( ft.lineA, ft.lineB ) ))
, logFollow = 0
}
Expand Down Expand Up @@ -129,10 +129,27 @@ update shared route msg model =
( { model
| logLineFocus =
route.hash
|> Focus.parseFocusFragment
|> Focus.parseResourceFocusTargetFromFragment
|> (\ft -> ( ft.resourceNumber, ( ft.lineA, ft.lineB ) ))
}
, Effect.none
, case model.steps of
RemoteData.Success steps ->
let
resourceNumber =
route.hash
|> Focus.parseResourceFocusTargetFromFragment
|> (\ft -> ( ft.resourceNumber, ( ft.lineA, ft.lineB ) ))
|> Tuple.first
|> Maybe.withDefault -1
in
steps
|> List.filter (\s -> resourceNumber == s.number)
|> List.map (\s -> ExpandStep { step = s, updateUrlHash = False })
|> List.map Effect.sendMsg
|> Effect.batch

_ ->
Effect.none
)

PushUrlHash options ->
Expand Down Expand Up @@ -201,7 +218,10 @@ update shared route msg model =
model.logs
in
( { model | logs = logs }
, Effect.none
, model.logLineFocus
|> Focus.resourceLineFocusToFocusId "step"
|> (\t -> FocusOn { target = t })
|> Effect.sendMsg
)

Err error ->
Expand Down Expand Up @@ -242,7 +262,7 @@ update shared route msg model =
, buildNumber = route.params.buildNumber
}
, query = route.query
, hash = Just <| "step:" ++ String.fromInt options.step.number
, hash = Just <| Focus.resourceFocusId "step" (String.fromInt options.step.number)
}

else
Expand Down Expand Up @@ -324,14 +344,14 @@ view shared route model =
, class "flowline-left"
, Util.testAttribute "log-actions"
]
[ Html.button
[ button
[ class "button"
, class "-link"
, onClick CollapseAll
, Util.testAttribute "collapse-all"
]
[ small [] [ text "collapse all" ] ]
, Html.button
, button
[ class "button"
, class "-link"
, onClick ExpandAll
Expand Down Expand Up @@ -374,11 +394,17 @@ viewStep shared model route step =
else
ExpandStep
in
div [ Html.Attributes.classList [ ( "step", True ), ( "flowline-left", True ) ], Util.testAttribute "step" ]
div
[ classList
[ ( "step", True )
, ( "flowline-left", True )
]
, Util.testAttribute "step"
]
[ div [ class "-status" ]
[ div [ class "-icon-container" ] [ Components.Svgs.statusToIcon step.status ] ]
, details
(Html.Attributes.classList
(classList
[ ( "details", True )
, ( "-with-border", True )
, ( "-running", step.status == Vela.Running )
Expand Down
4 changes: 2 additions & 2 deletions src/elm/Pages/Org_/Repo_/Build_/Graph.elm
View file
Original file line number Diff line number Diff line change
Expand Up @@ -95,7 +95,7 @@ init shared route () =
, logs = Dict.empty
, lineFocus =
route.hash
|> Focus.parseFocusFragment
|> Focus.parseResourceFocusTargetFromFragment
|> (\ft -> ( ft.resourceNumber, ( ft.lineA, ft.lineB ) ))
, logFollow = 0
}
Expand Down Expand Up @@ -141,7 +141,7 @@ update shared route msg model =
( { model
| lineFocus =
route.hash
|> Focus.parseFocusFragment
|> Focus.parseResourceFocusTargetFromFragment
|> (\ft -> ( ft.resourceNumber, ( ft.lineA, ft.lineB ) ))
}
, Effect.none
Expand Down
58 changes: 28 additions & 30 deletions src/elm/Pages/Org_/Repo_/Build_/Pipeline.elm
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,8 @@ import Auth
import Dict exposing (Dict)
import Effect exposing (Effect)
import FeatherIcons
import Html exposing (Html, a, button, code, div, small, span, strong, td, text, tr)
import Html.Attributes exposing (attribute, class, id)
import Html exposing (Html, a, button, code, details, div, small, span, strong, summary, table, td, text, tr)
import Html.Attributes exposing (attribute, class, href, id, target)
import Html.Events exposing (onClick)
import Http
import Http.Detailed
Expand Down Expand Up @@ -74,7 +74,7 @@ type alias Model =
{ build : WebData Vela.Build
, pipeline : WebData Vela.PipelineConfig
, templates : WebData (Dict String Vela.Template)
, lineFocus : ( Maybe Int, ( Maybe Int, Maybe Int ) )
, lineFocus : ( Maybe Int, Maybe Int )
, showTemplates : Bool
, expand : Bool
, expanding : Bool
Expand All @@ -88,8 +88,8 @@ init shared route () =
, templates = RemoteData.Loading
, lineFocus =
route.hash
|> Focus.parseFocusFragment
|> (\ft -> ( ft.resourceNumber, ( ft.lineA, ft.lineB ) ))
|> Focus.parseFocusTargetFromFragment
|> (\ft -> ( ft.lineA, ft.lineB ))
, showTemplates = True
, expand =
route.query
Expand Down Expand Up @@ -201,8 +201,8 @@ update shared route msg model =
( { model
| lineFocus =
route.hash
|> Focus.parseFocusFragment
|> (\ft -> ( ft.resourceNumber, ( ft.lineA, ft.lineB ) ))
|> Focus.parseFocusTargetFromFragment
|> (\ft -> ( ft.lineA, ft.lineB ))
}
, Effect.none
)
Expand Down Expand Up @@ -281,7 +281,10 @@ update shared route msg model =
}
, expanding = False
}
, Effect.none
, model.lineFocus
|> Focus.lineFocusToFocusId
|> (\t -> FocusOn { target = t })
|> Effect.sendMsg
)

Err error ->
Expand Down Expand Up @@ -383,7 +386,7 @@ view shared route model =
RemoteData.Success pipeline ->
if String.length pipeline.decodedData > 0 then
div [ class "logs-container", class "-pipeline" ]
[ Html.table
[ table
[ class "logs-table"
]
[ div [ class "header" ]
Expand Down Expand Up @@ -436,7 +439,7 @@ view shared route model =
]
]
, div [ class "logs", Util.testAttribute "pipeline-configuration-data" ] <|
viewLines shared pipeline (Just <| Tuple.second model.lineFocus)
viewLines shared pipeline model.lineFocus
]
]

Expand Down Expand Up @@ -474,8 +477,8 @@ viewTemplate ( _, t ) =
[ span [] [ text t.name ]
, span [] [ text t.source ]
, a
[ Html.Attributes.target "_blank"
, Html.Attributes.href t.link
[ target "_blank"
, href t.link
]
[ text t.link ]
]
Expand All @@ -484,21 +487,21 @@ viewTemplate ( _, t ) =

viewTemplatesDetails : Html.Attribute msg -> Bool -> msg -> List (Html msg) -> Html msg
viewTemplatesDetails cls open showHide content =
Html.details
details
(class "details"
:: class "templates"
:: Util.testAttribute "pipeline-templates"
:: Util.open open
)
[ Html.summary [ class "summary", Util.onClickPreventDefault showHide ]
[ summary [ class "summary", Util.onClickPreventDefault showHide ]
[ div [] [ text "Templates" ]
, FeatherIcons.chevronDown |> FeatherIcons.withSize 20 |> FeatherIcons.withClass "details-icon-expand" |> FeatherIcons.toHtml []
]
, div [ class "content", cls ] content
]


viewLines : Shared.Model -> Vela.PipelineConfig -> Maybe Focus.LineFocus -> List (Html Msg)
viewLines : Shared.Model -> Vela.PipelineConfig -> Focus.LineFocus -> List (Html Msg)
viewLines shared config lineFocus =
config.decodedData
|> Utils.Ansi.decodeAnsi
Expand All @@ -507,49 +510,44 @@ viewLines shared config lineFocus =
Just <|
viewLine
shared
"0"
(idx + 1)
(Just line)
"0"
lineFocus
)
|> Array.toList
|> List.filterMap identity


viewLine : Shared.Model -> String -> Int -> Maybe Ansi.Log.Line -> String -> Maybe Focus.LineFocus -> Html Msg
viewLine shared id lineNumber line resource lineFocus =
viewLine : Shared.Model -> Int -> Maybe Ansi.Log.Line -> Focus.LineFocus -> Html Msg
viewLine shared lineNumber line lineFocus =
tr
[ Html.Attributes.id <|
id
++ ":"
++ String.fromInt lineNumber
[ id <| String.fromInt lineNumber
, class "line"
]
[ case line of
Just l ->
div
[ class "wrapper"
, Util.testAttribute <| String.join "-" [ "config", "line", resource, String.fromInt lineNumber ]
, class <| Focus.lineFocusStyles lineFocus lineNumber
, Util.testAttribute <| String.join "-" [ "config", "line", String.fromInt lineNumber ]
, class <| Focus.lineFocusStyles (Just lineFocus) lineNumber
]
[ td []
[ button
[ Util.onClickPreventDefault <|
PushUrlHash
{ hash = Focus.lineRangeId "pipeline" "0" lineNumber lineFocus shared.shift
{ hash = Focus.lineRangeId lineNumber (Just lineFocus) shared.shift
}
, Util.testAttribute <| String.join "-" [ "config", "line", "num", resource, String.fromInt lineNumber ]
, Html.Attributes.id <| Focus.resourceAndLineToFocusId "config" resource lineNumber
, Util.testAttribute <| String.join "-" [ "config", "line", "num", String.fromInt lineNumber ]
, id <| Focus.lineNumberToFocusId lineNumber
, class "line-number"
, class "button"
, class "-link"
, attribute "aria-label" <| "focus resource " ++ resource
, attribute "aria-label" "focus this line"
]
[ span [] [ text <| String.fromInt lineNumber ] ]
]
, td [ class "break-text", class "overflow-auto" ]
[ code [ Util.testAttribute <| String.join "-" [ "config", "data", resource, String.fromInt lineNumber ] ]
[ code [ Util.testAttribute <| String.join "-" [ "config", "data", String.fromInt lineNumber ] ]
[ Ansi.Log.viewLine l
]
]
Expand Down
Loading

0 comments on commit 1da9ac1

Please sign in to comment.