about summary refs log tree commit diff
path: root/src/components/Loader.tsx
diff options
context:
space:
mode:
authorPaul Frazee <pfrazee@gmail.com>2024-01-25 15:33:23 -0800
committerGitHub <noreply@github.com>2024-01-25 15:33:23 -0800
commit5443503593a67cc7ff6e081ef9b1fe66ea0cbe0d (patch)
tree3a18e5a1b3a272c6ee7705dc6d64a9e17a23a9df /src/components/Loader.tsx
parent335bef3d308e6aff2238fc4820bd39c8f7517112 (diff)
downloadvoidsky-5443503593a67cc7ff6e081ef9b1fe66ea0cbe0d.tar.zst
Add account-activation queueing to signup (#2613)
* Add deactivated-account tracking

* Center button text

* Add Deactivated screen

* Add icon to Deactivated screen

* Abort session resumption if the session is deactivated

* Implement deactivated screen status checks

* Bump api@0.9.5

* Use new typo-fixed scope

* UI refinements
Diffstat (limited to 'src/components/Loader.tsx')
-rw-r--r--src/components/Loader.tsx41
1 files changed, 41 insertions, 0 deletions
diff --git a/src/components/Loader.tsx b/src/components/Loader.tsx
new file mode 100644
index 000000000..bbe4e2f75
--- /dev/null
+++ b/src/components/Loader.tsx
@@ -0,0 +1,41 @@
+import React from 'react'
+import Animated, {
+  Easing,
+  useSharedValue,
+  useAnimatedStyle,
+  withRepeat,
+  withTiming,
+} from 'react-native-reanimated'
+
+import {atoms as a} from '#/alf'
+import {Props, useCommonSVGProps} from '#/components/icons/common'
+import {Loader_Stroke2_Corner0_Rounded as Icon} from '#/components/icons/Loader'
+
+export function Loader(props: Props) {
+  const common = useCommonSVGProps(props)
+  const rotation = useSharedValue(0)
+
+  const animatedStyles = useAnimatedStyle(() => ({
+    transform: [{rotate: rotation.value + 'deg'}],
+  }))
+
+  React.useEffect(() => {
+    rotation.value = withRepeat(
+      withTiming(360, {duration: 500, easing: Easing.linear}),
+      -1,
+    )
+  }, [rotation])
+
+  return (
+    <Animated.View
+      style={[
+        a.relative,
+        a.justify_center,
+        a.align_center,
+        {width: common.size, height: common.size},
+        animatedStyles,
+      ]}>
+      <Icon {...props} style={[a.absolute, a.inset_0, props.style]} />
+    </Animated.View>
+  )
+}