using System;
using System.Collections.Generic;
using System.Linq;
using Transpose.Core;
using Tesserae;
using static Transpose.Core.dom;
using static Tesserae.UI;

namespace Tesserae.Tests
{
    internal static class App
    {
        private static void Main()
        {
            var items = new ObservableList<IComponentWithID>();
            items.ReplaceAll(Enumerable.Range(1, 4).Select(i => new Row(i.ToString(), "Item " + i)).ToArray());

            var next  = 5;
            var stack = new KeyedObservableStack(items);

            var component = VStack().W(360.px()).Children(
                HStack().MB(16).Children(
                    Button("Reverse").OnClick(() => items.ReplaceAll(items.Value.Reverse().ToList())),
                    Button("Rename first").OnClick(() =>
                    {
                        var list  = items.Value.ToList();
                        var first = (Row)list[0];
                        list[0]   = new Row(first.Id, first.Name + " (renamed)");
                        items.ReplaceAll(list);
                    }),
                    Button("Add").Primary().OnClick(() =>
                    {
                        var list = items.Value.ToList();
                        list.Add(new Row(next.ToString(), "Item " + next));
                        next++;
                        items.ReplaceAll(list);
                    })),
                stack.WS());

            document.body.style.overflow = "hidden";
            MountCenteredToBody(component);
        }
    }

    public class Row : IComponentWithID
    {
        public Row(string id, string name) { Id = id; Name = name; }

        public string Id   { get; }
        public string Name { get; }

        public string Identifier  => Id;               // matched across reorders
        public string ContentHash => Id + "|" + Name;  // a change re-renders the row

        public HTMLElement Render() =>
            Card(HStack().WS().AlignItemsCenter().Children(
                TextBlock(Name).SemiBold().Grow(),
                TextBlock("#" + Id).Small())).MB(8).Render();
    }
}