Compare commits
5 Commits
fix/FIBERO
...
main
| Author | SHA1 | Date | |
|---|---|---|---|
| 761e80bca2 | |||
| bc22f0c6f6 | |||
| c649b2f61b | |||
| 313a2f8a03 | |||
| c0d36fd895 |
59
BUILD.md
Normal file
59
BUILD.md
Normal file
@@ -0,0 +1,59 @@
|
|||||||
|
# Building FiberOps Android APK
|
||||||
|
|
||||||
|
## Requirements
|
||||||
|
|
||||||
|
- [Expo account](https://expo.dev) — register at expo.dev
|
||||||
|
- EAS CLI: `npm install -g eas-cli`
|
||||||
|
- Authenticate: `eas login`
|
||||||
|
|
||||||
|
## Build (EAS Cloud — recommended)
|
||||||
|
|
||||||
|
Builds the APK on Expo's cloud infrastructure. No local Android SDK needed.
|
||||||
|
|
||||||
|
```bash
|
||||||
|
eas build --profile preview --platform android
|
||||||
|
```
|
||||||
|
|
||||||
|
Or via npm script:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npm run build:android:apk
|
||||||
|
```
|
||||||
|
|
||||||
|
The build will be queued on EAS. Once complete, download the `.apk` from the Expo dashboard or the URL printed in the CLI output.
|
||||||
|
|
||||||
|
## Build (local — requires Android SDK)
|
||||||
|
|
||||||
|
Requires Android SDK installed and `ANDROID_HOME` set.
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npm run build:android:local
|
||||||
|
# or directly:
|
||||||
|
eas build --local --profile preview --platform android
|
||||||
|
```
|
||||||
|
|
||||||
|
Alternatively, use the Expo CLI directly:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npx expo run:android --variant release
|
||||||
|
```
|
||||||
|
|
||||||
|
## Distribution
|
||||||
|
|
||||||
|
The `preview` profile is configured for **internal distribution** (`buildType: apk`). Share the `.apk` file directly with testers — no Play Store submission needed.
|
||||||
|
|
||||||
|
## Current status
|
||||||
|
|
||||||
|
- QA passed: MOB.1 (manual tasks), MOB.2 (remittance review)
|
||||||
|
- EAS project ID: `15d21320-57f5-4fb6-a116-82d222d914e2`
|
||||||
|
- Package: `com.fiberops.mobile`
|
||||||
|
- Version: `1.0.0` (versionCode: 1)
|
||||||
|
|
||||||
|
## EAS build profiles
|
||||||
|
|
||||||
|
| Profile | Distribution | Output | Use case |
|
||||||
|
|---------|-------------|--------|----------|
|
||||||
|
| `preview` | internal | APK (EAS cloud) | QA / internal testing |
|
||||||
|
| `preview-local` | internal | APK (local Gradle) | Offline / CI builds |
|
||||||
|
| `development` | internal | Dev client | Development |
|
||||||
|
| `production` | store | AAB | Play Store release |
|
||||||
7
app.json
7
app.json
@@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"expo": {
|
"expo": {
|
||||||
"name": "FiberOps",
|
"name": "FiberOps",
|
||||||
"slug": "firberops",
|
"slug": "fiberops",
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"orientation": "portrait",
|
"orientation": "portrait",
|
||||||
"icon": "./assets/icon.png",
|
"icon": "./assets/icon.png",
|
||||||
@@ -10,7 +10,7 @@
|
|||||||
"splash": {
|
"splash": {
|
||||||
"image": "./assets/splash-icon.png",
|
"image": "./assets/splash-icon.png",
|
||||||
"resizeMode": "contain",
|
"resizeMode": "contain",
|
||||||
"backgroundColor": "#2563EB"
|
"backgroundColor": "#F8FAFC"
|
||||||
},
|
},
|
||||||
"ios": {
|
"ios": {
|
||||||
"supportsTablet": false,
|
"supportsTablet": false,
|
||||||
@@ -19,9 +19,10 @@
|
|||||||
"android": {
|
"android": {
|
||||||
"adaptiveIcon": {
|
"adaptiveIcon": {
|
||||||
"foregroundImage": "./assets/adaptive-icon.png",
|
"foregroundImage": "./assets/adaptive-icon.png",
|
||||||
"backgroundColor": "#2563EB"
|
"backgroundColor": "#0891B2"
|
||||||
},
|
},
|
||||||
"package": "com.fiberops.mobile",
|
"package": "com.fiberops.mobile",
|
||||||
|
"versionCode": 1,
|
||||||
"permissions": [
|
"permissions": [
|
||||||
"android.permission.CAMERA",
|
"android.permission.CAMERA",
|
||||||
"android.permission.RECORD_AUDIO",
|
"android.permission.RECORD_AUDIO",
|
||||||
|
|||||||
87
assets/ASSETS.md
Normal file
87
assets/ASSETS.md
Normal file
@@ -0,0 +1,87 @@
|
|||||||
|
# FiberOps Mobile — Asset Guidelines
|
||||||
|
|
||||||
|
> The files in this directory are currently **placeholder** Expo defaults.
|
||||||
|
> Replace them with brand-correct assets using the specs below.
|
||||||
|
> Run `scripts/generate-assets.sh` to regenerate from SVG sources once installed.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Brand Colors
|
||||||
|
|
||||||
|
| Token | Hex | Usage |
|
||||||
|
|-------|-----|-------|
|
||||||
|
| Primary cyan | `#0891B2` | App icon background, adaptive icon background, tint color |
|
||||||
|
| Splash background | `#F8FAFC` | Splash screen background (near-white) |
|
||||||
|
| Text on cyan | `#FFFFFF` | "FO" / "FiberOps" text on colored backgrounds |
|
||||||
|
| Text on light | `#0891B2` | "FiberOps" wordmark on splash |
|
||||||
|
|
||||||
|
## Brand Font
|
||||||
|
|
||||||
|
**Fira Sans** (Bold / SemiBold) — preferred for the "FO" monogram and "FiberOps" wordmark.
|
||||||
|
Fallback: Inter, SF Pro, or any geometric sans-serif.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Asset Inventory
|
||||||
|
|
||||||
|
### `icon.png` — App Icon
|
||||||
|
- **Dimensions:** 1024 × 1024 px
|
||||||
|
- **Format:** PNG, no transparency
|
||||||
|
- **Design:** Solid `#0891B2` background with rounded corners (corner radius ~22.5 % of width ≈ 230 px), centered white "FO" wordmark in Fira Sans Bold at ~460 px.
|
||||||
|
- **Used by:** iOS home screen, App Store listing, Expo Go thumbnail.
|
||||||
|
|
||||||
|
### `adaptive-icon.png` — Android Adaptive Icon Foreground
|
||||||
|
- **Dimensions:** 1024 × 1024 px
|
||||||
|
- **Format:** PNG with **transparent** background
|
||||||
|
- **Design:** Centered white "FO" wordmark (same as icon, no background fill). Android clips to a circle/squircle and composites over `backgroundColor` (`#0891B2`).
|
||||||
|
- **Safe zone:** Keep visual content within the inner 66 % (≈ 672 px) to avoid clipping on all Android shapes.
|
||||||
|
|
||||||
|
### `android-icon-background.png`
|
||||||
|
- **Dimensions:** 1024 × 1024 px
|
||||||
|
- **Format:** PNG
|
||||||
|
- **Design:** Solid `#0891B2` fill — no other content.
|
||||||
|
|
||||||
|
### `android-icon-foreground.png`
|
||||||
|
- **Dimensions:** 1024 × 1024 px
|
||||||
|
- **Format:** PNG with transparent background
|
||||||
|
- **Design:** Same as `adaptive-icon.png`.
|
||||||
|
|
||||||
|
### `android-icon-monochrome.png`
|
||||||
|
- **Dimensions:** 1024 × 1024 px
|
||||||
|
- **Format:** PNG, single-channel (white on transparent or black on transparent)
|
||||||
|
- **Design:** Outline / solid "FO" mark only — no color fill. Used by Android 13+ themed icons.
|
||||||
|
|
||||||
|
### `splash-icon.png` — Splash Screen Logo
|
||||||
|
- **Dimensions:** 1284 × 2778 px (iPhone 14 Pro Max native) or at minimum 1024 × 1024 px centered mark
|
||||||
|
- **Format:** PNG with transparent background (Expo composites over `backgroundColor`)
|
||||||
|
- **Design:** Centered "FO" logomark (200–300 px) above "FiberOps" wordmark in `#0891B2`. Background is handled by `app.json` → `splash.backgroundColor` (`#F8FAFC`).
|
||||||
|
- **Resize mode:** `contain` (set in app.json) — keep content in the center 40 % of canvas.
|
||||||
|
|
||||||
|
### `favicon.png` — Web Favicon
|
||||||
|
- **Dimensions:** 48 × 48 px (also works at 32 × 32 and 16 × 16)
|
||||||
|
- **Format:** PNG
|
||||||
|
- **Design:** `#0891B2` square background with white "F" or "FO" mark.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Generating Assets
|
||||||
|
|
||||||
|
See `../scripts/generate-assets.sh` for the full generation pipeline using Inkscape or rsvg-convert.
|
||||||
|
|
||||||
|
Quick summary:
|
||||||
|
1. Edit `scripts/fiberops-icon.svg` (source of truth)
|
||||||
|
2. Run `scripts/generate-assets.sh`
|
||||||
|
3. All PNG files in `assets/` are overwritten with fresh exports
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## app.json Reference
|
||||||
|
|
||||||
|
| Key | Value |
|
||||||
|
|-----|-------|
|
||||||
|
| `expo.icon` | `./assets/icon.png` |
|
||||||
|
| `expo.splash.image` | `./assets/splash-icon.png` |
|
||||||
|
| `expo.splash.backgroundColor` | `#F8FAFC` |
|
||||||
|
| `expo.android.adaptiveIcon.foregroundImage` | `./assets/adaptive-icon.png` |
|
||||||
|
| `expo.android.adaptiveIcon.backgroundColor` | `#0891B2` |
|
||||||
|
| `expo.web.favicon` | `./assets/favicon.png` |
|
||||||
8
eas.json
8
eas.json
@@ -13,6 +13,14 @@
|
|||||||
"buildType": "apk"
|
"buildType": "apk"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"preview-local": {
|
||||||
|
"distribution": "internal",
|
||||||
|
"android": {
|
||||||
|
"buildType": "apk",
|
||||||
|
"gradleCommand": ":app:assembleRelease"
|
||||||
|
},
|
||||||
|
"env": {}
|
||||||
|
},
|
||||||
"production": {
|
"production": {
|
||||||
"autoIncrement": true
|
"autoIncrement": true
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -6,7 +6,9 @@
|
|||||||
"start": "expo start",
|
"start": "expo start",
|
||||||
"android": "expo start --android",
|
"android": "expo start --android",
|
||||||
"ios": "expo start --ios",
|
"ios": "expo start --ios",
|
||||||
"web": "expo start --web"
|
"web": "expo start --web",
|
||||||
|
"build:android:apk": "eas build --profile preview --platform android --non-interactive",
|
||||||
|
"build:android:local": "eas build --local --profile preview --platform android"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@react-native-async-storage/async-storage": "2.2.0",
|
"@react-native-async-storage/async-storage": "2.2.0",
|
||||||
|
|||||||
142
scripts/generate-assets.sh
Executable file
142
scripts/generate-assets.sh
Executable file
@@ -0,0 +1,142 @@
|
|||||||
|
#!/usr/bin/env bash
|
||||||
|
# generate-assets.sh — Generate FiberOps PNG assets from SVG sources
|
||||||
|
#
|
||||||
|
# Requirements (install one):
|
||||||
|
# brew install inkscape (macOS / Linux)
|
||||||
|
# brew install librsvg (lighter: rsvg-convert)
|
||||||
|
# apt-get install librsvg2-bin (Debian/Ubuntu)
|
||||||
|
#
|
||||||
|
# Usage:
|
||||||
|
# ./scripts/generate-assets.sh
|
||||||
|
#
|
||||||
|
# Output: assets/*.png (overwrites existing files)
|
||||||
|
|
||||||
|
set -euo pipefail
|
||||||
|
|
||||||
|
SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
|
||||||
|
REPO_ROOT="$(cd "$SCRIPT_DIR/.." && pwd)"
|
||||||
|
ASSETS="$REPO_ROOT/assets"
|
||||||
|
SVGS="$SCRIPT_DIR/svg"
|
||||||
|
|
||||||
|
# ---------------------------------------------------------------------------
|
||||||
|
# Check for a suitable SVG renderer
|
||||||
|
# ---------------------------------------------------------------------------
|
||||||
|
if command -v inkscape &>/dev/null; then
|
||||||
|
RENDERER="inkscape"
|
||||||
|
elif command -v rsvg-convert &>/dev/null; then
|
||||||
|
RENDERER="rsvg"
|
||||||
|
else
|
||||||
|
echo "ERROR: Install inkscape or librsvg (rsvg-convert) first." >&2
|
||||||
|
echo " macOS: brew install inkscape OR brew install librsvg" >&2
|
||||||
|
echo " Linux: apt-get install inkscape OR apt-get install librsvg2-bin" >&2
|
||||||
|
exit 1
|
||||||
|
fi
|
||||||
|
|
||||||
|
export_png() {
|
||||||
|
local svg="$1" out="$2" w="$3" h="$4"
|
||||||
|
echo " → $out (${w}×${h})"
|
||||||
|
if [[ "$RENDERER" == "inkscape" ]]; then
|
||||||
|
inkscape --export-type=png \
|
||||||
|
--export-filename="$out" \
|
||||||
|
--export-width="$w" \
|
||||||
|
--export-height="$h" \
|
||||||
|
"$svg" 2>/dev/null
|
||||||
|
else
|
||||||
|
rsvg-convert -w "$w" -h "$h" -o "$out" "$svg"
|
||||||
|
fi
|
||||||
|
}
|
||||||
|
|
||||||
|
mkdir -p "$SVGS"
|
||||||
|
|
||||||
|
# ---------------------------------------------------------------------------
|
||||||
|
# Inline SVG sources (written to scripts/svg/ so they can be edited)
|
||||||
|
# ---------------------------------------------------------------------------
|
||||||
|
|
||||||
|
# 1. icon-bg.svg — opaque cyan square with "FO" (used for icon.png)
|
||||||
|
cat > "$SVGS/icon-bg.svg" <<'SVG'
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024">
|
||||||
|
<rect width="1024" height="1024" rx="230" ry="230" fill="#0891B2"/>
|
||||||
|
<text x="512" y="590"
|
||||||
|
font-family="'Fira Sans', 'Inter', sans-serif"
|
||||||
|
font-weight="700"
|
||||||
|
font-size="460"
|
||||||
|
text-anchor="middle"
|
||||||
|
fill="#FFFFFF">FO</text>
|
||||||
|
</svg>
|
||||||
|
SVG
|
||||||
|
|
||||||
|
# 2. icon-fg.svg — transparent background, white "FO" (adaptive icon foreground)
|
||||||
|
cat > "$SVGS/icon-fg.svg" <<'SVG'
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024">
|
||||||
|
<text x="512" y="590"
|
||||||
|
font-family="'Fira Sans', 'Inter', sans-serif"
|
||||||
|
font-weight="700"
|
||||||
|
font-size="460"
|
||||||
|
text-anchor="middle"
|
||||||
|
fill="#FFFFFF">FO</text>
|
||||||
|
</svg>
|
||||||
|
SVG
|
||||||
|
|
||||||
|
# 3. splash.svg — transparent, centered logo for splash (composited over #F8FAFC)
|
||||||
|
cat > "$SVGS/splash.svg" <<'SVG'
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024">
|
||||||
|
<!-- Circle backdrop -->
|
||||||
|
<circle cx="512" cy="430" r="220" fill="#0891B2"/>
|
||||||
|
<!-- "FO" inside circle -->
|
||||||
|
<text x="512" y="505"
|
||||||
|
font-family="'Fira Sans', 'Inter', sans-serif"
|
||||||
|
font-weight="700"
|
||||||
|
font-size="200"
|
||||||
|
text-anchor="middle"
|
||||||
|
fill="#FFFFFF">FO</text>
|
||||||
|
<!-- "FiberOps" wordmark below -->
|
||||||
|
<text x="512" y="730"
|
||||||
|
font-family="'Fira Sans', 'Inter', sans-serif"
|
||||||
|
font-weight="600"
|
||||||
|
font-size="110"
|
||||||
|
text-anchor="middle"
|
||||||
|
fill="#0891B2">FiberOps</text>
|
||||||
|
</svg>
|
||||||
|
SVG
|
||||||
|
|
||||||
|
# 4. favicon.svg — tiny "F" on cyan
|
||||||
|
cat > "$SVGS/favicon.svg" <<'SVG'
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48" height="48">
|
||||||
|
<rect width="48" height="48" rx="8" fill="#0891B2"/>
|
||||||
|
<text x="24" y="36"
|
||||||
|
font-family="'Fira Sans', 'Inter', sans-serif"
|
||||||
|
font-weight="700"
|
||||||
|
font-size="30"
|
||||||
|
text-anchor="middle"
|
||||||
|
fill="#FFFFFF">F</text>
|
||||||
|
</svg>
|
||||||
|
SVG
|
||||||
|
|
||||||
|
# 5. monochrome.svg — white "FO" on transparent (Android 13 themed icon)
|
||||||
|
cat > "$SVGS/monochrome.svg" <<'SVG'
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024">
|
||||||
|
<text x="512" y="590"
|
||||||
|
font-family="'Fira Sans', 'Inter', sans-serif"
|
||||||
|
font-weight="700"
|
||||||
|
font-size="460"
|
||||||
|
text-anchor="middle"
|
||||||
|
fill="#FFFFFF">FO</text>
|
||||||
|
</svg>
|
||||||
|
SVG
|
||||||
|
|
||||||
|
# ---------------------------------------------------------------------------
|
||||||
|
# Export PNGs
|
||||||
|
# ---------------------------------------------------------------------------
|
||||||
|
echo "Exporting PNGs..."
|
||||||
|
|
||||||
|
export_png "$SVGS/icon-bg.svg" "$ASSETS/icon.png" 1024 1024
|
||||||
|
export_png "$SVGS/icon-fg.svg" "$ASSETS/adaptive-icon.png" 1024 1024
|
||||||
|
export_png "$SVGS/icon-fg.svg" "$ASSETS/android-icon-foreground.png" 1024 1024
|
||||||
|
export_png "$SVGS/icon-bg.svg" "$ASSETS/android-icon-background.png" 1024 1024
|
||||||
|
export_png "$SVGS/monochrome.svg" "$ASSETS/android-icon-monochrome.png" 1024 1024
|
||||||
|
export_png "$SVGS/splash.svg" "$ASSETS/splash-icon.png" 1024 1024
|
||||||
|
export_png "$SVGS/favicon.svg" "$ASSETS/favicon.png" 48 48
|
||||||
|
|
||||||
|
echo ""
|
||||||
|
echo "Done. Files written to assets/"
|
||||||
|
echo "Verify with: ls -lh assets/*.png"
|
||||||
Reference in New Issue
Block a user