1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
|
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at <http://mozilla.org/MPL/2.0/>. */
// @flow
import React, { Component } from "react";
import PropTypes from "prop-types";
import { times, zip, flatten } from "lodash";
import { formatDisplayName } from "../../utils/pause/frames";
import type { URL } from "../../types";
import "./PreviewFunction.css";
type FunctionType = {
name?: string,
displayName?: string,
userDisplayName?: string,
parameterNames?: string[],
location?: {
url: URL,
line: number,
column: number,
},
};
type Props = { func: FunctionType };
const IGNORED_SOURCE_URLS = ["debugger eval code"];
export default class PreviewFunction extends Component<Props> {
renderFunctionName(func: FunctionType) {
const { l10n } = this.context;
const name = formatDisplayName((func: any), undefined, l10n);
return <span className="function-name">{name}</span>;
}
renderParams(func: FunctionType) {
const { parameterNames = [] } = func;
const params = parameterNames.filter(Boolean).map(param => (
<span className="param" key={param}>
{param}
</span>
));
const commas = times(params.length - 1).map((_, i) => (
<span className="delimiter" key={i}>
{", "}
</span>
));
// $FlowIgnore
return flatten(zip(params, commas));
}
jumpToDefinitionButton(func: FunctionType) {
const { location } = func;
if (
location &&
location.url &&
!IGNORED_SOURCE_URLS.includes(location.url)
) {
const lastIndex = location.url.lastIndexOf("/");
return (
<button
className="jump-definition"
draggable="false"
title={`${location.url.slice(lastIndex + 1)}:${location.line}`}
/>
);
}
}
render() {
const { func } = this.props;
return (
<span className="function-signature">
{this.renderFunctionName(func)}
<span className="paren">(</span>
{this.renderParams(func)}
<span className="paren">)</span>
{this.jumpToDefinitionButton(func)}
</span>
);
}
}
PreviewFunction.contextTypes = { l10n: PropTypes.object };
|
