1// Copyright (C) 2023 The Android Open Source Project 2// 3// Licensed under the Apache License, Version 2.0 (the "License"); 4// you may not use this file except in compliance with the License. 5// You may obtain a copy of the License at 6// 7// http://www.apache.org/licenses/LICENSE-2.0 8// 9// Unless required by applicable law or agreed to in writing, software 10// distributed under the License is distributed on an "AS IS" BASIS, 11// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12// See the License for the specific language governing permissions and 13// limitations under the License. 14 15import m from 'mithril'; 16 17// Check if a mithril component vnode has children 18export function hasChildren<T>({children}: m.Vnode<T>): boolean { 19 return ( 20 Array.isArray(children) && 21 children.length > 0 && 22 children.some((value) => value) 23 ); 24} 25 26// A component which simply passes through it's children. 27// Can be used for having something to attach lifecycle hooks to without having 28// to add an extra HTML element to the DOM. 29export const Passthrough = { 30 view({children}: m.VnodeDOM) { 31 return children; 32 }, 33}; 34 35export interface GateAttrs { 36 open: boolean; 37} 38 39// The gate component is a wrapper which can either be open or closed. 40// - When open, children are rendered inside a div where display = contents. 41// - When closed, children are rendered inside a div where display = none 42// Use this component when we want to conditionally render certain children, 43// but we want to maintain their state. 44export const Gate = { 45 view({attrs, children}: m.VnodeDOM<GateAttrs>) { 46 return m( 47 '', 48 { 49 style: {display: attrs.open ? 'contents' : 'none'}, 50 }, 51 children, 52 ); 53 }, 54}; 55 56/** 57 * Utility function to pre-bind some mithril attrs of a component, and leave 58 * the others unbound and passed at run-time. 59 * Example use case: the Page API Passes to the registered page a PageAttrs, 60 * which is {subpage:string}. Imagine you write a MyPage component that takes 61 * some extra input attrs (e.g. the App object) and you want to bind them 62 * onActivate(). The results looks like this: 63 * 64 * interface MyPageAttrs extends PageAttrs { app: App; } 65 * 66 * class MyPage extends m.classComponent<MyPageAttrs> {... view() {...} } 67 * 68 * onActivate(app: App) { 69 * pages.register(... bindMithrilApps(MyPage, {app: app}); 70 * } 71 * 72 * The return value of bindMithrilApps is a mithril component that takes in 73 * input only a {subpage: string} and passes down to MyPage the combination 74 * of pre-bound and runtime attrs, that is {subpage, app}. 75 */ 76export function bindMithrilAttrs<BaseAttrs, Attrs>( 77 component: m.ComponentTypes<Attrs>, 78 boundArgs: Omit<Attrs, keyof BaseAttrs>, 79): m.Component<BaseAttrs> { 80 return { 81 view(vnode: m.Vnode<BaseAttrs>) { 82 const attrs = {...vnode.attrs, ...boundArgs} as Attrs; 83 const emptyAttrs: m.CommonAttributes<Attrs, {}> = {}; // Keep tsc happy. 84 return m<Attrs, {}>(component, {...attrs, ...emptyAttrs}); 85 }, 86 }; 87} 88 89export type MithrilEvent<T extends Event = Event> = T & {redraw: boolean}; 90 91/** 92 * Converts a string input in a <span>, extracts URLs and converts them into 93 * clickable links. 94 * @param text the input string, e.g., "See https://example.org for details". 95 * @returns a Mithril vnode, e.g. 96 * <span>See <a href="https://example.org">example.org<a> for more details. 97 */ 98export function linkify(text: string): m.Children { 99 const urlPattern = /(https?:\/\/[^\s]+)|(go\/[^\s]+)/g; 100 const parts = text.split(urlPattern); 101 return m( 102 'span', 103 parts.map((part) => { 104 if (/^(https?:\/\/[^\s]+)$/.test(part)) { 105 return m('a', {href: part, target: '_blank'}, part.split('://')[1]); 106 } else if (/^(go\/[^\s]+)$/.test(part)) { 107 return m( 108 'a', 109 { 110 href: `http://${part}`, 111 target: '_blank', 112 }, 113 part, 114 ); 115 } else { 116 return part; 117 } 118 }), 119 ); 120} 121