Bring back the new post button

Author: markharding

apps/polycentric/src/common/components/layout/Layout.tsx

@@ -25,7 +25,8 @@ import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import WEB_LOGO from '../../assets/images/WebLogo.png';
 import { VerticalNav } from './nav/VerticalNav';
 import { Ionicons } from '@expo/vector-icons';
-import { FUTO_URL } from '../../constants';
+import { FUTO_URL, openCompose } from '../../constants';
+import { Button } from '../primitives';
 
 type MainProps = {
   children: ReactElement | ReactElement[];
@@ -161,7 +162,7 @@ export const LeftSidebar = memo(function LeftSidebar({
               Atoms.align_center,
               Atoms.h_full,
               {
-                paddingHorizontal: narrowSidebar ? 0 : 60,
+                paddingHorizontal: narrowSidebar ? 0 : 30,
                 width: narrowSidebar ? 88 : 275,
               },
             ]}
@@ -188,6 +189,18 @@ export const LeftSidebar = memo(function LeftSidebar({
               <VerticalNav />
             </View>
             {/* 2nd Section (bottom) */}
+            <View style={[Atoms.py_md, Atoms.self_stretch]}>
+              <Button
+                title="New Post"
+                variant="primary"
+                size="md"
+                fullWidth
+                icon={({ size, color }) => (
+                  <Ionicons name="add-circle" size={size} color={color} />
+                )}
+                onPress={() => openCompose()}
+              />
+            </View>
           </View>
         </View>
       </View>

apps/polycentric/src/common/components/primitives/Button.tsx

@@ -1,6 +1,7 @@
 import { usePressAnimation } from '@/src/common/lib/animation';
 import { useWebHover } from '@/src/common/lib/useWebHover';
 import {
+  Atoms,
   BorderRadius,
   useTheme,
   withHexOpacity,
@@ -51,9 +52,9 @@ const SIZE_CONFIG: Record<
     borderRadius: BorderRadiusToken;
   }
 > = {
-  sm: { paddingV: 4, paddingH: 6, iconSize: 16, borderRadius: 'sm' },
-  md: { paddingV: 12, paddingH: 18, iconSize: 20, borderRadius: 'lg' },
-  lg: { paddingV: 18, paddingH: 24, iconSize: 24, borderRadius: 'lg' },
+  sm: { paddingV: 4, paddingH: 6, iconSize: 16, borderRadius: 'full' },
+  md: { paddingV: 12, paddingH: 18, iconSize: 20, borderRadius: 'full' },
+  lg: { paddingV: 18, paddingH: 24, iconSize: 24, borderRadius: 'full' },
 };
 
 export function Button({
@@ -95,6 +96,7 @@ export function Button({
         hitSlop={8}
         style={[
           styles.base,
+          fullWidth && Atoms.w_full,
           !fullWidth && styles.fitContent,
           {
             paddingVertical: sizeConfig.paddingV,