feat: upgrade chakra from RC to stable release (#131)

* feat:upgrade chakra from RC to stable release * lock cross-fetch version * lock version of chakra
echobind · Mar 30, 2021 · 9ac40bc · 9ac40bc
1 parent 68c835e
commit 9ac40bc
Show file tree

Hide file tree

Showing 16 changed files with 22 additions and 20 deletions.
diff --git a/packages/create-bison-app/template/README.md.ejs b/packages/create-bison-app/template/README.md.ejs
@@ -333,7 +333,7 @@ You should now have a fully working form that creates a new database entry on su
 ```jsx
 import React from 'react';
 import gql from 'graphql-tag';
-import { Spinner, Text } from '@chakra-ui/core';
+import { Spinner, Text } from '@chakra-ui/react';
 
 export const QUERY = gql`
   query organization {
@@ -413,7 +413,7 @@ export const QUERY = gql`
 ```tsx
 import React from 'react';
 import gql from 'graphql-tag';
-import { Spinner, Text } from '@chakra-ui/core';
+import { Spinner, Text } from '@chakra-ui/react';
 
 import { OrganizationQuery, useOrganizationQuery } from '../types';
 
@@ -453,7 +453,7 @@ export const OrganizationCell = ({ organizationId }) => {
 ```tsx
 import React from 'react';
 import Head from 'next/head';
-import { Flex } from '@chakra-ui/core';
+import { Flex } from '@chakra-ui/react';
 import { useRouter } from 'next/router';
 
 import { OrganizationCell } from '../../cells/OrganizationCell';

diff --git a/packages/create-bison-app/template/_templates/cell/new/new.ejs b/packages/create-bison-app/template/_templates/cell/new/new.ejs
@@ -5,7 +5,7 @@ to: cells/<%= [h.inflection.camelize(h.dirName(name)), h.camelizedBaseName(name)
 <% component = h.camelizedBaseName(name) -%>
 import React from 'react';
 import gql from 'graphql-tag';
-import { Spinner, Text } from '@chakra-ui/core';
+import { Spinner, Text } from '@chakra-ui/react';
 
 import { useMyProfileQuery, MyProfileQuery } from '../types';
 

diff --git a/packages/create-bison-app/template/_templates/component/new/new.ejs b/packages/create-bison-app/template/_templates/component/new/new.ejs
@@ -4,7 +4,7 @@ to: components/<%= [h.inflection.camelize(h.dirName(name)), h.camelizedBaseName(
 <% formattedPath = h.camelizedPathName(name) -%>
 <% component = h.camelizedBaseName(name) -%>
 import React from 'react';
-import { Heading, Center } from '@chakra-ui/core';
+import { Heading, Center } from '@chakra-ui/react';
 
 /** Description of component */
 export function <%= component %>() {

diff --git a/packages/create-bison-app/template/_templates/page/new/new.ejs b/packages/create-bison-app/template/_templates/page/new/new.ejs
@@ -6,7 +6,7 @@ to: pages/<%= name %>.tsx
 <% base = h.camelizedBaseName(name) -%>
 import React from 'react';
 import Head from 'next/head';
-import { Heading, Center, Flex } from '@chakra-ui/core';
+import { Heading, Center, Flex } from '@chakra-ui/react';
 
 function <%= pageName %>() {
   return (

diff --git a/packages/create-bison-app/template/components/AllProviders.tsx b/packages/create-bison-app/template/components/AllProviders.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { ChakraProvider, CSSReset } from '@chakra-ui/core';
+import { ChakraProvider, CSSReset } from '@chakra-ui/react';
 import { ApolloProvider } from '@apollo/client';
 
 import { AuthProvider } from '../context/auth';

diff --git a/packages/create-bison-app/template/components/CenteredBoxForm.tsx b/packages/create-bison-app/template/components/CenteredBoxForm.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Box } from '@chakra-ui/core';
+import { Box } from '@chakra-ui/react';
 
 /** A form with a centered box. Ex: Login, Signup */
 export function CenteredBoxForm({ children }) {

diff --git a/packages/create-bison-app/template/components/ErrorText.tsx b/packages/create-bison-app/template/components/ErrorText.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Text, TextProps } from '@chakra-ui/core';
+import { Text, TextProps } from '@chakra-ui/react';
 
 /** Renders error text under form inputs */
 export function ErrorText({ children, ...textProps }: TextProps) {

diff --git a/packages/create-bison-app/template/components/FullPageSpinner.tsx b/packages/create-bison-app/template/components/FullPageSpinner.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Spinner, Center } from '@chakra-ui/core';
+import { Spinner, Center } from '@chakra-ui/react';
 
 /** Renders a full page loading spinner */
 export function FullPageSpinner() {

diff --git a/packages/create-bison-app/template/components/LoginForm.tsx b/packages/create-bison-app/template/components/LoginForm.tsx
@@ -11,7 +11,7 @@ import {
   Stack,
   Button,
   Circle,
-} from '@chakra-ui/core';
+} from '@chakra-ui/react';
 import { useForm } from 'react-hook-form';
 import { gql } from '@apollo/client';
 

diff --git a/packages/create-bison-app/template/components/Logo.tsx b/packages/create-bison-app/template/components/Logo.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Heading } from '@chakra-ui/core';
+import { Heading } from '@chakra-ui/react';
 import NextLink from 'next/link';
 
 export function Logo() {

diff --git a/packages/create-bison-app/template/components/Nav.tsx b/packages/create-bison-app/template/components/Nav.tsx
@@ -8,7 +8,7 @@ import {
   Menu,
   MenuList,
   MenuItem,
-} from '@chakra-ui/core';
+} from '@chakra-ui/react';
 import NextLink from 'next/link';
 
 export function Nav() {

diff --git a/packages/create-bison-app/template/components/SignupForm.tsx b/packages/create-bison-app/template/components/SignupForm.tsx
@@ -10,7 +10,7 @@ import {
   Stack,
   Button,
   Circle,
-} from '@chakra-ui/core';
+} from '@chakra-ui/react';
 import { gql } from '@apollo/client';
 import { useForm } from 'react-hook-form';
 import { useRouter } from 'next/router';

diff --git a/packages/create-bison-app/template/layouts/LoggedIn.tsx b/packages/create-bison-app/template/layouts/LoggedIn.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { useRouter } from 'next/router';
-import { Box, Center, Flex, Text, Button } from '@chakra-ui/core';
+import { Box, Center, Flex, Text, Button } from '@chakra-ui/react';
 
 import { Logo } from '../components/Logo';
 import { Nav } from '../components/Nav';

diff --git a/packages/create-bison-app/template/layouts/LoggedOut.tsx b/packages/create-bison-app/template/layouts/LoggedOut.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Box, Center, Flex, Text, Button } from '@chakra-ui/core';
+import { Box, Center, Flex, Text, Button } from '@chakra-ui/react';
 import NextLink from 'next/link';
 
 import { Logo } from '../components/Logo';

diff --git a/packages/create-bison-app/template/package.json.ejs b/packages/create-bison-app/template/package.json.ejs
@@ -42,8 +42,8 @@
   },
   "dependencies": {
     "@apollo/client": "^3.0.2",
-    "@chakra-ui/core": "^1.0.0-rc.5",
-    "@chakra-ui/theme": "^1.0.0-rc.5",
+    "@chakra-ui/react": "1.3.4",
+    "@chakra-ui/theme": "1.7.1",
     "@nexus/schema": "^0.16.0",
     "@prisma/client": "2.8.1",
 <% if (host.name === 'vercel') { -%>
@@ -53,7 +53,9 @@
     "apollo-server-express": "^2.18.1",
 <% } -%>
     "bcryptjs": "^2.4.3",
-    "cross-fetch": "^3.0.5",
+    "cross-fetch": "3.0.5",
+    "@emotion/react": "^11.0.0",
+    "@emotion/styled": "^11.0.0",
     "framer-motion": "^2.9.4",
     "graphql": "^15.3.0",
     "graphql-scalars": "^1.3.0",

diff --git a/packages/create-bison-app/template/pages/index.tsx b/packages/create-bison-app/template/pages/index.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import Head from 'next/head';
-import { Heading, Center } from '@chakra-ui/core';
+import { Heading, Center } from '@chakra-ui/react';
 
 function Home() {
   return (