make progress

Author: kentcdodds

README.md

@@ -35,10 +35,6 @@
 
 ## Prerequisites
 
-- Read my blog post
-  [Inversion of Control](https://kentcdodds.com/blog/inversion-of-control). Or
-  watch
-  [Implement Inversion of Control](https://egghead.io/lessons/egghead-implement-inversion-of-control?pl=kent-s-blog-posts-as-screencasts-eefa540c&af=5236ad)
 - The more experience you have with building React abstractions, the more
   helpful this workshop will be for you.
 
@@ -47,7 +43,8 @@
 Here are some resources you can read before taking the workshop to get you up to
 speed on some of the tools and concepts we'll be covering:
 
-- TODO: add resources
+- [Inversion of Control](https://kentcdodds.com/blog/inversion-of-control)
+- [Implement Inversion of Control](https://egghead.io/lessons/egghead-implement-inversion-of-control?pl=kent-s-blog-posts-as-screencasts-eefa540c&af=5236ad)
 
 ## System Requirements
 

exercises/01.latest-ref/01.problem/README.mdx renamed to exercises/01.latest-ref/01.problem.ref/README.mdx

@@ -1,7 +1,7 @@
 # Latest Ref
 
-In our exercise, we have a `useDebounce` function that isn't working the way we
-want with hooks. We're going to need to "change the default" using the latest
+👨‍💼 In our exercise, we have a `useDebounce` function that isn't working the way
+we want with hooks. We're going to need to "change the default" using the latest
 ref pattern.
 
 `debounce` is a pattern that's often used in user-input fields. For example, if
@@ -29,7 +29,7 @@ want to make it so this works:
 
 (Keep in mind, the tests are there to help you know you got it right).
 
-Before continuing here, please familiarize yourself with the exercise and how
+Before continuing here, please familiarize yourself with the code to know how
 it's implemented... Got it? Great, let's continue.
 
 Right now, you can play around with two different problems with the way our

exercises/01.latest-ref/01.problem/index.tsx renamed to exercises/01.latest-ref/01.problem.ref/index.tsx

@@ -1,8 +1,10 @@
 # Latest Ref
 
-**One liner:** The Latest Ref Pattern allows you to have a reference to the
-latest value of a prop, state, or callback without needing to list it in a
-dependency array when accessing it in a `useEffect`.
+<callout-success>
+	**One liner:** The Latest Ref Pattern allows you to have a reference to the
+	latest value of a prop, state, or callback without needing to list it in a
+	dependency array when accessing it in a `useEffect`.
+</callout-success>
 
 When React introduced hooks it did more than give us an excellent primitive with
 super abstract-ability powers. It also changed an important default that results

exercises/01.latest-ref/01.solution/README.mdx renamed to exercises/01.latest-ref/01.solution.ref/README.mdx

@@ -1,7 +1,9 @@
 # Composition
 
-**One liner:** The Composition and Layout Components Pattern helps to avoid the
-prop drilling problem and enhances the reusability of your components.
+<callout-success>
+	**One liner:** The Composition and Layout Components Pattern helps to avoid
+	the prop drilling problem and enhances the reusability of your components.
+</callout-success>
 
 🦉 If you're unfamiliar with the concept of "Prop Drilling" then please read
 [this blog post](https://kentcdodds.com/blog/prop-drilling) before going

exercises/01.latest-ref/01.solution/increments.test.tsx renamed to exercises/01.latest-ref/01.solution.ref/increments.test.tsx

@@ -1,8 +1,10 @@
 # Compound Components
 
-**One liner:** The Compound Components Pattern enables you to provide a set of
-components that implicitly share state for a simple yet powerful declarative API
-for reusable components.
+<callout-success>
+	**One liner:** The Compound Components Pattern enables you to provide a set of
+	components that implicitly share state for a simple yet powerful declarative
+	API for reusable components.
+</callout-success>
 
 Compound components are components that work together to form a complete UI. The
 classic example of this is `<select>` and `<option>` in HTML:
@@ -37,7 +39,7 @@ it's selected? We can easily add API surface area to support these use cases,
 but that's just more for us to code and more for users to learn. That's where
 compound components come in really handy!
 
-import { Toggle } from '../07.control-props/02.solution.warnings/toggle'
+import { Toggle } from '../07.control-props/01.solution/toggle'
 
 For the rest of the exercises in this workshop, we'll be working with a Toggle
 component. Specifically, this one:
@@ -67,7 +69,7 @@ pattern.
 
 **Real World Projects that use this pattern:**
 
-- [`@reach/tabs`](https://reacttraining.com/reach-ui/tabs)
-- [`@reach/accordion`](https://reacttraining.com/reach-ui/accordion)
-- Actually most of [Reach UI](https://reacttraining.com/reach-ui) implements
+- [`@radix-ui/react-tabs`](https://www.radix-ui.com/primitives/docs/components/tabs)
+- [`@radix-ui/react-accordion`](https://www.radix-ui.com/primitives/docs/components/accordion)
+- Actually most of [Radix UI](https://www.radix-ui.com/primitives) implements
   this pattern