From 84d8f40b23459b4a890b71de3d47ecbe0fc4ecf1 Mon Sep 17 00:00:00 2001
From: Alec Swanson <aswanson@newrelic.com>
Date: Wed, 17 Aug 2022 11:21:17 -0700
Subject: [PATCH] fix: re-reduce bundle size

* We missed some imports from the default theme exporter file during PR
  review
* This lead to our bundle size being increase back to what it was before
  we worked on it
* This corrects those imports and adds an eslint rule to help us avoid
  this issue in the future
* Also renames QuickstartGrid to `js` instead of `jsx` so that eslint
  picks it up
---
 .eslintrc.js                                      | 15 +++++++++++++++
 src/components/GoToTopButton.js                   |  2 +-
 .../{QuickstartGrid.jsx => QuickstartGrid.js}     |  3 ++-
 src/pages/index.jsx                               |  2 +-
 4 files changed, 19 insertions(+), 3 deletions(-)
 rename src/components/{QuickstartGrid.jsx => QuickstartGrid.js} (91%)

diff --git a/.eslintrc.js b/.eslintrc.js
index f1bbf0a6..fc86c3ff 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -66,5 +66,20 @@ module.exports = {
         ignoreRestSiblings: false,
       },
     ],
+    // This prevents us from accidently importing from the theme's `index` file
+    // and pulling in a bunch of extra dependecies.
+    'no-restricted-imports': [
+      'error',
+      {
+        paths: [
+          {
+            name: '@newrelic/gatsby-theme-newrelic',
+            message:
+              'Please import the module directly from @newrelic/gatsby-theme-newrelic/src/[module] instead.',
+          },
+        ],
+        patterns: ['!@newrelic/gatsby-theme-newrelic/*'],
+      },
+    ],
   },
 };
diff --git a/src/components/GoToTopButton.js b/src/components/GoToTopButton.js
index 88e4a1d5..b0c03248 100644
--- a/src/components/GoToTopButton.js
+++ b/src/components/GoToTopButton.js
@@ -2,7 +2,7 @@ import React, { useEffect } from 'react';
 import PropTypes from 'prop-types';
 import { css } from '@emotion/react';
 
-import { Button } from '@newrelic/gatsby-theme-newrelic';
+import Button from '@newrelic/gatsby-theme-newrelic/src/components/Button';
 
 import featherIcons from '@newrelic/gatsby-theme-newrelic/src/icons/feather';
 
diff --git a/src/components/QuickstartGrid.jsx b/src/components/QuickstartGrid.js
similarity index 91%
rename from src/components/QuickstartGrid.jsx
rename to src/components/QuickstartGrid.js
index e142959b..15c2c6ea 100644
--- a/src/components/QuickstartGrid.jsx
+++ b/src/components/QuickstartGrid.js
@@ -1,7 +1,8 @@
 import React, { useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
 import { css } from '@emotion/react';
-import { Button, Surface } from '@newrelic/gatsby-theme-newrelic';
+import Button from '@newrelic/gatsby-theme-newrelic/src/components/Button';
+import Surface from '@newrelic/gatsby-theme-newrelic/src/components/Surface';
 import QuickstartTile from '@components/QuickstartTile';
 import { quickstart } from '../types';
 
diff --git a/src/pages/index.jsx b/src/pages/index.jsx
index 0e9a8bc5..abaee7ce 100644
--- a/src/pages/index.jsx
+++ b/src/pages/index.jsx
@@ -22,7 +22,7 @@ import allFilteredQuickstarts from '@utils/allFilteredQuickstarts';
 import getDisplayName from '@utils/getDisplayName';
 // Components
 import Slider from 'react-slick';
-import { Spinner } from '@newrelic/gatsby-theme-newrelic';
+import Spinner from '@newrelic/gatsby-theme-newrelic/src/components/Spinner';
 import IOBanner from '@components/IOBanner';
 import IOSeo from '@components/IOSeo';
 import QuickstartTile from '@components/QuickstartTile';