mirror of
				https://github.com/zulip/zulip-desktop.git
				synced 2025-11-04 05:53:21 +00:00 
			
		
		
		
	typescript: Migrate nav.js to typescript.
This commit is contained in:
		@@ -1,19 +1,20 @@
 | 
			
		||||
'use strict';
 | 
			
		||||
 | 
			
		||||
const BaseComponent = require(__dirname + '/../../components/base.js');
 | 
			
		||||
import BaseComponent = require('../../components/base');
 | 
			
		||||
 | 
			
		||||
class PreferenceNav extends BaseComponent {
 | 
			
		||||
	constructor(props) {
 | 
			
		||||
	// TODO: TypeScript - Here props should be object type
 | 
			
		||||
	props: any;
 | 
			
		||||
	navItems: string[];
 | 
			
		||||
	$el: Element;
 | 
			
		||||
	constructor(props: any) {
 | 
			
		||||
		super();
 | 
			
		||||
 | 
			
		||||
		this.props = props;
 | 
			
		||||
 | 
			
		||||
		this.navItems = ['General', 'Network', 'AddServer', 'Organizations', 'Shortcuts'];
 | 
			
		||||
 | 
			
		||||
		this.init();
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	template() {
 | 
			
		||||
	template(): string {
 | 
			
		||||
		let navItemsTemplate = '';
 | 
			
		||||
		for (const navItem of this.navItems) {
 | 
			
		||||
			navItemsTemplate += `<div class="nav" id="nav-${navItem}">${navItem}</div>`;
 | 
			
		||||
@@ -27,23 +28,22 @@ class PreferenceNav extends BaseComponent {
 | 
			
		||||
		`;
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	init() {
 | 
			
		||||
	init(): void {
 | 
			
		||||
		this.$el = this.generateNodeFromTemplate(this.template());
 | 
			
		||||
		this.props.$root.appendChild(this.$el);
 | 
			
		||||
 | 
			
		||||
		this.props.$root.append(this.$el);
 | 
			
		||||
		this.registerListeners();
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	registerListeners() {
 | 
			
		||||
	registerListeners(): void {
 | 
			
		||||
		for (const navItem of this.navItems) {
 | 
			
		||||
			const $item = document.getElementById(`nav-${navItem}`);
 | 
			
		||||
			const $item = document.querySelector(`#nav-${navItem}`);
 | 
			
		||||
			$item.addEventListener('click', () => {
 | 
			
		||||
				this.props.onItemSelected(navItem);
 | 
			
		||||
			});
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	select(navItemToSelect) {
 | 
			
		||||
	select(navItemToSelect: string): void {
 | 
			
		||||
		for (const navItem of this.navItems) {
 | 
			
		||||
			if (navItem === navItemToSelect) {
 | 
			
		||||
				this.activate(navItem);
 | 
			
		||||
@@ -53,15 +53,15 @@ class PreferenceNav extends BaseComponent {
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	activate(navItem) {
 | 
			
		||||
		const $item = document.getElementById(`nav-${navItem}`);
 | 
			
		||||
	activate(navItem: string): void {
 | 
			
		||||
		const $item = document.querySelector(`#nav-${navItem}`);
 | 
			
		||||
		$item.classList.add('active');
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	deactivate(navItem) {
 | 
			
		||||
		const $item = document.getElementById(`nav-${navItem}`);
 | 
			
		||||
	deactivate(navItem: string): void {
 | 
			
		||||
		const $item = document.querySelector(`#nav-${navItem}`);
 | 
			
		||||
		$item.classList.remove('active');
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
module.exports = PreferenceNav;
 | 
			
		||||
export = PreferenceNav;
 | 
			
		||||
		Reference in New Issue
	
	Block a user