Skip to content

Commit 057d782

Browse files
author
farfromrefug
committed
chore: tsc fix
1 parent 871a022 commit 057d782

File tree

1 file changed

+48
-68
lines changed

1 file changed

+48
-68
lines changed

‎src/ui-pager/react/index.tsx

Lines changed: 48 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,7 @@
1+
import { Color, CoreTypes, KeyedTemplate, Template, View } from '@nativescript/core';
12
import * as React from 'react';
2-
import { View as TNSView } from '@nativescript/core';
3-
import { ItemsSource, Pager as NativeScriptPager, PagerItem as NativeScriptPagerItem } from '..';
4-
import { registerElement } from 'react-nativescript';
5-
import { Template, Color, CoreTypes, View, KeyedTemplate} from '@nativescript/core';
6-
import { render as RNSRender, unmountComponentAtNode, NSVRoot, NSVElement, ViewAttributes, NativeScriptProps, GridLayoutAttributes } from "react-nativescript";
7-
import { Orientation } from '..';
3+
import { GridLayoutAttributes, NSVElement, NSVRoot, NativeScriptProps, render as RNSRender, ViewAttributes, registerElement, unmountComponentAtNode } from 'react-nativescript';
4+
import { ItemsSource, Pager as NativeScriptPager, PagerItem as NativeScriptPagerItem, Orientation } from '..';
85

96
registerElement('pager', () => require('../').Pager);
107
registerElement('pagerItem', () => require('../').PagerItem);
@@ -26,15 +23,14 @@ export declare type PagerAttributes = ViewAttributes & {
2623
transformers?: string;
2724
loadMoreCount?: number;
2825
disableSwipe?: boolean;
29-
indicator?: any
26+
indicator?: any;
3027
showIndicator?: boolean;
3128
indicatorColor?: Color | string;
3229
indicatorSelectedColor?: Color | string;
3330
ios?: any;
3431
android?: any;
3532
};
3633

37-
3834
export type CellViewContainer = View;
3935
type CellFactory = (item: any) => React.ReactElement;
4036

@@ -54,15 +50,18 @@ type OwnProps = {
5450

5551
onLoadMoreItems?: (args: any) => void;
5652
_debug?: {
57-
logLevel: "debug" | "info";
53+
logLevel: 'debug' | 'info';
5854
onCellFirstLoad?: (container: CellViewContainer) => void;
5955
onCellRecycle?: (container: CellViewContainer) => void;
6056
};
61-
} & Omit<PagerAttributes, "onItemLoading">;
57+
} & Omit<PagerAttributes, 'onItemLoading'>;
6258
type Props = OwnProps & { forwardedRef?: React.RefObject<NSVElement<NativeScriptPager>> };
6359

6460
type NumberKey = number | string;
65-
type RootKeyAndTNSView = { rootKey: string; nativeView: View };
61+
interface RootKeyAndTNSView {
62+
rootKey: string;
63+
nativeView: View;
64+
}
6665

6766
interface State {
6867
nativeCells: Record<NumberKey, CellViewContainer>;
@@ -74,10 +73,10 @@ interface State {
7473
export class _Pager extends React.Component<Props, State> {
7574
static readonly defaultProps = {
7675
_debug: {
77-
logLevel: "info" as "info",
76+
logLevel: 'info' as 'info',
7877
onCellFirstLoad: undefined,
79-
onCellRecycle: undefined,
80-
},
78+
onCellRecycle: undefined
79+
}
8180
};
8281

8382
constructor(props: Props) {
@@ -86,37 +85,32 @@ export class _Pager extends React.Component<Props, State> {
8685
this.state = {
8786
nativeCells: {},
8887
nativeCellToItemIndex: new Map(),
89-
itemIndexToNativeCell: props._debug.logLevel === "debug" ? new Map() : undefined,
88+
itemIndexToNativeCell: props._debug.logLevel === 'debug' ? new Map() : undefined
9089
};
9190
}
9291

9392
private readonly myRef = React.createRef<NSVElement<NativeScriptPager>>();
9493
private readonly argsViewToRootKeyAndRef: Map<View, RootKeyAndTNSView> = new Map();
9594
private roots: Set<string> = new Set();
9695

97-
9896
private readonly defaultOnItemLoading: (args: any) => void = (args: any) => {
9997
const { logLevel, onCellRecycle, onCellFirstLoad } = this.props._debug;
10098
const { items, itemTemplateSelector } = this.props;
10199
const item: any = _Pager.isItemsSource(items) ? items.getItem(args.index) : items[args.index];
102100
const template: string | null = itemTemplateSelector
103-
? typeof itemTemplateSelector === "string"
101+
? typeof itemTemplateSelector === 'string'
104102
? itemTemplateSelector
105-
: (itemTemplateSelector as ((item: any, index: number, items: any) => string))(item, args.index, items)
103+
: (itemTemplateSelector as (item: any, index: number, items: any) => string)(item, args.index, items)
106104
: null;
107105
const cellFactory: CellFactory | undefined =
108-
template === null
109-
? this.props.cellFactory
110-
: this.props.cellFactories
111-
? this.props.cellFactories.get(template).cellFactory
112-
: this.props.cellFactory;
106+
template === null ? this.props.cellFactory : this.props.cellFactories ? this.props.cellFactories.get(template).cellFactory : this.props.cellFactory;
113107

114-
if (typeof cellFactory === "undefined") {
108+
if (typeof cellFactory === 'undefined') {
115109
console.warn(`Pager: No cell factory found, given template ${template}!`);
116110
return;
117111
}
118112

119-
let view: View | undefined = args.view;
113+
const view: View | undefined = args.view;
120114
if (!view) {
121115
const rootKeyAndRef: RootKeyAndTNSView = this.renderNewRoot(item, cellFactory);
122116

@@ -127,16 +121,16 @@ export class _Pager extends React.Component<Props, State> {
127121

128122
if (onCellFirstLoad) onCellFirstLoad(rootKeyAndRef.nativeView);
129123
} else {
130-
console.log(`[Pager] existing view: `, view);
131-
if (onCellRecycle) onCellRecycle(view as CellViewContainer);
124+
console.log('[Pager] existing view: ', view);
125+
if (onCellRecycle) onCellRecycle(view);
132126

133127
const { rootKey, nativeView } = this.argsViewToRootKeyAndRef.get(view);
134-
if (typeof rootKey === "undefined") {
135-
console.error(`Unable to find root key that args.view corresponds to!`, view);
128+
if (typeof rootKey === 'undefined') {
129+
console.error('Unable to find root key that args.view corresponds to!', view);
136130
return;
137131
}
138132
if (!nativeView) {
139-
console.error(`Unable to find ref that args.view corresponds to!`, view);
133+
console.error('Unable to find ref that args.view corresponds to!', view);
140134
return;
141135
}
142136

@@ -153,23 +147,24 @@ export class _Pager extends React.Component<Props, State> {
153147
};
154148

155149
protected getNativeView(): NativeScriptPager | null {
156-
const ref = (this.props.forwardedRef || this.myRef);
150+
const ref = this.props.forwardedRef || this.myRef;
157151
return ref.current ? ref.current.nativeView : null;
158152
}
159153

160154
private readonly renderNewRoot = (item: any, cellFactory: CellFactory): RootKeyAndTNSView => {
161155
const node: NativeScriptPager | null = this.getNativeView();
162156
if (!node) {
163-
throw new Error("Unable to get ref to Pager");
157+
throw new Error('Unable to get ref to Pager');
164158
}
165159

166-
console.log(`[Pager] no existing view.`);
160+
console.log('[Pager] no existing view.');
167161
const rootKey: string = `Pager-${node._domId}-${this.roots.size.toString()}`;
168162

169163
const root = new NSVRoot<View>();
170164
RNSRender(
171165
cellFactory(item),
172-
root, () => {
166+
root,
167+
() => {
173168
// console.log(`Rendered into cell! ref:`);
174169
},
175170
rootKey
@@ -186,7 +181,7 @@ export class _Pager extends React.Component<Props, State> {
186181
componentDidMount() {
187182
const node: NativeScriptPager | null = this.getNativeView();
188183
if (!node) {
189-
console.warn(`React ref to NativeScript View lost, so unable to set item templates.`);
184+
console.warn('React ref to NativeScript View lost, so unable to set item templates.');
190185
return;
191186
}
192187

@@ -203,26 +198,24 @@ export class _Pager extends React.Component<Props, State> {
203198
this.argsViewToRootKeyAndRef.set(rootKeyAndRef.nativeView, rootKeyAndRef);
204199

205200
return rootKeyAndRef.nativeView;
206-
},
201+
}
207202
});
208203
});
209204
node.itemTemplates = itemTemplates;
210205
}
211206
}
212207

213208
componentWillUnmount() {
214-
this.roots.forEach(root => unmountComponentAtNode(root));
209+
this.roots.forEach((root) => unmountComponentAtNode(root));
215210
}
216211

217212
public static isItemsSource(arr: any[] | ItemsSource): arr is ItemsSource {
218213
// Same implementation as: https://github.com/NativeScript/NativeScript/blob/b436ecde3605b695a0ffa1757e38cc094e2fe311/tns-core-modules/ui/list-picker/list-picker-common.ts#L74
219-
return typeof (arr as ItemsSource).getItem === "function";
214+
return typeof (arr as ItemsSource).getItem === 'function';
220215
}
221216

222-
223-
224217
render() {
225-
console.log(`Pager's render()`);
218+
console.log("Pager's render()");
226219
const {
227220
// Only used by the class component; not the JSX element.
228221
forwardedRef,
@@ -242,25 +235,20 @@ export class _Pager extends React.Component<Props, State> {
242235
// ref: forwardedRef || this.myRef,
243236
// onItemLoading: this.defaultOnItemLoading
244237
// }, children)
245-
<pager
246-
{...rest}
247-
onItemLoading={this.defaultOnItemLoading}
248-
ref={forwardedRef || this.myRef}
249-
children={children}
250-
/>
238+
<pager {...rest} onItemLoading={this.defaultOnItemLoading} ref={forwardedRef || this.myRef} children={children} />
251239
);
252240
}
253241
}
254242

255-
export type PagerItemAttributes = GridLayoutAttributes & {forwardedRef?: React.RefObject<NSVElement<NativeScriptPagerItem>> };
243+
export type PagerItemAttributes = GridLayoutAttributes & { forwardedRef?: React.RefObject<NSVElement<NativeScriptPagerItem>> };
256244

257245
export class _PagerItem extends React.Component<PagerItemAttributes, {}> {
258246
private readonly myRef = React.createRef<NSVElement<NativeScriptPagerItem>>();
259247
private readonly item = new NativeScriptPagerItem();
260248

261249
componentDidMount(): void {
262-
const {forwardedRef} = this.props;
263-
const view = (forwardedRef || this.myRef).current!.nativeView;
250+
const { forwardedRef } = this.props;
251+
const view = (forwardedRef || this.myRef).current.nativeView;
264252
const parent: any = view && view.parent ? view.parent : null;
265253
if (parent) {
266254
// remove parent
@@ -281,38 +269,30 @@ export class _PagerItem extends React.Component<PagerItemAttributes, {}> {
281269
...rest
282270
} = this.props;
283271

284-
285272
return React.createElement(
286273
'pagerItem',
287274
{
288275
...rest,
289-
ref: forwardedRef || this.myRef,
276+
ref: forwardedRef || this.myRef
290277
},
291278
children
292279
);
293280
}
294281
}
295282

296-
export const Pager = React.forwardRef<NSVElement<NativeScriptPager>, OwnProps>(
297-
(props: OwnProps, ref: React.RefObject<NSVElement<NativeScriptPager>>) => {
298-
return <_Pager {...props} forwardedRef={ref} />;
299-
}
300-
);
301-
302-
303-
export const PagerItem = React.forwardRef<NSVElement<NativeScriptPagerItem>, PagerItemAttributes>(
304-
(props: PagerItemAttributes, ref: React.RefObject<NSVElement<NativeScriptPagerItem>>) => {
305-
return <_PagerItem {...props} forwardedRef={ref} />;
306-
}
307-
);
308-
283+
//@ts-ignore
284+
export const Pager = React.forwardRef<NSVElement<NativeScriptPager>, OwnProps>((props: OwnProps, ref: React.RefObject<NSVElement<NativeScriptPager>>) => <_Pager {...props} forwardedRef={ref} />);
309285

286+
export const PagerItem = React.forwardRef<NSVElement<NativeScriptPagerItem>, PagerItemAttributes>((props: PagerItemAttributes, ref: React.RefObject<NSVElement<NativeScriptPagerItem>>) => (
287+
//@ts-ignore
288+
<_PagerItem {...props} forwardedRef={ref} />
289+
));
310290

311291
declare global {
312-
module JSX {
292+
namespace JSX {
313293
interface IntrinsicElements {
314294
pager: NativeScriptProps<PagerAttributes, NativeScriptPager>;
315-
pagerItem: NativeScriptProps<PagerItemAttributes, NativeScriptPagerItem>
295+
pagerItem: NativeScriptProps<PagerItemAttributes, NativeScriptPagerItem>;
316296
}
317297
}
318-
}
298+
}

0 commit comments

Comments
 (0)