Bdtjtk

I want to create a tree in VS code, but my problem is how to manually add a node to my tree. I am not sure from where to start. I tried to review all the projects that created a tree for VScode as an extension.

My problem is that I am not an expert in Typescript and the examples are not so clear or I am not sure how it is working.

Would you mind helping me to understand how to create the tree in VS code? My problem is with creating a node and then adding the node to tree.

I reviewed these projects:

vscode-code-outline

vscode-extension-samples

vscode-git-tree-compare

vscode-html-languageserver-bin

vscode-mock-debug

vscode-tree-view

Update1:
I managed to use "vscode-extension-samples" and generate the below code examples; now I don't know what I should do, or in other words, how to fill the tree. I tried to use mytree class to fill the data but it didn't work. Would you mind advising me what is next?

extension.ts

    'use strict';



    import * as vscode from 'vscode';



    import { DepNodeProvider } from './nodeDependencies'

    import { JsonOutlineProvider } from './jsonOutline'

    import { FtpExplorer } from './ftpExplorer.textDocumentContentProvider'

    import { FileExplorer } from './fileExplorer';

    //mycode

    import { SCCExplorer } from './sccExplorer';



    export function activate(context: vscode.ExtensionContext) {

        // Complete Tree View Sample

        new FtpExplorer(context);

        new FileExplorer(context);

        //mycode

        new SCCExplorer(context);



        // Following are just data provider samples

        const rootPath = vscode.workspace.rootPath;

        const nodeDependenciesProvider = new DepNodeProvider(rootPath);

        const jsonOutlineProvider = new JsonOutlineProvider(context);



        vscode.window.registerTreeDataProvider('nodeDependencies', nodeDependenciesProvider);

        vscode.commands.registerCommand('nodeDependencies.refreshEntry', () => nodeDependenciesProvider.refresh());

        vscode.commands.registerCommand('nodeDependencies.addEntry', node => vscode.window.showInformationMessage('Successfully called add entry'));

        vscode.commands.registerCommand('nodeDependencies.deleteEntry', node => vscode.window.showInformationMessage('Successfully called delete entry'));

        vscode.commands.registerCommand('extension.openPackageOnNpm', moduleName => vscode.commands.executeCommand('vscode.open', vscode.Uri.parse(`https://www.npmjs.com/package/${moduleName}`)));



        vscode.window.registerTreeDataProvider('jsonOutline', jsonOutlineProvider);

        vscode.commands.registerCommand('jsonOutline.refresh', () => jsonOutlineProvider.refresh());

        vscode.commands.registerCommand('jsonOutline.refreshNode', offset => jsonOutlineProvider.refresh(offset));

        vscode.commands.registerCommand('jsonOutline.renameNode', offset => jsonOutlineProvider.rename(offset));

        vscode.commands.registerCommand('extension.openJsonSelection', range => jsonOutlineProvider.select(range));



    }

sccExplorer.ts

import * as vscode from 'vscode';

import * as path from 'path';

import * as fs from 'fs';

import * as mkdirp from 'mkdirp';

import * as rimraf from 'rimraf';



//#region Utilities





interface Entry {

    uri: vscode.Uri,

    type: vscode.FileType

}



//#endregion



export class FileSystemProvider implements vscode.TreeDataProvider<Entry> {

    getTreeItem(element: Entry): vscode.TreeItem | Thenable<vscode.TreeItem> {

        throw new Error("Method not implemented.");

    }

    onDidChangeTreeData?: vscode.Event<Entry>;



    getChildren(element?: Entry): vscode.ProviderResult<Entry> {

        throw new Error("Method not implemented.");

    }

    getParent?(element: Entry): vscode.ProviderResult<Entry> {

        throw new Error("Method not implemented.");

    }



    private _onDidChangeFile: vscode.EventEmitter<vscode.FileChangeEvent>;



    constructor() {

        this._onDidChangeFile = new vscode.EventEmitter<vscode.FileChangeEvent>();

    }





}



export class SCCExplorer {



    private fileExplorer: vscode.TreeView<any>;



    constructor(context: vscode.ExtensionContext) {

        const treeDataProvider = new myTree().directories;

        this.fileExplorer = vscode.window.createTreeView('scc_Explorer', { treeDataProvider });

        vscode.commands.registerCommand('scc_Explorer.openFile', (resource) => this.openResource(resource));

    }



    private openResource(resource: vscode.Uri): void {

        vscode.window.showTextDocument(resource);

    }

}



export class myTree{

    directories: any;

    constructor()

    {

        this.directories = [

        {

            name: 'parent1',

            child: [{

                name: 'child1',

                child: 

            },

            {

                name: 'child2',

                child: 

            }]

        },

        {

            name: 'parent2',

            child: {

                name: 'child1',

                child: 

            }

        },

        {

            name: 'parent2',

            child: [{

                name: 'child1',

                child: 

            },

            {

                name: 'child2',

                child: 

            }]

        }];

    }

}