fix lints

Author: blainekasten

packages/gatsby-react-router-scroll/src/scroll-container.tsx

@@ -12,44 +12,45 @@ const propTypes = {
   children: PropTypes.element.isRequired,
 }
 
-type Props = {
+interface IProps {
   scrollKey: string
   shouldUpdateScroll?: Function
   children: React.ReactNode
 }
 
-type PropsWithContextAndLocation = Props & {
+interface IPropsWithContextAndLocation extends IProps {
   context: SessionStorage
   location: HLocation
 }
 
 class ScrollContainerImplementation extends React.Component<
-  PropsWithContextAndLocation
+  IPropsWithContextAndLocation
 > {
-  componentDidMount() {
+  componentDidMount(): void {
+    // eslint-disable-next-line react/no-find-dom-node
     const node = ReactDOM.findDOMNode(this) as Element
     const { location, scrollKey } = this.props
 
     if (!node) return
 
-    node.addEventListener("scroll", () => {
+    node.addEventListener(`scroll`, () => {
       this.props.context.save(location, scrollKey, node.scrollTop)
     })
 
     const position = this.props.context.read(location, scrollKey)
     node.scrollTo(0, position)
   }
 
-  render() {
+  render(): React.ReactNode {
     return this.props.children
   }
 }
 
-export const ScrollContainer = (props: Props) => (
+export const ScrollContainer = (props: IProps): React.ReactNode => (
   <Location>
-    {({ location }) => (
+    {({ location }): React.ReactNode => (
       <ScrollContext.Consumer>
-        {context => (
+        {(context): React.ReactNode => (
           <ScrollContainerImplementation
             {...props}
             context={context}

packages/gatsby-react-router-scroll/src/scroll-handler.tsx

@@ -25,37 +25,42 @@ export class ScrollHandler extends React.Component<
 
   _stateStorage: SessionStorage = new SessionStorage()
 
-  scrollListener = () => {
+  scrollListener = (): void => {
     const { key } = this.props.location
 
-    this._stateStorage.save(this.props.location, key, window.scrollY)
+    if (key) {
+      this._stateStorage.save(this.props.location, key, window.scrollY)
+    }
   }
 
-  componentDidMount() {
+  componentDidMount(): void {
     window.addEventListener(`scroll`, this.scrollListener)
+    let scrollPosition
+    const { key, hash } = this.props.location
+
+    if (key) {
+      scrollPosition = this._stateStorage.read(this.props.location, key)
+    }
 
-    const scrollPosition = this._stateStorage.read(
-      this.props.location,
-      this.props.location.key
-    )
     if (scrollPosition) {
       this.windowScroll(scrollPosition, undefined)
-    } else if (this.props.location.hash) {
-      this.scrollToHash(decodeURI(this.props.location.hash), undefined)
+    } else if (hash) {
+      this.scrollToHash(decodeURI(hash), undefined)
     }
   }
 
-  componentWillUnmount() {
+  componentWillUnmount(): void {
     window.removeEventListener(`scroll`, this.scrollListener)
   }
 
   componentDidUpdate(prevProps: LocationContext): void {
-    const { hash } = this.props.location
+    const { hash, key } = this.props.location
+    let scrollPosition
+
+    if (key) {
+      scrollPosition = this._stateStorage.read(this.props.location, key)
+    }
 
-    const scrollPosition = this._stateStorage.read(
-      this.props.location,
-      this.props.location.key
-    )
     if (scrollPosition) {
       this.windowScroll(scrollPosition, prevProps)
     } else if (hash) {
@@ -96,7 +101,7 @@ export class ScrollHandler extends React.Component<
     return shouldUpdateScroll.call(this, prevRouterProps, routerProps)
   }
 
-  render() {
+  render(): React.ReactNode {
     return (
       <ScrollContext.Provider value={this._stateStorage}>
         {this.props.children}

packages/gatsby-react-router-scroll/src/session-storage.ts

@@ -28,7 +28,7 @@ export class SessionStorage {
     }
   }
 
-  save(location: Location, key: string, value: number) {
+  save(location: Location, key: string, value: number): void {
     const stateKey = this.getStateKey(location, key)
     const storedValue = JSON.stringify(value)
 
@@ -50,7 +50,7 @@ export class SessionStorage {
     }
   }
 
-  getStateKey(location: Location, key: string) {
+  getStateKey(location: Location, key: string): string {
     const locationKey = location.key || location.pathname
     const stateKeyBase = `${STATE_KEY_PREFIX}${locationKey}`
     return key === null || typeof key === `undefined`

packages/gatsby-react-router-scroll/src/use-scroll-restoration.ts

@@ -2,20 +2,31 @@ import { ScrollContext } from "./scroll-handler"
 import { useRef, useContext, useLayoutEffect } from "react"
 import { useLocation } from "@reach/router"
 
-export function useScrollRestoration(identifier: string) {
+interface IScrollRestorationProps {
+  ref: React.MutableRefObject<HTMLElement | undefined>
+  onScroll(): void
+}
+
+export function useScrollRestoration(
+  identifier: string
+): IScrollRestorationProps {
   const location = useLocation()
   const state = useContext(ScrollContext)
   const ref = useRef<HTMLElement>()
 
-  useLayoutEffect(() => {
-    const position = state.read(location, identifier)
-    ref.current!.scrollTo(0, position)
+  useLayoutEffect((): void => {
+    if (ref.current) {
+      const position = state.read(location, identifier)
+      ref.current.scrollTo(0, position)
+    }
   }, [])
 
   return {
     ref,
-    onScroll() {
-      state.save(location, identifier, ref.current!.scrollTop)
+    onScroll(): void {
+      if (ref.current) {
+        state.save(location, identifier, ref.current.scrollTop)
+      }
     },
   }
 }