Developer forum

Hi Shiwanka

Good question - neither ribbonbard (which is DW9 UI) or System.Web is available anymore.

In Dynamicweb 10 you need to use screen injectors to add new features to action button and add fields, tabs and columns to edit and list screens.

There are some examples from Summit here: https://github.com/dynamicweb/Summit2022_ExtendingTheUI/tree/step4/src/ExpressDelivery

Here is an example of how we use this our selfes:

You can install Dynamicweb 10 without ecommerce - so if ecommerce is installed, the ecommerce UI has to add some additional fields for ecommerce settings for the website edit screen. That is done using a Screen injector - the code below is how we handle this - and this is a public extensibility pooint that you can also use.

using Dynamicweb.Content.UI.Models;
using Dynamicweb.Content.UI.Screens;
using Dynamicweb.CoreUI.Editors;
using Dynamicweb.CoreUI.Editors.Lists;
using Dynamicweb.CoreUI.Icons;
using Dynamicweb.CoreUI.Screens;
using Dynamicweb.Ecommerce;
using Dynamicweb.Ecommerce.International;
using Dynamicweb.Products.UI.Helpers;
using System;
using System.Collections.Generic;
using System.Linq;
using static Dynamicweb.CoreUI.Editors.Inputs.ListBase;

namespace Dynamicweb.Global.UI.Content
{
    public sealed class AreaEditScreenInjector : EditScreenInjector<AreaEditScreen, AreaDataModel>
    {
        private static string DefaultLanguageId => Ecommerce.Services.Languages.GetDefaultLanguageId();

        public override void OnBuildEditEditScreen(EditScreenBase<AreaDataModel>.EditScreenBuilder builder)
        {
            builder.AddComponents("Ecommerce", "Ecommerce settings", new[]
            {
                builder.EditorFor(m => m.EcomShopId),
                builder.EditorFor(m => m.EcomLanguageId),
                builder.EditorFor(m => m.EcomCurrencyId),
                builder.EditorFor(m => m.EcomCountryCode),
                builder.EditorFor(m => m.EcomPricesWithVat),
                builder.EditorFor(m => m.StockLocationID),
                builder.EditorFor(m => m.ReverseChargeForVat)
            });
        }

        public override EditorBase? GetEditor(string propertyName, AreaDataModel? model) => propertyName switch
        {
            nameof(model.EcomShopId) => CreateShopSelect(),
            nameof(model.EcomLanguageId) => CreateLanguageSelect(Screen?.Model),
            nameof(model.EcomCurrencyId) => EditorHelper.GetCurrencyEditor(),
            nameof(model.EcomCountryCode) => EditorHelper.GetCountryEditor(),
            nameof(model.EcomPricesWithVat) => CreatePricesWithVATSelect(),
            nameof(model.StockLocationID) => EditorHelper.GetStockLocationEditor(),
            _ => null
        };

        private Select CreateLanguageSelect(AreaDataModel? model)
        {
            var editor = new Select() { ShowNothingSelectedOption = true, ReloadOnChange = true };

            var allLanguages = Ecommerce.Services.Languages.GetLanguages().ToDictionary(l => l.LanguageId);
            var languages = string.IsNullOrEmpty(model?.EcomShopId)
                ? allLanguages.Values
                : Ecommerce.Services.Shops.GetShop(model.EcomShopId)?.RelatedLanguages ?? allLanguages.Values as IEnumerable<Language>;

            var isValueSelected = false;
            foreach (var language in languages)
            {
                editor.Options.Add(new ListOption { Value = language.LanguageId, Label = language.Name });
                if (!isValueSelected && language.LanguageId.Equals(model?.EcomLanguageId, StringComparison.OrdinalIgnoreCase))
                {
                    isValueSelected = true;
                }
            }

            if (!isValueSelected && !string.IsNullOrEmpty(model?.EcomLanguageId))
            {
                editor.Options.Add(new ListOption
                {
                    Value = model.EcomLanguageId,
                    Label = allLanguages.TryGetValue(model.EcomLanguageId, out var l) ? l.Name : model.EcomLanguageId,
                    Hint = allLanguages.ContainsKey(model.EcomLanguageId) ? "Language is not allowed by shop" : "Language does not exist",
                    Icon = Icon.ExclamationTriangle
                });
            }

            return editor;
        }

        private static Select CreateShopSelect()
        {
            var editor = EditorHelper.GetShopEditor(Enumerable.Empty<ShopType>());
            editor.ReloadOnChange = true;
            return editor;
        }

        private static Select CreatePricesWithVATSelect()
        {
            var editor = new Select { ShowNothingSelectedOption = true };
            editor.Options.Add(new() { Value = "False", Label = "No" });
            editor.Options.Add(new() { Value = "True", Label = "Yes" });

            return editor;
        }
    }
}