diff --git a/js/src/common/helpers/avatar.js b/js/src/common/helpers/avatar.tsx similarity index 65% rename from js/src/common/helpers/avatar.js rename to js/src/common/helpers/avatar.tsx index f5c0245643..a60872b43c 100644 --- a/js/src/common/helpers/avatar.js +++ b/js/src/common/helpers/avatar.tsx @@ -1,26 +1,28 @@ +import * as Mithril from 'mithril'; +import User from '../models/User'; + /** * The `avatar` helper displays a user's avatar. * - * @param {User} user - * @param {Object} attrs Attributes to apply to the avatar element - * @return {Object} + * @param user + * @param attrs Attributes to apply to the avatar element */ -export default function avatar(user, attrs = {}) { +export default function avatar(user: User, attrs: Object = {}): Mithril.Vnode { attrs.className = 'Avatar ' + (attrs.className || ''); - let content = ''; + let content: string = ''; // If the `title` attribute is set to null or false, we don't want to give the // avatar a title. On the other hand, if it hasn't been given at all, we can // safely default it to the user's username. - const hasTitle = attrs.title === 'undefined' || attrs.title; + const hasTitle: boolean | string = attrs.title === 'undefined' || attrs.title; if (!hasTitle) delete attrs.title; // If a user has been passed, then we will set up an avatar using their // uploaded image, or the first letter of their username if they haven't // uploaded one. if (user) { - const username = user.displayName() || '?'; - const avatarUrl = user.avatarUrl(); + const username: string = user.displayName() || '?'; + const avatarUrl: string = user.avatarUrl(); if (hasTitle) attrs.title = attrs.title || username; diff --git a/js/src/common/helpers/listItems.js b/js/src/common/helpers/listItems.tsx similarity index 72% rename from js/src/common/helpers/listItems.js rename to js/src/common/helpers/listItems.tsx index da9232fde9..3232d236a1 100644 --- a/js/src/common/helpers/listItems.js +++ b/js/src/common/helpers/listItems.tsx @@ -1,15 +1,16 @@ +import * as Mithril from 'mithril'; import Separator from '../components/Separator'; import classList from '../utils/classList'; -function isSeparator(item) { +function isSeparator(item): boolean { return item.tag === Separator; } -function withoutUnnecessarySeparators(items) { +function withoutUnnecessarySeparators(items: Array): Array { const newItems = []; let prevItem; - items.filter(Boolean).forEach((item, i) => { + items.filter(Boolean).forEach((item: Mithril.Vnode, i: number) => { if (!isSeparator(item) || (prevItem && !isSeparator(prevItem) && i !== items.length - 1)) { prevItem = item; newItems.push(item); @@ -22,14 +23,11 @@ function withoutUnnecessarySeparators(items) { /** * The `listItems` helper wraps a collection of components in
  • tags, * stripping out any unnecessary `Separator` components. - * - * @param {*} items - * @return {Array} */ -export default function listItems(items) { +export default function listItems(items: Mithril.Vnode | Array): Array { if (!(items instanceof Array)) items = [items]; - return withoutUnnecessarySeparators(items).map((item) => { + return withoutUnnecessarySeparators(items).map((item: Mithril.Vnode) => { const isListItem = item.tag && item.tag.isListItem; const active = item.tag && item.tag.isActive && item.tag.isActive(item.attrs); const className = (item.attrs && item.attrs.itemClassName) || item.itemClassName; @@ -40,7 +38,7 @@ export default function listItems(items) { item.key = item.attrs.key; } - const node = isListItem ? ( + const node: Mithril.Vnode = isListItem ? ( item ) : (
  • {icon('fas fa-circle')}; } diff --git a/js/src/common/helpers/username.js b/js/src/common/helpers/username.tsx similarity index 70% rename from js/src/common/helpers/username.js rename to js/src/common/helpers/username.tsx index 7e05ca4d6d..249a2fdb31 100644 --- a/js/src/common/helpers/username.js +++ b/js/src/common/helpers/username.tsx @@ -1,11 +1,11 @@ +import * as Mithril from 'mithril'; +import User from '../models/User'; + /** * The `username` helper displays a user's username in a * tag. If the user doesn't exist, the username will be displayed as [deleted]. - * - * @param {User} user - * @return {Object} */ -export default function username(user) { +export default function username(user: User): Mithril.Vnode { const name = (user && user.displayName()) || app.translator.trans('core.lib.username.deleted_text'); return {name};