add fixes

- fix footer size when there are no designs
- fix designs not showing up unless a category is selected

Author: kaeizen

src/components/modal-design-library/editor.scss

@@ -39,7 +39,7 @@
 	.ugb-modal-design-library__wrapper {
 		display: grid;
 		grid-template-columns: 300px auto;
-		grid-template-rows: auto;
+		grid-template-rows: auto auto 80px;
 		flex: 1;
 		height: 100%;
 	}

src/components/modal-design-library/modal.js

@@ -53,7 +53,7 @@ export const ModalDesignLibrary = props => {
 
 	const [ isMultiSelectBusy, setIsMultiSelectBusy ] = useState( false )
 
-	const [ selectedTab, _setSelectedTab ] = useLocalStorage( 'stk__design_library__block-list__view_by', 'patterns' )
+	const [ selectedTab, setSelectedTab ] = useLocalStorage( 'stk__design_library__block-list__view_by', 'patterns' )
 	const [ selectedCategory, setSelectedCategory ] = useLocalStorage( 'stk__design_library__block-list__selected', '' )
 	const [ selectedPlan, setSelectedPlan ] = useLocalStorage( 'stk__design_library__view-plan', PLAN_OPTIONS[ 0 ] )
 
@@ -68,6 +68,17 @@ export const ModalDesignLibrary = props => {
 
 	const openDropdownRef = useRef( null )
 
+	// For version 4, the default tab is now 'patterns' and for category, we use '' instead of 'All'.
+	// So we need to update the local storage values here.
+	useEffect( () => {
+		const version = window.localStorage.getItem( 'stk__design_library__version' )
+		if ( ! version ) {
+			window.localStorage.setItem( 'stk__design_library__version', 'v4' )
+			setSelectedTab( 'patterns' )
+			setSelectedCategory( '' )
+		}
+	}, [] )
+
 	// Update the designs on the sidebar. (this will trigger the display designs update next)
 	useEffect( () => {
 		if ( doReset ) {