mirror/spacedrive
1
0
Fork 0
mirror of https://github.com/spacedriveapp/spacedrive.git synced 2026-05-19 05:45:01 -04:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'main' of github.com:spacedriveapp/spacedrive into eng-1828-migration-to-new-cloud-api-system

Browse Source
This commit is contained in:
Ericson Soares
2024-08-27 17:01:58 -03:00
parent 3cd7f8de6a 7eae1c2e58
commit 01008c2569
11 changed files with 123 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
apps/mobile/src/components/explorer/FileRow.tsx
View File

@@ -36,16 +36,14 @@ const FileRow = ({ data, onLongPress, onPress, renameHandler }: FileRowProps) =>
<View
style={tw`mx-2 flex-1 flex-row items-center justify-between border-b border-white/10 pb-3`}
>
<Pressable onLongPress={renameHandler}>
<View style={twStyle(tags.length === 0 ? 'w-full' : 'max-w-[85%]')}>
<Text
numberOfLines={1}
style={tw`text-left text-sm font-medium text-ink`}
>
{filePath?.name}
{filePath?.extension && `.${filePath.extension}`}
</Text>
</View>
<Pressable
style={twStyle(tags.length === 0 ? 'w-full' : 'max-w-[85%]')}
onLongPress={renameHandler}
>
<Text numberOfLines={1} style={tw`text-left text-sm font-medium text-ink`}>
{filePath?.name}
{filePath?.extension && `.${filePath.extension}`}
</Text>
</Pressable>
<View
style={twStyle(`mr-1 flex-row`, {

2
apps/mobile/src/components/locations/GridLocation.tsx
View File

@@ -47,7 +47,7 @@ const GridLocation: React.FC<GridLocationProps> = ({ location, modalRef }: GridL
</Text>
</View>
<View style={tw`rounded-md border border-app-box/70 bg-app/70 px-1 py-0.5`}>
<Text style={tw`text-xs font-bold text-ink-dull`} numberOfLines={1}>
<Text style={tw`text-xs font-medium text-ink-dull`} numberOfLines={1}>
{`${humanizeSize(location.size_in_bytes)}`}
</Text>
</View>

1
apps/mobile/src/components/overview/Locations.tsx
View File

@@ -68,6 +68,7 @@ const Locations = () => {
>
<StatCard
connectionType={null}
type="location"
totalSpace={item.size_in_bytes || [0]}
name={item.name || ''}
color="#0362FF"

50
apps/mobile/src/components/overview/StatCard.tsx
View File

@@ -14,9 +14,12 @@ type StatCardProps = {
freeSpace?: string | number[];
color: string;
connectionType: 'lan' | 'p2p' | 'cloud' | null;
type?: 'location' | 'device'; //for layout purposes
};
const StatCard = ({ icon, name, connectionType, ...stats }: StatCardProps) => {
const infoBox = tw`rounded border border-app-lightborder/50 bg-app-highlight/50 px-1.5 py-px`;
const StatCard = ({ icon, name, connectionType, type, ...stats }: StatCardProps) => {
const [mounted, setMounted] = useState(false);
const { totalSpace, freeSpace, usedSpaceSpace } = useMemo(() => {
@@ -35,7 +38,8 @@ const StatCard = ({ icon, name, connectionType, ...stats }: StatCardProps) => {
const progress = useMemo(() => {
if (!mounted || totalSpace.bytes === 0n) return 0;
return Math.floor((usedSpaceSpace.value / totalSpace.value) * 100);
// Calculate progress using raw bytes to avoid unit conversion issues
return Math.floor((Number(usedSpaceSpace.bytes) / Number(totalSpace.bytes)) * 100);
}, [mounted, totalSpace, usedSpaceSpace]);
return (
@@ -47,18 +51,26 @@ const StatCard = ({ icon, name, connectionType, ...stats }: StatCardProps) => {
size={90}
width={7}
rotation={0}
fill={usedSpaceSpace.value}
fill={progress}
lineCap="round"
backgroundColor={tw.color('ink-light/5')}
tintColor={progress > 90 ? '#E14444' : '#2599FF'}
tintColor={
progress >= 90
? '#E14444'
: progress >= 75
? 'darkorange'
: progress >= 60
? 'yellow'
: '#2599FF'
}
style={tw`flex items-center justify-center`}
>
{(fill) => (
{() => (
<View
style={tw`absolute flex-row items-end gap-0.5 text-lg font-semibold`}
>
<Text style={tw`mx-auto text-md font-semibold text-ink`}>
{fill.toFixed(0)}
{usedSpaceSpace.value}
</Text>
<Text style={tw`text-xs font-bold text-ink-dull opacity-60`}>
{usedSpaceSpace.unit}
@@ -70,22 +82,30 @@ const StatCard = ({ icon, name, connectionType, ...stats }: StatCardProps) => {
)}
<View style={tw`flex-col overflow-hidden`}>
<Icon style={tw`-ml-1`} name={icon} size={60} />
<Text numberOfLines={1} style={tw`max-w-[130px] py-1 font-medium text-ink`}>
<Text numberOfLines={1} style={tw`max-w-[150px] py-1 font-medium text-ink`}>
{name}
</Text>
<Text numberOfLines={1} style={tw`max-w-[130px] text-ink-faint`}>
{freeSpace.value}
{freeSpace.unit} free of {totalSpace.value}
{totalSpace.unit}
</Text>
{type !== 'location' && (
<Text numberOfLines={1} style={tw`max-w-[150px] text-xs text-ink-faint`}>
{freeSpace.value}
{freeSpace.unit} free of {totalSpace.value}
{totalSpace.unit}
</Text>
)}
</View>
</View>
<View
style={tw`flex h-10 flex-row items-center gap-1.5 border-t border-app-cardborder px-2`}
>
<View
style={tw`rounded border border-app-lightborder bg-app-highlight px-1.5 py-px`}
>
{type === 'location' && (
<View style={infoBox}>
<Text style={tw`text-xs font-medium uppercase text-ink-dull`}>
{totalSpace.value}
{totalSpace.unit}
</Text>
</View>
)}
<View style={infoBox}>
<Text style={tw`text-xs font-medium uppercase text-ink-dull`}>
{connectionType || 'Local'}
</Text>

2
apps/mobile/src/navigation/DrawerNavigator.tsx
View File

@@ -26,7 +26,7 @@ export default function DrawerNavigator() {
drawerType: 'slide',
swipeEdgeWidth: 50
}}
drawerContent={(props) => <DrawerContent {...(props as any)} />}
drawerContent={(props) => <DrawerContent {...props} />}
>
<Drawer.Screen name="Home" component={TabNavigator} />
</Drawer.Navigator>

2
apps/mobile/src/screens/browse/Location.tsx
View File

@@ -59,7 +59,7 @@ export default function LocationScreen({ navigation, route }: BrowseStackScreenP
const paths = usePathsExplorerQuery({
arg: {
filters: [...defaultFilters, ...layoutFilter].filter(Boolean) as any,
filters: [...defaultFilters, ...layoutFilter].filter(Boolean),
take: 30
},
order,

4
interface/app/$libraryId/TopBar/TopBarOptions.tsx
View File

@@ -66,7 +66,6 @@ export default ({ options }: TopBarChildrenProps) => {
/>
))
)}
{os === 'windows' && <WindowsControls windowSize={windowSize} />}
</div>
<TopBarMobile
toolOptions={options}
@@ -74,6 +73,7 @@ export default ({ options }: TopBarChildrenProps) => {
windowSize <= 1279 && (toolsNotSmFlex?.length as number) > 0 ? 'flex' : 'hidden'
}
/>
{os === 'windows' && <WindowsControls windowSize={windowSize} />}
</div>
);
};
@@ -193,7 +193,7 @@ export function WindowsControls({ windowSize }: { windowSize: number }) {
getWindowState().catch(console.error);
}, [getWindowState, windowSize]);
return (
<div className="mx-1 hidden items-center xl:flex">
<div className="mx-1 ml-4 flex items-center">
<TopBarButton
className="mx-2"
rounding="both"

31
interface/app/$libraryId/overview/index.tsx
View File

@@ -53,36 +53,7 @@ export const Component = () => {
</div>
}
center={<SearchBar redirectToSearch />}
right={
os === 'windows' && <TopBarOptions />
// <TopBarOptions
// options={[
// [
// {
// toolTipLabel: 'Spacedrop',
// onClick: () => {},
// icon: <Broadcast className={TOP_BAR_ICON_STYLE} />,
// individual: true,
// showAtResolution: 'sm:flex'
// },
// {
// toolTipLabel: 'Key Manager',
// onClick: () => {},
// icon: <Key className={TOP_BAR_ICON_STYLE} />,
// individual: true,
// showAtResolution: 'sm:flex'
// },
// {
// toolTipLabel: 'Overview Display Settings',
// onClick: () => {},
// icon: <SlidersHorizontal className={TOP_BAR_ICON_STYLE} />,
// individual: true,
// showAtResolution: 'sm:flex'
// }
// ]
// ]}
// />
}
right={os === 'windows' && <TopBarOptions />}
/>
<div className="mt-4 flex flex-col gap-3 pt-3">
<OverviewSection>

3
package.json
View File

@@ -38,7 +38,8 @@
"@remix-run/router@1.13.1": "patches/@remix-run__router@1.13.1.patch",
"@contentlayer/cli@0.3.4": "patches/@contentlayer__cli@0.3.4.patch",
"@oscartbeaumont-sd/rspc-tauri@0.0.0-main-dc31e5b2": "patches/@oscartbeaumont-sd__rspc-tauri@0.0.0-main-dc31e5b2.patch",
"tailwindcss-animate@1.0.7": "patches/tailwindcss-animate@1.0.7.patch"
"tailwindcss-animate@1.0.7": "patches/tailwindcss-animate@1.0.7.patch",
"@react-navigation/drawer@6.6.15": "patches/@react-navigation__drawer@6.6.15.patch"
},
"overrides": {
"@types/node": ">18.18.x",

71
patches/@react-navigation__drawer@6.6.15.patch Normal file
View File

@@ -0,0 +1,71 @@
diff --git a/src/views/modern/Drawer.tsx b/src/views/modern/Drawer.tsx
index 9909e9698e51379de6469eb2053a1432636d0c7d..220fa07f6784c5da13e6949e9c4893e015a5d1f8 100644
--- a/src/views/modern/Drawer.tsx
+++ b/src/views/modern/Drawer.tsx
@@ -1,26 +1,27 @@
import * as React from 'react';
import {
- I18nManager,
- InteractionManager,
- Keyboard,
- Platform,
- StatusBar,
- StyleSheet,
- View,
+ Dimensions,
+ I18nManager,
+ InteractionManager,
+ Keyboard,
+ Platform,
+ StatusBar,
+ StyleSheet,
+ View,
} from 'react-native';
import {
- PanGestureHandler,
- PanGestureHandlerGestureEvent,
- State as GestureState,
+ PanGestureHandler,
+ PanGestureHandlerGestureEvent,
+ State as GestureState,
} from 'react-native-gesture-handler';
import Animated, {
- interpolate,
- runOnJS,
- useAnimatedGestureHandler,
- useAnimatedStyle,
- useDerivedValue,
- useSharedValue,
- withSpring,
+ interpolate,
+ runOnJS,
+ useAnimatedGestureHandler,
+ useAnimatedStyle,
+ useDerivedValue,
+ useSharedValue,
+ withSpring,
} from 'react-native-reanimated';
import type { DrawerProps } from '../../types';
@@ -72,7 +73,8 @@ export default function Drawer({
const percentage = Number(width.replace(/%$/, ''));
if (Number.isFinite(percentage)) {
- return dimensions.width * (percentage / 100);
+ const dimensionsWidth = Dimensions.get("screen").width
+ return dimensionsWidth * (percentage / 100);
}
}
@@ -283,9 +285,10 @@ export default function Drawer({
return translateX;
});
+ const dimensionsWidth = Dimensions.get("screen").width;
const isRTL = I18nManager.getConstants().isRTL;
const drawerAnimatedStyle = useAnimatedStyle(() => {
- const distanceFromEdge = dimensions.width - drawerWidth;
+ const distanceFromEdge = dimensionsWidth - drawerWidth;
return {
transform:

BIN
pnpm-lock.yaml generated
View File

Binary file not shown.