<!--
#
# Licensed to the Apache Software Foundation (ASF) under one or more
# contributor license agreements.  See the NOTICE file distributed with
# this work for additional information regarding copyright ownership.
# The ASF licenses this file to You under the Apache License, Version 2.0
# (the "License"); you may not use this file except in compliance with
# the License.  You may obtain a copy of the License at
#
#     http://www.apache.org/licenses/LICENSE-2.0
#
# Unless required by applicable law or agreed to in writing, software
# distributed under the License is distributed on an "AS IS" BASIS,
# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
# See the License for the specific language governing permissions and
# limitations under the License.
#
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sequence Action Information</title>
</head>
<body>
    <h1>Sequence Action Information</h1>
    <ol id="actions"></ol>
</body>
<script>
    const vscode = acquireVsCodeApi();
    const state = vscode.getState();
    if (state) {
        setActionList(state.actions);
    }

    window.addEventListener('message', event => {
        const message = event.data;
        const list = document.getElementById('actions');

        if (message.command === 'getData' && message.actions) {
            setActionList(message.actions);
            vscode.setState({ actions: message.actions });
        }
    });

    function setActionList(actions) {
        const list = document.getElementById('actions');
        actions.forEach(action => {
            let li = document.createElement('li');
            li.textContent = action;
            list.appendChild(li);
        });
    }
</script>
</html>