Merge pull request #4466 from pixelfed/staging

Import from Instagram
2023-06-12 05:56:27 -06:00 · 2023-06-12 05:56:27 -06:00 · d76ae33eb9
commit d76ae33eb9
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -2,6 +2,9 @@

 ## [Unreleased](https://github.com/pixelfed/pixelfed/compare/v0.11.8...dev)

+### Added
+- Import from Instagram ([#4466](https://github.com/pixelfed/pixelfed/pull/4466)) ([cf3078c5](https://github.com/pixelfed/pixelfed/commit/cf3078c5))
+
 ### Updates
 - Update Notifications.vue component, fix filtering logic to prevent endless spinner ([3df9b53f](https://github.com/pixelfed/pixelfed/commit/3df9b53f))
 - Update Direct Messages, fix api endpoint ([fe8728c0](https://github.com/pixelfed/pixelfed/commit/fe8728c0))
--- a/app/Console/Commands/ImportUploadGarbageCollection.php
+++ b/app/Console/Commands/ImportUploadGarbageCollection.php
@ -0,0 +1,49 @@
+<?php
+
+namespace App\Console\Commands;
+
+use Illuminate\Console\Command;
+use App\Models\ImportPost;
+use Storage;
+use App\Services\ImportService;
+
+class ImportUploadGarbageCollection extends Command
+{
+    /**
+     * The name and signature of the console command.
+     *
+     * @var string
+     */
+    protected $signature = 'app:import-upload-garbage-collection';
+
+    /**
+     * The console command description.
+     *
+     * @var string
+     */
+    protected $description = 'Command description';
+
+    /**
+     * Execute the console command.
+     */
+    public function handle()
+    {
+        if(!config('import.instagram.enabled')) {
+            return;
+        }
+
+        $ips = ImportPost::whereNull('status_id')->whereSkipMissingMedia(true)->take(100)->get();
+
+        if(!$ips->count()) {
+            return;
+        }
+
+        foreach($ips as $ip) {
+            $pid = $ip->profile_id;
+            $ip->delete();
+            ImportService::getPostCount($pid, true);
+            ImportService::clearAttempts($pid);
+            ImportService::getImportedFiles($pid, true);
+        }
+    }
+}
--- a/app/Console/Commands/TransformImports.php
+++ b/app/Console/Commands/TransformImports.php
@ -0,0 +1,122 @@
+<?php
+
+namespace App\Console\Commands;
+
+use Illuminate\Console\Command;
+use App\Models\ImportPost;
+use App\Services\ImportService;
+use App\Media;
+use App\Profile;
+use App\Status;
+use Storage;
+use App\Services\MediaPathService;
+use Illuminate\Support\Str;
+use App\Util\Lexer\Autolink;
+
+class TransformImports extends Command
+{
+    /**
+     * The name and signature of the console command.
+     *
+     * @var string
+     */
+    protected $signature = 'app:transform-imports';
+
+    /**
+     * The console command description.
+     *
+     * @var string
+     */
+    protected $description = 'Transform imports into statuses';
+
+    /**
+     * Execute the console command.
+     */
+    public function handle()
+    {
+        if(!config('import.instagram.enabled')) {
+            return;
+        }
+
+        $ips = ImportPost::whereNull('status_id')->whereSkipMissingMedia(false)->take(100)->get();
+
+        if(!$ips->count()) {
+            return;
+        }
+
+        foreach($ips as $ip) {
+            $id = $ip->user_id;
+            $pid = $ip->profile_id;
+            $profile = Profile::find($pid);
+            $idk = ImportService::getId($ip->user_id, $ip->creation_year, $ip->creation_month, $ip->creation_day);
+
+            if(Storage::exists('imports/' . $id . '/' . $ip->filename) === false) {
+                ImportService::clearAttempts($profile->id);
+                ImportService::getPostCount($profile->id, true);
+                $ip->skip_missing_media = true;
+                $ip->save();
+                continue;
+            }
+
+            $missingMedia = false;
+            foreach($ip->media as $ipm) {
+                $fileName = last(explode('/', $ipm['uri']));
+                $og = 'imports/' . $id . '/' . $fileName;
+                if(!Storage::exists($og)) {
+                    $missingMedia = true;
+                }
+            }
+
+            if($missingMedia === true) {
+                $ip->skip_missing_media = true;
+                $ip->save();
+                continue;
+            }
+
+            $caption = $ip->caption;
+            $status = new Status;
+            $status->profile_id = $pid;
+            $status->caption = $caption;
+            $status->rendered = strlen(trim($caption)) ? Autolink::create()->autolink($ip->caption) : null;
+            $status->type = $ip->post_type;
+
+            $status->scope = 'unlisted';
+            $status->visibility = 'unlisted';
+            $status->id = $idk['id'];
+            $status->created_at = now()->parse($ip->creation_date);
+            $status->save();
+
+            foreach($ip->media as $ipm) {
+                $fileName = last(explode('/', $ipm['uri']));
+                $ext = last(explode('.', $fileName));
+                $basePath = MediaPathService::get($profile);
+                $og = 'imports/' . $id . '/' . $fileName;
+                if(!Storage::exists($og)) {
+                    $ip->skip_missing_media = true;
+                    $ip->save();
+                    continue;
+                }
+                $size = Storage::size($og);
+                $mime = Storage::mimeType($og);
+                $newFile = Str::random(40) . '.' . $ext;
+                $np = $basePath . '/' . $newFile;
+                Storage::move($og, $np);
+                $media = new Media;
+                $media->profile_id = $pid;
+                $media->user_id = $id;
+                $media->status_id = $status->id;
+                $media->media_path = $np;
+                $media->mime = $mime;
+                $media->size = $size;
+                $media->save();
+            }
+
+            $ip->status_id = $status->id;
+            $ip->creation_id = $idk['incr'];
+            $ip->save();
+
+            ImportService::clearAttempts($profile->id);
+            ImportService::getPostCount($profile->id, true);
+        }
+    }
+}
--- a/app/Console/Kernel.php
+++ b/app/Console/Kernel.php
@ -36,6 +36,11 @@ class Kernel extends ConsoleKernel
        if(in_array(config_cache('pixelfed.cloud_storage'), ['1', true, 'true']) && config('media.delete_local_after_cloud')) {
            $schedule->command('media:s3gc')->hourlyAt(15);
        }
+
+        if(config('import.instagram.enabled')) {
+            $schedule->command('app:transform-imports')->everyFourMinutes();
+            $schedule->command('app:import-upload-garbage-collection')->everyFiveMinutes();
+        }
    }

    /**
--- a/app/Http/Controllers/ImportPostController.php
+++ b/app/Http/Controllers/ImportPostController.php
@ -0,0 +1,298 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use Illuminate\Http\Request;
+use App\Models\ImportPost;
+use App\Services\ImportService;
+use App\Services\StatusService;
+use App\Http\Resources\ImportStatus;
+use App\Follower;
+use App\User;
+
+class ImportPostController extends Controller
+{
+    public function __construct()
+    {
+        $this->middleware('auth');
+    }
+
+    public function getConfig(Request $request)
+    {
+        return [
+            'enabled' => config('import.instagram.enabled'),
+
+            'limits' => [
+                'max_posts' => config('import.instagram.limits.max_posts'),
+                'max_attempts' => config('import.instagram.limits.max_attempts'),
+            ],
+
+            'allow_video_posts' => config('import.instagram.allow_video_posts'),
+
+            'permissions' => [
+                'admins_only' => config('import.instagram.permissions.admins_only'),
+                'admin_follows_only' => config('import.instagram.permissions.admin_follows_only'),
+                'min_account_age' => config('import.instagram.permissions.min_account_age'),
+                'min_follower_count' => config('import.instagram.permissions.min_follower_count'),
+            ],
+
+            'allowed' => $this->checkPermissions($request, false)
+        ];
+    }
+
+    public function getProcessingCount(Request $request)
+    {
+        abort_unless(config('import.instagram.enabled'), 404);
+
+        $processing = ImportPost::whereProfileId($request->user()->profile_id)
+            ->whereNull('status_id')
+            ->whereSkipMissingMedia(false)
+            ->count();
+
+        $finished = ImportPost::whereProfileId($request->user()->profile_id)
+            ->whereNotNull('status_id')
+            ->whereSkipMissingMedia(false)
+            ->count();
+
+        return response()->json([
+            'processing_count' => $processing,
+            'finished_count' => $finished,
+        ]);
+    }
+
+    public function getImportedFiles(Request $request)
+    {
+        abort_unless(config('import.instagram.enabled'), 404);
+
+        return response()->json(
+            ImportService::getImportedFiles($request->user()->profile_id),
+            200,
+            [],
+            JSON_UNESCAPED_SLASHES
+        );
+    }
+
+    public function getImportedPosts(Request $request)
+    {
+        abort_unless(config('import.instagram.enabled'), 404);
+
+        return ImportStatus::collection(
+            ImportPost::whereProfileId($request->user()->profile_id)
+                ->whereNotNull('status_id')
+                ->cursorPaginate(9)
+        );
+    }
+
+    public function store(Request $request)
+    {
+        abort_unless(config('import.instagram.enabled'), 404);
+        $this->checkPermissions($request);
+
+        $uid = $request->user()->id;
+        $pid = $request->user()->profile_id;
+        foreach($request->input('files') as $file) {
+            $media = $file['media'];
+            $c = collect($media);
+            $postHash = hash('sha256', $c->toJson());
+            $exts = $c->map(function($m) {
+                $fn = last(explode('/', $m['uri']));
+                return last(explode('.', $fn));
+            });
+            $postType = 'photo';
+
+            if($exts->count() > 1) {
+                if($exts->contains('mp4')) {
+                    if($exts->contains('jpg', 'png')) {
+                        $postType = 'photo:video:album';
+                    } else {
+                        $postType = 'video:album';
+                    }
+                } else {
+                    $postType = 'photo:album';
+                }
+            } else {
+                if(in_array($exts[0], ['jpg', 'png'])) {
+                    $postType = 'photo';
+                } else if(in_array($exts[0], ['mp4'])) {
+                    $postType = 'video';
+                }
+            }
+
+            $ip = new ImportPost;
+            $ip->user_id = $uid;
+            $ip->profile_id = $pid;
+            $ip->post_hash = $postHash;
+            $ip->service = 'instagram';
+            $ip->post_type = $postType;
+            $ip->media_count = $c->count();
+            $ip->media = $c->map(function($m) {
+                return [
+                    'uri' => $m['uri'],
+                    'title' => $m['title'],
+                    'creation_timestamp' => $m['creation_timestamp']
+                ];
+            })->toArray();
+            $ip->caption = $c->count() > 1 ? $file['title'] : $ip->media[0]['title'];
+            $ip->filename = last(explode('/', $ip->media[0]['uri']));
+            $ip->metadata = $c->map(function($m) {
+                return [
+                    'uri' => $m['uri'],
+                    'media_metadata' => isset($m['media_metadata']) ? $m['media_metadata'] : null
+                ];
+            })->toArray();
+            $ip->creation_date = $c->count() > 1 ? now()->parse($file['creation_timestamp']) : now()->parse($media[0]['creation_timestamp']);
+            $ip->creation_year = now()->parse($ip->creation_date)->format('y');
+            $ip->creation_month = now()->parse($ip->creation_date)->format('m');
+            $ip->creation_day = now()->parse($ip->creation_date)->format('d');
+            $ip->save();
+
+            ImportService::getImportedFiles($pid, true);
+            ImportService::getPostCount($pid, true);
+        }
+        return [
+            'msg' => 'Success'
+        ];
+    }
+
+    public function storeMedia(Request $request)
+    {
+        abort_unless(config('import.instagram.enabled'), 404);
+
+        $this->checkPermissions($request);
+
+        $mimes = config('import.allow_video_posts') ? 'mimetypes:image/png,image/jpeg,video/mp4' : 'mimetypes:image/png,image/jpeg';
+
+        $this->validate($request, [
+            'file' => 'required|array|max:10',
+            'file.*' => [
+                'required',
+                'file',
+                $mimes,
+                'max:' . config('pixelfed.max_photo_size')
+            ]
+        ]);
+
+        foreach($request->file('file') as $file) {
+            $fileName = $file->getClientOriginalName();
+            $file->storeAs('imports/' . $request->user()->id . '/', $fileName);
+        }
+
+        ImportService::getImportedFiles($request->user()->profile_id, true);
+
+        return [
+            'msg' => 'Success'
+        ];
+    }
+
+    protected function checkPermissions($request, $abortOnFail = true)
+    {
+        $user = $request->user();
+
+        if($abortOnFail) {
+            abort_unless(config('import.instagram.enabled'), 404);
+        }
+
+        if($user->is_admin) {
+            if(!$abortOnFail) {
+                return true;
+            } else {
+                return;
+            }
+        }
+
+        $admin = User::whereIsAdmin(true)->first();
+
+        if(config('import.instagram.permissions.admins_only')) {
+            if($abortOnFail) {
+                abort_unless($user->is_admin, 404, 'Only admins can use this feature.');
+            } else {
+                if(!$user->is_admin) {
+                    return false;
+                }
+            }
+        }
+
+        if(config('import.instagram.permissions.admin_follows_only')) {
+            $exists = Follower::whereProfileId($admin->profile_id)
+                    ->whereFollowingId($user->profile_id)
+                    ->exists();
+            if($abortOnFail) {
+                abort_unless(
+                    $exists,
+                    404,
+                    'Only admins, and accounts they follow can use this feature'
+                );
+            } else {
+                if(!$exists) {
+                    return false;
+                }
+            }
+        }
+
+        if(config('import.instagram.permissions.min_account_age')) {
+            $res = $user->created_at->lt(
+                now()->subDays(config('import.instagram.permissions.min_account_age'))
+            );
+            if($abortOnFail) {
+                abort_unless(
+                    $res,
+                    404,
+                    'Your account is too new to use this feature'
+                );
+            } else {
+                if(!$res) {
+                    return false;
+                }
+            }
+        }
+
+        if(config('import.instagram.permissions.min_follower_count')) {
+            $res = Follower::whereFollowingId($user->profile_id)->count() >= config('import.instagram.permissions.min_follower_count');
+            if($abortOnFail) {
+                abort_unless(
+                    $res,
+                    404,
+                    'You don\'t have enough followers to use this feature'
+                );
+            } else {
+                if(!$res) {
+                    return false;
+                }
+            }
+        }
+
+        if(intval(config('import.instagram.limits.max_posts')) > 0) {
+            $res = ImportService::getPostCount($user->profile_id) >= intval(config('import.instagram.limits.max_posts'));
+            if($abortOnFail) {
+                abort_if(
+                    $res,
+                    404,
+                    'You have reached the limit of post imports and cannot import any more posts'
+                );
+            } else {
+                if($res) {
+                    return false;
+                }
+            }
+        }
+
+        if(intval(config('import.instagram.limits.max_attempts')) > 0) {
+            $res = ImportService::getAttempts($user->profile_id) >= intval(config('import.instagram.limits.max_attempts'));
+            if($abortOnFail) {
+                abort_if(
+                    $res,
+                    404,
+                    'You have reached the limit of post import attempts and cannot import any more posts'
+                );
+            } else {
+                if($res) {
+                    return false;
+                }
+            }
+        }
+
+        if(!$abortOnFail) {
+            return true;
+        }
+    }
+}
--- a/app/Http/Resources/ImportStatus.php
+++ b/app/Http/Resources/ImportStatus.php
@ -0,0 +1,20 @@
+<?php
+
+namespace App\Http\Resources;
+
+use Illuminate\Http\Request;
+use Illuminate\Http\Resources\Json\JsonResource;
+use App\Services\StatusService;
+
+class ImportStatus extends JsonResource
+{
+    /**
+     * Transform the resource into an array.
+     *
+     * @return array<string, mixed>
+     */
+    public function toArray(Request $request): array
+    {
+        return StatusService::get($this->status_id, false);
+    }
+}
--- a/app/Models/ImportPost.php
+++ b/app/Models/ImportPost.php
@ -0,0 +1,17 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Factories\HasFactory;
+use Illuminate\Database\Eloquent\Model;
+
+class ImportPost extends Model
+{
+    use HasFactory;
+
+    protected $casts = [
+        'media' => 'array',
+        'creation_date' => 'datetime',
+        'metadata' => 'json'
+    ];
+}
--- a/app/Services/ImportService.php
+++ b/app/Services/ImportService.php
@ -0,0 +1,105 @@
+<?php
+
+namespace App\Services;
+
+use App\Models\ImportPost;
+use Cache;
+
+class ImportService
+{
+    const CACHE_KEY = 'pf:import-service:';
+
+    public static function getId($userId, $year, $month, $day)
+    {
+        if($userId > 999999) {
+            return;
+        }
+        if($year < 9 || $year > 23) {
+            return;
+        }
+        if($month < 1 || $month > 12) {
+            return;
+        }
+        if($day < 1 || $day > 31) {
+            return;
+        }
+        $start = 1;
+        $key = self::CACHE_KEY . 'getIdRange:incr:byUserId:' . $userId . ':y-' . $year . ':m-' . $month . ':d-' . $day;
+        $incr = Cache::increment($key, random_int(5, 19));
+        if($incr > 999) {
+            $daysInMonth = now()->parse($day . '-' . $month . '-' . $year)->daysInMonth;
+
+            if($month == 12) {
+                $year = $year + 1;
+                $month = 1;
+                $day = 0;
+            }
+
+            if($day + 1 >= $daysInMonth) {
+                $day = 1;
+                $month = $month + 1;
+            } else {
+                $day = $day + 1;
+            }
+            return self::getId($userId, $year, $month, $day);
+        }
+        $uid = str_pad($userId, 6, 0, STR_PAD_LEFT);
+        $year = str_pad($year, 2, 0, STR_PAD_LEFT);
+        $month = str_pad($month, 2, 0, STR_PAD_LEFT);
+        $day = str_pad($day, 2, 0, STR_PAD_LEFT);
+        $zone = $year . $month . $day . str_pad($incr, 3, 0, STR_PAD_LEFT);
+        return [
+            'id' => $start . $uid . $zone,
+            'year' => $year,
+            'month' => $month,
+            'day' => $day,
+            'incr' => $incr,
+        ];
+    }
+
+    public static function getPostCount($profileId, $refresh = false)
+    {
+        $key = self::CACHE_KEY . 'totalPostCountByProfileId:' . $profileId;
+        if($refresh) {
+            Cache::forget($key);
+        }
+        return intval(Cache::remember($key, 21600, function() use($profileId) {
+            return ImportPost::whereProfileId($profileId)->whereSkipMissingMedia(false)->count();
+        }));
+    }
+
+    public static function getAttempts($profileId)
+    {
+        $key = self::CACHE_KEY . 'attemptsByProfileId:' . $profileId;
+        return intval(Cache::remember($key, 21600, function() use($profileId) {
+            return ImportPost::whereProfileId($profileId)
+                ->whereSkipMissingMedia(false)
+                ->get()
+                ->groupBy(function($item) {
+                    return $item->created_at->format('Y-m-d');
+                })
+                ->count();
+        }));
+    }
+
+    public static function clearAttempts($profileId)
+    {
+        $key = self::CACHE_KEY . 'attemptsByProfileId:' . $profileId;
+        return Cache::forget($key);
+    }
+
+    public static function getImportedFiles($profileId, $refresh = false)
+    {
+        $key = self::CACHE_KEY . 'importedPostsByProfileId:' . $profileId;
+        if($refresh) {
+            Cache::forget($key);
+        }
+        return Cache::remember($key, 21600, function() use($profileId) {
+            return ImportPost::whereProfileId($profileId)
+                ->get()
+                ->map(function($ip) {
+                    return collect($ip->media)->map(function($m) { return $m['uri']; });
+                })->flatten();
+        });
+    }
+}
--- a/config/import.php
+++ b/config/import.php
@ -0,0 +1,47 @@
+<?php
+
+return [
+    /*
+     *  Import from Instagram
+     *
+     *  Allow users to import posts from Instagram
+     *
+     */
+    'instagram' => [
+        'enabled' => env('PF_IMPORT_FROM_INSTAGRAM', true),
+
+        'limits' => [
+            // Limit max number of posts allowed to import
+            'max_posts' => env('PF_IMPORT_IG_MAX_POSTS', 1000),
+
+            // Limit max import attempts allowed, set to -1 for unlimited
+            'max_attempts' => env('PF_IMPORT_IG_MAX_ATTEMPTS', -1),
+        ],
+
+        // Allow archived posts that will be archived upon import
+        'allow_archived_posts' => false,
+
+        // Allow video posts to be imported
+        'allow_video_posts' => env('PF_IMPORT_IG_ALLOW_VIDEO_POSTS', true),
+
+        'permissions' => [
+            // Limit to admin accounts only
+            'admins_only' => env('PF_IMPORT_IG_PERM_ADMIN_ONLY', false),
+
+            // Limit to admin accounts and local accounts they follow only
+            'admin_follows_only' => env('PF_IMPORT_IG_PERM_ADMIN_FOLLOWS_ONLY', false),
+
+            // Limit to accounts older than X in days
+            'min_account_age' => env('PF_IMPORT_IG_PERM_MIN_ACCOUNT_AGE', 1),
+
+            // Limit to accounts with a min follower count of X
+            'min_follower_count' => env('PF_IMPORT_IG_PERM_MIN_FOLLOWER_COUNT', 0),
+
+            // Limit to specific user ids, in comma separated format
+            'user_ids' => env('PF_IMPORT_IG_PERM_ONLY_USER_IDS', null),
+        ]
+    ]
+];
+
+
+
--- a/database/migrations/2023_06_10_031634_create_import_posts_table.php
+++ b/database/migrations/2023_06_10_031634_create_import_posts_table.php
@ -0,0 +1,46 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     */
+    public function up(): void
+    {
+        Schema::create('import_posts', function (Blueprint $table) {
+            $table->id();
+            $table->bigInteger('profile_id')->unsigned()->index();
+            $table->unsignedInteger('user_id')->index();
+            $table->string('service')->index();
+            $table->string('post_hash')->nullable()->index();
+            $table->string('filename')->index();
+            $table->tinyInteger('media_count')->unsigned();
+            $table->string('post_type')->nullable();
+            $table->text('caption')->nullable();
+            $table->json('media')->nullable();
+            $table->tinyInteger('creation_year')->unsigned()->nullable();
+            $table->tinyInteger('creation_month')->unsigned()->nullable();
+            $table->tinyInteger('creation_day')->unsigned()->nullable();
+            $table->tinyInteger('creation_id')->unsigned()->nullable();
+            $table->bigInteger('status_id')->unsigned()->nullable()->unique()->index();
+            $table->timestamp('creation_date')->nullable();
+            $table->json('metadata')->nullable();
+            $table->boolean('skip_missing_media')->default(false)->index();
+            $table->unique(['user_id', 'post_hash']);
+            $table->unique(['user_id', 'creation_year', 'creation_month', 'creation_day', 'creation_id'], 'import_posts_uid_phash_unique');
+            $table->timestamps();
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     */
+    public function down(): void
+    {
+        Schema::dropIfExists('import_posts');
+    }
+};
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -36,6 +36,7 @@
 		"@fancyapps/fancybox": "^3.5.7",
 		"@trevoreyre/autocomplete-vue": "^2.2.0",
 		"@web3-storage/parse-link-header": "^3.1.0",
+		"@zip.js/zip.js": "^2.7.14",
 		"animate.css": "^4.1.0",
 		"bigpicture": "^2.6.2",
 		"blurhash": "^1.1.3",
--- a/public/js/about.bundle.dcf91eae809841f8.js
+++ b/public/js/about.bundle.dcf91eae809841f8.js
--- a/public/js/account-import.js
+++ b/public/js/account-import.js
--- a/public/js/home.chunk.09c05d3c35a0e616.js.LICENSE.txt
+++ b/public/js/home.chunk.09c05d3c35a0e616.js.LICENSE.txt
--- a/public/js/changelog.bundle.500c0754dd59045b.js
+++ b/public/js/changelog.bundle.500c0754dd59045b.js
--- a/public/js/changelog.bundle.c4c82057f9628c72.js
+++ b/public/js/changelog.bundle.c4c82057f9628c72.js
--- a/public/js/compose.chunk.b06ad48bdb08a28c.js
+++ b/public/js/compose.chunk.b06ad48bdb08a28c.js
--- a/public/js/compose.chunk.eb564854474fa255.js
+++ b/public/js/compose.chunk.eb564854474fa255.js
--- a/public/js/contact.bundle.97bd609a4737ae8d.js
+++ b/public/js/contact.bundle.97bd609a4737ae8d.js
--- a/public/js/daci.chunk.914d307d69fcfcd4.js
+++ b/public/js/daci.chunk.914d307d69fcfcd4.js
--- a/public/js/daci.chunk.ed26e4b12df98c68.js
+++ b/public/js/daci.chunk.ed26e4b12df98c68.js
--- a/public/js/discover.chunk.3bf28b9cb8e2b43c.js
+++ b/public/js/discover.chunk.3bf28b9cb8e2b43c.js
--- a/public/js/discover.chunk.56d2d8cfbbecc761.js
+++ b/public/js/discover.chunk.56d2d8cfbbecc761.js
--- a/public/js/discover~findfriends.chunk.006f0079e9f5a3eb.js
+++ b/public/js/discover~findfriends.chunk.006f0079e9f5a3eb.js
--- a/public/js/discover~findfriends.chunk.877ae71a400e7766.js
+++ b/public/js/discover~findfriends.chunk.877ae71a400e7766.js
--- a/public/js/discover~hashtag.bundle.0c6a732dd741a483.js
+++ b/public/js/discover~hashtag.bundle.0c6a732dd741a483.js
--- a/public/js/discover~hashtag.bundle.54f2ac43c55bf328.js
+++ b/public/js/discover~hashtag.bundle.54f2ac43c55bf328.js
--- a/public/js/discover~memories.chunk.4c0973f4400f25b4.js
+++ b/public/js/discover~memories.chunk.4c0973f4400f25b4.js
--- a/public/js/discover~memories.chunk.53c39f9ed816845e.js
+++ b/public/js/discover~memories.chunk.53c39f9ed816845e.js
--- a/public/js/discover~myhashtags.chunk.13f89821b79c60b2.js
+++ b/public/js/discover~myhashtags.chunk.13f89821b79c60b2.js
--- a/public/js/discover~myhashtags.chunk.70e91906f0ce857a.js
+++ b/public/js/discover~myhashtags.chunk.70e91906f0ce857a.js
--- a/public/js/discover~serverfeed.chunk.017fd16f00c55e60.js
+++ b/public/js/discover~serverfeed.chunk.017fd16f00c55e60.js
--- a/public/js/discover~serverfeed.chunk.232aecc81bd2f1cb.js
+++ b/public/js/discover~serverfeed.chunk.232aecc81bd2f1cb.js
--- a/public/js/discover~settings.chunk.0214ed5defdfffe6.js
+++ b/public/js/discover~settings.chunk.0214ed5defdfffe6.js
--- a/public/js/discover~settings.chunk.72cc15c7b87b662d.js
+++ b/public/js/discover~settings.chunk.72cc15c7b87b662d.js
--- a/public/js/dms.chunk.98e12cf9137ddd87.js
+++ b/public/js/dms.chunk.98e12cf9137ddd87.js
--- a/public/js/dms.chunk.a36285d6eee3b46f.js
+++ b/public/js/dms.chunk.a36285d6eee3b46f.js
--- a/public/js/dms~message.chunk.1d2a7a110371a12b.js
+++ b/public/js/dms~message.chunk.1d2a7a110371a12b.js
--- a/public/js/dms~message.chunk.990c68dfc266b0cf.js
+++ b/public/js/dms~message.chunk.990c68dfc266b0cf.js
--- a/public/js/error404.bundle.182d0aaa2da9ed23.js
+++ b/public/js/error404.bundle.182d0aaa2da9ed23.js
--- a/public/js/help.bundle.0d8a2725bcc8ed81.js
+++ b/public/js/help.bundle.0d8a2725bcc8ed81.js
--- a/public/js/home.chunk.09c05d3c35a0e616.js
+++ b/public/js/home.chunk.09c05d3c35a0e616.js
--- a/public/js/home.chunk.2d93b527d492e6de.js
+++ b/public/js/home.chunk.2d93b527d492e6de.js
--- a/public/js/home.chunk.2d93b527d492e6de.js.LICENSE.txt
+++ b/public/js/home.chunk.2d93b527d492e6de.js.LICENSE.txt
--- a/public/js/i18n.bundle.4a5ff18de549ac4e.js
+++ b/public/js/i18n.bundle.4a5ff18de549ac4e.js
--- a/public/js/i18n.bundle.83d55d158de68d01.js
+++ b/public/js/i18n.bundle.83d55d158de68d01.js
--- a/public/js/installer.js
+++ b/public/js/installer.js
--- a/public/js/installer.js.LICENSE.txt
+++ b/public/js/installer.js.LICENSE.txt
@ -1 +0,0 @@
-/*! @source http://purl.eligrey.com/github/canvas-toBlob.js/blob/master/canvas-toBlob.js */
--- a/public/js/kb.bundle.7c3d070a9bcc0489.js
+++ b/public/js/kb.bundle.7c3d070a9bcc0489.js
@ -1 +0,0 @@
-"use strict";(self.webpackChunkpixelfed=self.webpackChunkpixelfed||[]).push([[1983],{26861:(t,e,n)=>{n.r(e),n.d(e,{default:()=>s});const s={data:function(){return{isLoaded:!1,article:void 0,related:[]}},mounted:function(){this.init()},methods:{init:function(){this.fetchArticle()},fetchArticle:function(){var t=this;axios.get("/i/hc/get",{params:{id:this.$route.params.id}}).then((function(e){t.isLoaded=!0,t.article=e.data})).catch((function(e){t.$router.push("/i/web/404")}))}}}},33981:(t,e,n)=>{function s(t){return s="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},s(t)}n.r(e),n.d(e,{render:()=>i,staticRenderFns:()=>a});var i=function(){var t=this,e=t._self._c;return e("div",{staticClass:"knowledgebase-component"},[t.isLoaded?e("div",[e("div",{staticClass:"jumbotron"},[e("div",{staticClass:"container"},[e("div",{staticClass:"row justify-content-center"},[e("div",{staticClass:"col-12 col-md-8"},[e("p",[e("router-link",{staticClass:"text-muted",attrs:{to:"/i/web/help"}},[e("i",{staticClass:"far fa-long-arrow-left"}),t._v(" "),e("span",{staticClass:"ml-2"},[t._v("Help Center")])])],1),t._v(" "),e("p",{staticClass:"h1 font-weight-bold text-narrow"},[t._v(t._s(t.article.title))])])])])]),t._v(" "),e("div",{staticClass:"container mt-5"},[e("div",{staticClass:"row justify-content-center"},[e("div",{staticClass:"col-12 col-md-8"},t._l(t.article.body,(function(n,i){return e("div",["string"==typeof n?e("div",{staticClass:"lead mb-3",domProps:{innerHTML:t._s(n)}}):t._e(),t._v(" "),"object"===s(n)&&Array.isArray(n)?e("div",{staticClass:"mb-5"},t._l(n,(function(n,s){return e("div",{staticClass:"media align-items-center mb-3"},[e("div",{staticClass:"lead rounded-circle d-flex justify-content-center align-items-center font-weight-bold mr-3",staticStyle:{width:"50px",height:"50px",background:"#F3F4F6"}},[t._v("\n\t\t\t\t\t\t\t\t\t\t"+t._s(s+1)+"\n\t\t\t\t\t\t\t\t\t")]),t._v(" "),e("div",{staticClass:"media-body"},[e("p",{staticClass:"lead mb-0",domProps:{innerHTML:t._s(n)}})])])})),0):t._e()])})),0)])])]):e("div",{staticClass:"d-flex justify-content-center mt-5"},[e("b-spinner")],1)])},a=[]},4899:(t,e,n)=>{n.r(e),n.d(e,{default:()=>a});var s=n(1519),i=n.n(s)()((function(t){return t[1]}));i.push([t.id,".knowledgebase-component .text-narrow{font-weight:900!important;letter-spacing:-.034em}.knowledgebase-component strong{font-weight:700}",""]);const a=i},75451:(t,e,n)=>{n.r(e),n.d(e,{default:()=>r});var s=n(93379),i=n.n(s),a=n(4899),o={insert:"head",singleton:!1};i()(a.default,o);const r=a.default.locals||{}},72179:(t,e,n)=>{n.r(e),n.d(e,{default:()=>o});var s=n(25823),i=n(36233),a={};for(const t in i)"default"!==t&&(a[t]=()=>i[t]);n.d(e,a);n(9234);const o=(0,n(51900).default)(i.default,s.render,s.staticRenderFns,!1,null,null,null).exports},36233:(t,e,n)=>{n.r(e),n.d(e,{default:()=>a});var s=n(26861),i={};for(const t in s)"default"!==t&&(i[t]=()=>s[t]);n.d(e,i);const a=s.default},25823:(t,e,n)=>{n.r(e);var s=n(33981),i={};for(const t in s)"default"!==t&&(i[t]=()=>s[t]);n.d(e,i)},9234:(t,e,n)=>{n.r(e);var s=n(75451),i={};for(const t in s)"default"!==t&&(i[t]=()=>s[t]);n.d(e,i)}}]);
--- a/public/js/live-player.js
+++ b/public/js/live-player.js
--- a/public/js/manifest.js
+++ b/public/js/manifest.js
@ -1 +1 @@
-(()=>{"use strict";var e,r,t,n={},d={};function o(e){var r=d[e];if(void 0!==r)return r.exports;var t=d[e]={id:e,loaded:!1,exports:{}};return n[e].call(t.exports,t,t.exports,o),t.loaded=!0,t.exports}o.m=n,e=[],o.O=(r,t,n,d)=>{if(!t){var a=1/0;for(l=0;l<e.length;l++){for(var[t,n,d]=e[l],c=!0,i=0;i<t.length;i++)(!1&d||a>=d)&&Object.keys(o.O).every((e=>o.O[e](t[i])))?t.splice(i--,1):(c=!1,d<a&&(a=d));if(c){e.splice(l--,1);var s=n();void 0!==s&&(r=s)}}return r}d=d||0;for(var l=e.length;l>0&&e[l-1][2]>d;l--)e[l]=e[l-1];e[l]=[t,n,d]},o.n=e=>{var r=e&&e.__esModule?()=>e.default:()=>e;return o.d(r,{a:r}),r},o.d=(e,r)=>{for(var t in r)o.o(r,t)&&!o.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:r[t]})},o.f={},o.e=e=>Promise.all(Object.keys(o.f).reduce(((r,t)=>(o.f[t](e,r),r)),[])),o.u=e=>"js/"+{1084:"profile~followers.bundle",1983:"kb.bundle",2470:"home.chunk",2521:"about.bundle",2530:"discover~myhashtags.chunk",2586:"compose.chunk",2732:"dms~message.chunk",3351:"discover~settings.chunk",3365:"dms.chunk",3623:"discover~findfriends.chunk",4028:"error404.bundle",4509:"static~privacy.bundle",4958:"discover.chunk",4965:"discover~memories.chunk",5865:"post.chunk",6053:"notifications.chunk",6869:"profile.chunk",7004:"help.bundle",7019:"discover~hashtag.bundle",8021:"contact.bundle",8250:"i18n.bundle",8517:"daci.chunk",8600:"changelog.bundle",8625:"profile~following.bundle",8900:"discover~serverfeed.chunk",9144:"static~tos.bundle"}[e]+"."+{1084:"eac566ea09458e75",1983:"7c3d070a9bcc0489",2470:"09c05d3c35a0e616",2521:"dcf91eae809841f8",2530:"13f89821b79c60b2",2586:"eb564854474fa255",2732:"1d2a7a110371a12b",3351:"0214ed5defdfffe6",3365:"a36285d6eee3b46f",3623:"877ae71a400e7766",4028:"f84c69eed21a7d82",4509:"60f5c03624e7626e",4958:"3bf28b9cb8e2b43c",4965:"53c39f9ed816845e",5865:"7030c12e2ba2c9cd",6053:"fa21418a86f44a18",6869:"cdd251b6c8b3716e",7004:"0d8a2725bcc8ed81",7019:"0c6a732dd741a483",8021:"97bd609a4737ae8d",8250:"83d55d158de68d01",8517:"ed26e4b12df98c68",8600:"500c0754dd59045b",8625:"193b1268a32bbd07",8900:"232aecc81bd2f1cb",9144:"d5389c3b8c2569d5"}[e]+".js",o.miniCssF=e=>({138:"css/spa",703:"css/admin",1242:"css/appdark",6170:"css/app",8737:"css/portfolio",9994:"css/landing"}[e]+".css"),o.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),o.o=(e,r)=>Object.prototype.hasOwnProperty.call(e,r),r={},t="pixelfed:",o.l=(e,n,d,a)=>{if(r[e])r[e].push(n);else{var c,i;if(void 0!==d)for(var s=document.getElementsByTagName("script"),l=0;l<s.length;l++){var u=s[l];if(u.getAttribute("src")==e||u.getAttribute("data-webpack")==t+d){c=u;break}}c||(i=!0,(c=document.createElement("script")).charset="utf-8",c.timeout=120,o.nc&&c.setAttribute("nonce",o.nc),c.setAttribute("data-webpack",t+d),c.src=e),r[e]=[n];var f=(t,n)=>{c.onerror=c.onload=null,clearTimeout(b);var d=r[e];if(delete r[e],c.parentNode&&c.parentNode.removeChild(c),d&&d.forEach((e=>e(n))),t)return t(n)},b=setTimeout(f.bind(null,void 0,{type:"timeout",target:c}),12e4);c.onerror=f.bind(null,c.onerror),c.onload=f.bind(null,c.onload),i&&document.head.appendChild(c)}},o.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.nmd=e=>(e.paths=[],e.children||(e.children=[]),e),o.p="/",(()=>{var e={8929:0,1242:0,6170:0,8737:0,703:0,9994:0,138:0};o.f.j=(r,t)=>{var n=o.o(e,r)?e[r]:void 0;if(0!==n)if(n)t.push(n[2]);else if(/^(1242|138|6170|703|8737|8929|9994)$/.test(r))e[r]=0;else{var d=new Promise(((t,d)=>n=e[r]=[t,d]));t.push(n[2]=d);var a=o.p+o.u(r),c=new Error;o.l(a,(t=>{if(o.o(e,r)&&(0!==(n=e[r])&&(e[r]=void 0),n)){var d=t&&("load"===t.type?"missing":t.type),a=t&&t.target&&t.target.src;c.message="Loading chunk "+r+" failed.\n("+d+": "+a+")",c.name="ChunkLoadError",c.type=d,c.request=a,n[1](c)}}),"chunk-"+r,r)}},o.O.j=r=>0===e[r];var r=(r,t)=>{var n,d,[a,c,i]=t,s=0;if(a.some((r=>0!==e[r]))){for(n in c)o.o(c,n)&&(o.m[n]=c[n]);if(i)var l=i(o)}for(r&&r(t);s<a.length;s++)d=a[s],o.o(e,d)&&e[d]&&e[d][0](),e[d]=0;return o.O(l)},t=self.webpackChunkpixelfed=self.webpackChunkpixelfed||[];t.forEach(r.bind(null,0)),t.push=r.bind(null,t.push.bind(t))})(),o.nc=void 0})();
+(()=>{"use strict";var e,r,n,o={},t={};function c(e){var r=t[e];if(void 0!==r)return r.exports;var n=t[e]={id:e,loaded:!1,exports:{}};return o[e].call(n.exports,n,n.exports,c),n.loaded=!0,n.exports}c.m=o,e=[],c.O=(r,n,o,t)=>{if(!n){var d=1/0;for(l=0;l<e.length;l++){for(var[n,o,t]=e[l],a=!0,i=0;i<n.length;i++)(!1&t||d>=t)&&Object.keys(c.O).every((e=>c.O[e](n[i])))?n.splice(i--,1):(a=!1,t<d&&(d=t));if(a){e.splice(l--,1);var s=o();void 0!==s&&(r=s)}}return r}t=t||0;for(var l=e.length;l>0&&e[l-1][2]>t;l--)e[l]=e[l-1];e[l]=[n,o,t]},c.n=e=>{var r=e&&e.__esModule?()=>e.default:()=>e;return c.d(r,{a:r}),r},c.d=(e,r)=>{for(var n in r)c.o(r,n)&&!c.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:r[n]})},c.f={},c.e=e=>Promise.all(Object.keys(c.f).reduce(((r,n)=>(c.f[n](e,r),r)),[])),c.u=e=>"js/"+{1084:"profile~followers.bundle",2470:"home.chunk",2530:"discover~myhashtags.chunk",2586:"compose.chunk",2732:"dms~message.chunk",3351:"discover~settings.chunk",3365:"dms.chunk",3623:"discover~findfriends.chunk",4028:"error404.bundle",4958:"discover.chunk",4965:"discover~memories.chunk",5865:"post.chunk",6053:"notifications.chunk",6869:"profile.chunk",7019:"discover~hashtag.bundle",8250:"i18n.bundle",8517:"daci.chunk",8600:"changelog.bundle",8625:"profile~following.bundle",8900:"discover~serverfeed.chunk"}[e]+"."+{1084:"f088062414c3b014",2470:"2d93b527d492e6de",2530:"70e91906f0ce857a",2586:"b06ad48bdb08a28c",2732:"990c68dfc266b0cf",3351:"72cc15c7b87b662d",3365:"98e12cf9137ddd87",3623:"006f0079e9f5a3eb",4028:"182d0aaa2da9ed23",4958:"56d2d8cfbbecc761",4965:"4c0973f4400f25b4",5865:"cd535334efc77c34",6053:"bf0c641eb1fd9cde",6869:"4049e1eecea398ee",7019:"54f2ac43c55bf328",8250:"4a5ff18de549ac4e",8517:"914d307d69fcfcd4",8600:"c4c82057f9628c72",8625:"57cbb89efa73e324",8900:"017fd16f00c55e60"}[e]+".js",c.miniCssF=e=>({138:"css/spa",703:"css/admin",1242:"css/appdark",6170:"css/app",8737:"css/portfolio",9994:"css/landing"}[e]+".css"),c.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),c.o=(e,r)=>Object.prototype.hasOwnProperty.call(e,r),r={},n="pixelfed:",c.l=(e,o,t,d)=>{if(r[e])r[e].push(o);else{var a,i;if(void 0!==t)for(var s=document.getElementsByTagName("script"),l=0;l<s.length;l++){var f=s[l];if(f.getAttribute("src")==e||f.getAttribute("data-webpack")==n+t){a=f;break}}a||(i=!0,(a=document.createElement("script")).charset="utf-8",a.timeout=120,c.nc&&a.setAttribute("nonce",c.nc),a.setAttribute("data-webpack",n+t),a.src=e),r[e]=[o];var u=(n,o)=>{a.onerror=a.onload=null,clearTimeout(b);var t=r[e];if(delete r[e],a.parentNode&&a.parentNode.removeChild(a),t&&t.forEach((e=>e(o))),n)return n(o)},b=setTimeout(u.bind(null,void 0,{type:"timeout",target:a}),12e4);a.onerror=u.bind(null,a.onerror),a.onload=u.bind(null,a.onload),i&&document.head.appendChild(a)}},c.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},c.nmd=e=>(e.paths=[],e.children||(e.children=[]),e),c.p="/",(()=>{var e={8929:0,1242:0,6170:0,8737:0,703:0,9994:0,138:0};c.f.j=(r,n)=>{var o=c.o(e,r)?e[r]:void 0;if(0!==o)if(o)n.push(o[2]);else if(/^(1242|138|6170|703|8737|8929|9994)$/.test(r))e[r]=0;else{var t=new Promise(((n,t)=>o=e[r]=[n,t]));n.push(o[2]=t);var d=c.p+c.u(r),a=new Error;c.l(d,(n=>{if(c.o(e,r)&&(0!==(o=e[r])&&(e[r]=void 0),o)){var t=n&&("load"===n.type?"missing":n.type),d=n&&n.target&&n.target.src;a.message="Loading chunk "+r+" failed.\n("+t+": "+d+")",a.name="ChunkLoadError",a.type=t,a.request=d,o[1](a)}}),"chunk-"+r,r)}},c.O.j=r=>0===e[r];var r=(r,n)=>{var o,t,[d,a,i]=n,s=0;if(d.some((r=>0!==e[r]))){for(o in a)c.o(a,o)&&(c.m[o]=a[o]);if(i)var l=i(c)}for(r&&r(n);s<d.length;s++)t=d[s],c.o(e,t)&&e[t]&&e[t][0](),e[t]=0;return c.O(l)},n=self.webpackChunkpixelfed=self.webpackChunkpixelfed||[];n.forEach(r.bind(null,0)),n.push=r.bind(null,n.push.bind(n))})(),c.nc=void 0})();
--- a/public/js/notifications.chunk.bf0c641eb1fd9cde.js
+++ b/public/js/notifications.chunk.bf0c641eb1fd9cde.js
--- a/public/js/notifications.chunk.fa21418a86f44a18.js
+++ b/public/js/notifications.chunk.fa21418a86f44a18.js
--- a/public/js/post.chunk.7030c12e2ba2c9cd.js
+++ b/public/js/post.chunk.7030c12e2ba2c9cd.js
--- a/public/js/post.chunk.cd535334efc77c34.js
+++ b/public/js/post.chunk.cd535334efc77c34.js
--- a/public/js/post.chunk.cd535334efc77c34.js.LICENSE.txt
+++ b/public/js/post.chunk.cd535334efc77c34.js.LICENSE.txt
@ -0,0 +1 @@
+/*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */
--- a/public/js/profile.chunk.4049e1eecea398ee.js
+++ b/public/js/profile.chunk.4049e1eecea398ee.js
--- a/public/js/profile.chunk.cdd251b6c8b3716e.js
+++ b/public/js/profile.chunk.cdd251b6c8b3716e.js
--- a/public/js/profile~followers.bundle.f088062414c3b014.js
+++ b/public/js/profile~followers.bundle.f088062414c3b014.js
--- a/public/js/profile~following.bundle.57cbb89efa73e324.js
+++ b/public/js/profile~following.bundle.57cbb89efa73e324.js
--- a/public/js/spa.js
+++ b/public/js/spa.js
--- a/public/js/static~privacy.bundle.60f5c03624e7626e.js
+++ b/public/js/static~privacy.bundle.60f5c03624e7626e.js
--- a/public/js/static~tos.bundle.d5389c3b8c2569d5.js
+++ b/public/js/static~tos.bundle.d5389c3b8c2569d5.js
--- a/public/js/vendor.js
+++ b/public/js/vendor.js
--- a/public/js/vendor.js.LICENSE.txt
+++ b/public/js/vendor.js.LICENSE.txt
@ -48,14 +48,6 @@
 * Released under the MIT license
 */

-/*!
- * Pusher JavaScript Library v7.6.0
- * https://pusher.com/
- *
- * Copyright 2020, Pusher
- * Released under the MIT licence.
- */
-
 /*!
 * Scroll Lock v3.1.3
 * https://github.com/MohammadYounes/jquery-scrollLock
--- a/public/mix-manifest.json
+++ b/public/mix-manifest.json
@ -17,45 +17,38 @@
    "/js/story-compose.js": "/js/story-compose.js?id=cbb169145db25c0e92845710233771ac",
    "/js/direct.js": "/js/direct.js?id=5816111700ad8f8a89c932485f3a1e47",
    "/js/admin.js": "/js/admin.js?id=529801d7a4eec7b0a30f97d1941a8dee",
-    "/js/live-player.js": "/js/live-player.js?id=b07c9629c14e9952d1dbecca99ad21b6",
-    "/js/spa.js": "/js/spa.js?id=7ecabb487fd27999e701d4f27132e3ac",
+    "/js/spa.js": "/js/spa.js?id=a338b41887a4baadd731f153f2d4f215",
    "/js/stories.js": "/js/stories.js?id=4db94699502e85543192865879bece7d",
    "/js/portfolio.js": "/js/portfolio.js?id=646ebcbb4cab1dc0942dde3f8126940d",
-    "/js/installer.js": "/js/installer.js?id=cd240ae970947b76ac49032ba95e0922",
+    "/js/account-import.js": "/js/account-import.js?id=ca21a7f80259e91ea4c42a82ce5d602f",
    "/js/admin_invite.js": "/js/admin_invite.js?id=307a53250701e3b12164af9495e88447",
    "/js/landing.js": "/js/landing.js?id=7e3ab65813c4bf28182f5bdf0825774c",
-    "/js/manifest.js": "/js/manifest.js?id=633b5d48cd811dc680a8ec6c44ea34cf",
-    "/js/home.chunk.09c05d3c35a0e616.js": "/js/home.chunk.09c05d3c35a0e616.js?id=792d22267308a870b990bbfb50b63246",
-    "/js/compose.chunk.eb564854474fa255.js": "/js/compose.chunk.eb564854474fa255.js?id=6389b021170bc21b58fc5bc28920f9af",
-    "/js/post.chunk.7030c12e2ba2c9cd.js": "/js/post.chunk.7030c12e2ba2c9cd.js?id=2a9a8c36d8fc88aaf7a6495f04c81f59",
-    "/js/profile.chunk.cdd251b6c8b3716e.js": "/js/profile.chunk.cdd251b6c8b3716e.js?id=e17ed86095e207a13a93538d98ef5efb",
-    "/js/discover~memories.chunk.53c39f9ed816845e.js": "/js/discover~memories.chunk.53c39f9ed816845e.js?id=10418f271f224447d806c82309109841",
-    "/js/discover~myhashtags.chunk.13f89821b79c60b2.js": "/js/discover~myhashtags.chunk.13f89821b79c60b2.js?id=1ab590a1df630fb17333821c2022e3bf",
-    "/js/daci.chunk.ed26e4b12df98c68.js": "/js/daci.chunk.ed26e4b12df98c68.js?id=dcdeb92b271a3482b6c6e9ffe7c90e1e",
-    "/js/discover~findfriends.chunk.877ae71a400e7766.js": "/js/discover~findfriends.chunk.877ae71a400e7766.js?id=2353c39d81a83c10ae16a4d5354edc3a",
-    "/js/discover~serverfeed.chunk.232aecc81bd2f1cb.js": "/js/discover~serverfeed.chunk.232aecc81bd2f1cb.js?id=6afe6d2afb0c3599cc0bc8086c77ece4",
-    "/js/discover~settings.chunk.0214ed5defdfffe6.js": "/js/discover~settings.chunk.0214ed5defdfffe6.js?id=6b926f2ff6aa1d9f9bc51e7b3b96fb94",
-    "/js/discover.chunk.3bf28b9cb8e2b43c.js": "/js/discover.chunk.3bf28b9cb8e2b43c.js?id=2d4279114b6e085a6427598abf8c8443",
-    "/js/notifications.chunk.fa21418a86f44a18.js": "/js/notifications.chunk.fa21418a86f44a18.js?id=f72a08113822f6ed5ab218a9ea21457d",
-    "/js/dms.chunk.a36285d6eee3b46f.js": "/js/dms.chunk.a36285d6eee3b46f.js?id=752e3b061c1e76baa73b5d38657bf93e",
-    "/js/dms~message.chunk.1d2a7a110371a12b.js": "/js/dms~message.chunk.1d2a7a110371a12b.js?id=bd3b4b71f23988bdfaf09ed817219cb9",
-    "/js/profile~followers.bundle.eac566ea09458e75.js": "/js/profile~followers.bundle.eac566ea09458e75.js?id=dc50b57aa36b027c3f5a81efe9525bf2",
-    "/js/profile~following.bundle.193b1268a32bbd07.js": "/js/profile~following.bundle.193b1268a32bbd07.js?id=b9088a98eeb05f06e241d398ffad5fbd",
-    "/js/discover~hashtag.bundle.0c6a732dd741a483.js": "/js/discover~hashtag.bundle.0c6a732dd741a483.js?id=d98d19e26585f4d069ded8dced529336",
-    "/js/error404.bundle.f84c69eed21a7d82.js": "/js/error404.bundle.f84c69eed21a7d82.js?id=a5c557f4d707537aa3f023a0786dfeba",
-    "/js/help.bundle.0d8a2725bcc8ed81.js": "/js/help.bundle.0d8a2725bcc8ed81.js?id=5de97a307e5f3c6f1079fe57ff6f8294",
-    "/js/kb.bundle.7c3d070a9bcc0489.js": "/js/kb.bundle.7c3d070a9bcc0489.js?id=d1d8c0f2c80a50471e4df88c0bd4ca0d",
-    "/js/about.bundle.dcf91eae809841f8.js": "/js/about.bundle.dcf91eae809841f8.js?id=55b4ddaae96427389b23ab0dc12d44f0",
-    "/js/contact.bundle.97bd609a4737ae8d.js": "/js/contact.bundle.97bd609a4737ae8d.js?id=453c2addc6c5a26681505de5a97b252d",
-    "/js/i18n.bundle.83d55d158de68d01.js": "/js/i18n.bundle.83d55d158de68d01.js?id=06abe79741d5b8c93ad8de99edcd928d",
-    "/js/static~privacy.bundle.60f5c03624e7626e.js": "/js/static~privacy.bundle.60f5c03624e7626e.js?id=3384a4144056cbda76c3d4aaab7d5120",
-    "/js/static~tos.bundle.d5389c3b8c2569d5.js": "/js/static~tos.bundle.d5389c3b8c2569d5.js?id=6244cffbba6358ab51dbb877bda682ab",
-    "/js/changelog.bundle.500c0754dd59045b.js": "/js/changelog.bundle.500c0754dd59045b.js?id=08c219b93662101da611a8196c6eb763",
+    "/js/manifest.js": "/js/manifest.js?id=bdfa91ea22df6b311b27154ff72bae33",
+    "/js/home.chunk.2d93b527d492e6de.js": "/js/home.chunk.2d93b527d492e6de.js?id=809ef226cf2383e3a8973f65d4269d1c",
+    "/js/compose.chunk.b06ad48bdb08a28c.js": "/js/compose.chunk.b06ad48bdb08a28c.js?id=f3d7b6ec42fe6352ab0706e7f96bbd9d",
+    "/js/post.chunk.cd535334efc77c34.js": "/js/post.chunk.cd535334efc77c34.js?id=73e7e49b1dbdb75d2a128d21e6e3e9f4",
+    "/js/profile.chunk.4049e1eecea398ee.js": "/js/profile.chunk.4049e1eecea398ee.js?id=9caae6c4b8b3c0ab812a077ff82c3259",
+    "/js/discover~memories.chunk.4c0973f4400f25b4.js": "/js/discover~memories.chunk.4c0973f4400f25b4.js?id=6eb8a14fe9aa1d4fe3f0264022793b12",
+    "/js/discover~myhashtags.chunk.70e91906f0ce857a.js": "/js/discover~myhashtags.chunk.70e91906f0ce857a.js?id=5639e162321efa8b13f23b125c632bab",
+    "/js/daci.chunk.914d307d69fcfcd4.js": "/js/daci.chunk.914d307d69fcfcd4.js?id=c843c795b8551593eb19dffe1e08e694",
+    "/js/discover~findfriends.chunk.006f0079e9f5a3eb.js": "/js/discover~findfriends.chunk.006f0079e9f5a3eb.js?id=22613dff39488d0ad0c443bb6f437f5c",
+    "/js/discover~serverfeed.chunk.017fd16f00c55e60.js": "/js/discover~serverfeed.chunk.017fd16f00c55e60.js?id=79ced2608439f8959b2fd6a84aa071dd",
+    "/js/discover~settings.chunk.72cc15c7b87b662d.js": "/js/discover~settings.chunk.72cc15c7b87b662d.js?id=71342f3e1b333d80962e9e4b81fbe773",
+    "/js/discover.chunk.56d2d8cfbbecc761.js": "/js/discover.chunk.56d2d8cfbbecc761.js?id=25a401188e2fd2a43dec8011d9d62044",
+    "/js/notifications.chunk.bf0c641eb1fd9cde.js": "/js/notifications.chunk.bf0c641eb1fd9cde.js?id=5a6628e276da9c85244770910f817c0d",
+    "/js/dms.chunk.98e12cf9137ddd87.js": "/js/dms.chunk.98e12cf9137ddd87.js?id=527795bd736f56ff7d0addb623f0d60b",
+    "/js/dms~message.chunk.990c68dfc266b0cf.js": "/js/dms~message.chunk.990c68dfc266b0cf.js?id=859b1a07aa91358469143a19505f88c9",
+    "/js/profile~followers.bundle.f088062414c3b014.js": "/js/profile~followers.bundle.f088062414c3b014.js?id=dc50b57aa36b027c3f5a81efe9525bf2",
+    "/js/profile~following.bundle.57cbb89efa73e324.js": "/js/profile~following.bundle.57cbb89efa73e324.js?id=59b6dd4955ea43a1c3b116c3c3241993",
+    "/js/discover~hashtag.bundle.54f2ac43c55bf328.js": "/js/discover~hashtag.bundle.54f2ac43c55bf328.js?id=66ab49a4a126561aad7748163ae19a3f",
+    "/js/error404.bundle.182d0aaa2da9ed23.js": "/js/error404.bundle.182d0aaa2da9ed23.js?id=a5c557f4d707537aa3f023a0786dfeba",
+    "/js/i18n.bundle.4a5ff18de549ac4e.js": "/js/i18n.bundle.4a5ff18de549ac4e.js?id=16eb44f6fc379527bfdab1b40a067289",
+    "/js/changelog.bundle.c4c82057f9628c72.js": "/js/changelog.bundle.c4c82057f9628c72.js?id=d4ca9ce3642f26351e3f6049e4737ba0",
    "/css/appdark.css": "/css/appdark.css?id=7f9ba0a926020571e9c8fbedd2ec6a6f",
    "/css/app.css": "/css/app.css?id=838b7d90a81e16b8a9adc8644237606a",
    "/css/portfolio.css": "/css/portfolio.css?id=d98e354f173c6a8b729626384dceaa90",
    "/css/admin.css": "/css/admin.css?id=0a66549bf79b75a0ca8cb83d11a4e2f4",
    "/css/landing.css": "/css/landing.css?id=589f3fa192867727925921b0f68ce022",
    "/css/spa.css": "/css/spa.css?id=f6bef1e343335ee2b5cf4e9fc074856f",
-    "/js/vendor.js": "/js/vendor.js?id=84983046cff65e2066e3ab11c5a3db14"
+    "/js/vendor.js": "/js/vendor.js?id=6c95cc6034d7ff383f4fc8d47ffcf9a9"
 }
--- a/resources/assets/components/AccountImport.vue
+++ b/resources/assets/components/AccountImport.vue
@ -0,0 +1,606 @@
+<template>
+    <div class="h-100 pf-import">
+        <div v-if="!loaded" class="d-flex justify-content-center align-items-center h-100">
+            <b-spinner />
+        </div>
+        <template v-else>
+            <input type="file" name="file" class="d-none" ref="zipInput" @change="zipInputChanged" />
+            <template v-if="page === 1">
+                <div class="title">
+                    <h3 class="font-weight-bold">Import</h3>
+                </div>
+                <hr>
+                <section>
+                    <p class="lead">Account Import allows you to import your data from a supported service.</p>
+                </section>
+                <section class="mt-4">
+                    <ul class="list-group">
+                        <li class="list-group-item d-flex justify-content-between flex-column" style="gap:1rem">
+                            <div class="d-flex justify-content-between align-items-center" style="gap: 1rem;">
+                                <div>
+                                    <p class="font-weight-bold mb-1">Import from Instagram</p>
+                                    <p v-if="showDisabledWarning" class="small mb-0">This feature has been disabled by the administrators.</p>
+                                    <p v-else-if="showNotAllowedWarning" class="small mb-0">You have not been permitted to use this feature, or have reached the maximum limits. For more info, view the <a href="/site/kb/import" class="font-weight-bold">Import Help Center</a> page.</p>
+                                    <p v-else class="small mb-0">Upload the JSON export from Instagram in .zip format.<br />For more information click <a href="/site/kb/import">here</a>.</p>
+                                </div>
+                                <div v-if="!showDisabledWarning && !showNotAllowedWarning">
+                                    <button
+                                        v-if="step === 1 || invalidArchive"
+                                        type="button"
+                                        class="font-weight-bold btn btn-primary rounded-pill px-4 btn-lg"
+                                        @click="selectArchive()"
+                                        :disabled="showDisabledWarning">
+                                        Import
+                                    </button>
+
+                                    <template v-else-if="step === 2">
+                                        <div class="d-flex justify-content-center align-items-center flex-column">
+                                            <b-spinner v-if="showUploadLoader" small />
+                                            <button v-else type="button" class="font-weight-bold btn btn-outline-primary btn-sm btn-block" @click="reviewImports()">Review Imports</button>
+                                            <p v-if="zipName" class="small font-weight-bold mt-2 mb-0">{{ zipName }}</p>
+                                        </div>
+                                    </template>
+                                </div>
+                            </div>
+                        </li>
+                    </ul>
+                    <ul class="list-group mt-3">
+
+                        <li v-if="processingCount" class="list-group-item d-flex justify-content-between flex-column" style="gap:1rem">
+                            <div class="d-flex justify-content-between align-items-center">
+                                <div>
+                                    <p class="font-weight-bold mb-1">Processing Imported Posts</p>
+                                    <p class="small mb-0">These are posts that are in the process of being imported.</p>
+                                </div>
+                                <div>
+                                    <span class="btn btn-danger rounded-pill py-0 font-weight-bold" disabled>{{ processingCount }}</span>
+                                </div>
+                            </div>
+                        </li>
+
+                        <li v-if="finishedCount" class="list-group-item d-flex justify-content-between flex-column" style="gap:1rem">
+                            <div class="d-flex justify-content-between align-items-center">
+                                <div>
+                                    <p class="font-weight-bold mb-1">Imported Posts</p>
+                                    <p class="small mb-0">These are posts that have been successfully imported.</p>
+                                </div>
+                                <div>
+                                    <button
+                                        type="button"
+                                        class="font-weight-bold btn btn-primary btn-sm rounded-pill px-4 btn-block"
+                                        @click="handleReviewPosts()"
+                                        :disabled="!finishedCount">
+                                        Review {{ finishedCount }} Posts
+                                    </button>
+                                </div>
+                            </div>
+                        </li>
+                    </ul>
+
+                </section>
+            </template>
+
+            <template v-else-if="page === 2">
+                <div class="d-flex justify-content-between align-items-center">
+
+                    <div class="title">
+                        <h3 class="font-weight-bold">Import from Instagram</h3>
+                    </div>
+
+                    <button
+                        class="btn btn-primary font-weight-bold rounded-pill px-4"
+                        :class="{ disabled: !selectedMedia || !selectedMedia.length }"
+                        :disabled="!selectedMedia || !selectedMedia.length || importButtonLoading"
+                        @click="handleImport()"
+                        >
+                        <b-spinner v-if="importButtonLoading" small />
+                        <span v-else>Import</span>
+                    </button>
+                </div>
+                <hr>
+                <section>
+                    <div class="d-flex justify-content-between align-items-center mb-3">
+                        <div v-if="!selectedMedia || !selectedMedia.length">
+                            <p class="lead mb-0">Review posts you'd like to import.</p>
+                            <p class="small text-muted mb-0">Tap on posts to include them in your import.</p>
+                        </div>
+                        <p v-else class="lead mb-0"><span class="font-weight-bold">{{ selectedPostsCounter }}</span> posts selected for import</p>
+                    </div>
+                </section>
+                <section class="row mb-n5 media-selector" style="max-height: 600px;overflow-y: auto;">
+                    <div v-for="media in postMeta" class="col-12 col-md-4">
+                        <div
+                            class="square cursor-pointer"
+                            @click="toggleSelectedPost(media)">
+                            <div
+                                v-if="media.media[0].uri.endsWith('.mp4')"
+                                :class="{ selected: selectedMedia.indexOf(media.media[0].uri) != -1 }"
+                                class="info-overlay-text-label rounded">
+                                <h5 class="text-white m-auto font-weight-bold">
+                                    <span>
+                                        <span class="far fa-video fa-2x p-2 d-flex-inline"></span>
+                                    </span>
+                                </h5>
+                            </div>
+                            <div
+                                v-else
+                                class="square-content"
+                                :class="{ selected: selectedMedia.indexOf(media.media[0].uri) != -1 }"
+                                :style="{ borderRadius: '5px', backgroundImage: 'url(' + getFileNameUrl(media.media[0].uri) + ')'}">
+                            </div>
+                        </div>
+                        <div class="d-flex mt-1 justify-content-between align-items-center">
+                            <p class="small"><i class="far fa-clock"></i> {{ formatDate(media.media[0].creation_timestamp) }}</p>
+                            <p class="small font-weight-bold"><a href="#" @click.prevent="showDetailsModal(media)"><i class="far fa-info-circle"></i> Details</a></p>
+                        </div>
+                    </div>
+                </section>
+            </template>
+
+            <template v-else-if="page === 'reviewImports'">
+                <div class="d-flex justify-content-between align-items-center">
+
+                    <div class="title">
+                        <h3 class="font-weight-bold">Posts Imported from Instagram</h3>
+                    </div>
+                </div>
+                <hr>
+                <section class="row mb-n5 media-selector" style="max-height: 600px;overflow-y: auto;">
+                    <div v-for="media in importedPosts.data" class="col-12 col-md-4">
+                        <div
+                            class="square cursor-pointer">
+                            <div
+                                v-if="media.media_attachments[0].url.endsWith('.mp4')"
+                                class="info-overlay-text-label rounded">
+                                <h5 class="text-white m-auto font-weight-bold">
+                                    <span>
+                                        <span class="far fa-video fa-2x p-2 d-flex-inline"></span>
+                                    </span>
+                                </h5>
+                            </div>
+                            <div
+                                v-else
+                                class="square-content"
+                                :style="{ borderRadius: '5px', backgroundImage: 'url(' + media.media_attachments[0].url + ')'}">
+                            </div>
+                        </div>
+                        <div class="d-flex mt-1 justify-content-between align-items-center">
+                            <p class="small"><i class="far fa-clock"></i> {{ formatDate(media.created_at, false) }}</p>
+                            <p class="small font-weight-bold"><a :href="media.url"><i class="far fa-info-circle"></i> View</a></p>
+                        </div>
+                    </div>
+
+                    <div class="col-12 my-3">
+                        <button
+                            v-if="importedPosts.meta && importedPosts.meta.next_cursor"
+                            class="btn btn-primary btn-block font-weight-bold"
+                            @click="loadMorePosts()">
+                            Load more
+                        </button>
+                    </div>
+                </section>
+            </template>
+        </template>
+
+        <b-modal
+            id="detailsModal"
+            title="Post Details"
+            v-model="detailsModalShow"
+            :ok-only="true"
+            ok-title="Close"
+            centered>
+            <div class="">
+                <div v-for="(media, idx) in modalData.media" class="mb-3">
+                    <div class="list-group">
+                        <div class="list-group-item d-flex justify-content-between align-items-center">
+                            <p class="text-center font-weight-bold mb-0">Media #{{idx + 1}}</p>
+                            <img :src="getFileNameUrl(media.uri)" width="30" height="30" style="object-fit: cover; border-radius: 5px;">
+                        </div>
+                        <div class="list-group-item">
+                            <p class="small text-muted">Caption</p>
+                            <p class="mb-0 small read-more" style="font-size: 12px;overflow-y: hidden;">{{ media.title ? media.title : modalData.title }}</p>
+                        </div>
+                        <div class="list-group-item">
+                            <div class="d-flex justify-content-between align-items-center">
+                                <p class="small mb-0 text-muted">Timestamp</p>
+                                <p class="font-weight-bold mb-0">{{ formatDate(media.creation_timestamp) }}</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </b-modal>
+    </div>
+</template>
+
+<script type="text/javascript">
+    import * as zip from "@zip.js/zip.js";
+
+    export default {
+        data() {
+            return {
+                page: 1,
+                step: 1,
+                toggleLimit: 100,
+                config: {},
+                showDisabledWarning: false,
+                showNotAllowedWarning: false,
+                invalidArchive: false,
+                loaded: false,
+                existing: [],
+                zipName: undefined,
+                zipFiles: [],
+                postMeta: [],
+                imageCache: [],
+                includeArchives: false,
+                selectedMedia: [],
+                selectedPostsCounter: 0,
+                detailsModalShow: false,
+                modalData: {},
+                importedPosts: [],
+                finishedCount: undefined,
+                processingCount: undefined,
+                showUploadLoader: false,
+                importButtonLoading: false,
+            }
+        },
+
+        mounted() {
+            this.fetchConfig();
+        },
+
+        methods: {
+            fetchConfig() {
+                axios.get('/api/local/import/ig/config')
+                .then(res => {
+                    this.config = res.data;
+
+                    if(res.data.enabled == false) {
+                        this.showDisabledWarning = true;
+                        this.loaded = true;
+                    } else if(res.data.allowed == false) {
+                        this.showNotAllowedWarning = true;
+                        this.loaded = true;
+                    } else {
+                        this.fetchExisting();
+                    }
+                })
+            },
+
+            fetchExisting() {
+                axios.post('/api/local/import/ig/existing')
+                .then(res => {
+                    this.existing = res.data;
+                })
+                .finally(() => {
+                    this.fetchProcessing();
+                })
+            },
+
+            fetchProcessing() {
+                axios.post('/api/local/import/ig/processing')
+                .then(res => {
+                    this.processingCount = res.data.processing_count;
+                    this.finishedCount = res.data.finished_count;
+                })
+                .finally(() => {
+                    this.loaded = true;
+                })
+            },
+
+            selectArchive() {
+                event.currentTarget.blur();
+                swal({
+                    title: 'Upload Archive',
+                    icon: 'success',
+                    text: 'The .zip archive is probably named something like username_20230606.zip, and was downloaded from the Instagram.com website.',
+                    buttons: {
+                        cancel: "Cancel",
+                        danger: {
+                            text: "Upload zip archive",
+                            value: "upload"
+                        }
+                    }
+                })
+                .then(res => {
+                    this.$refs.zipInput.click();
+                })
+            },
+
+            zipInputChanged(event) {
+                this.step = 2;
+                this.zipName = event.target.files[0].name;
+                this.showUploadLoader = true;
+                setTimeout(() => {
+                    this.reviewImports();
+                }, 1000);
+                setTimeout(() => {
+                    this.showUploadLoader = false;
+                }, 3000);
+            },
+
+            reviewImports() {
+                this.invalidArchive = false;
+                this.checkZip();
+            },
+
+            model(file, options = {}) {
+                return (new zip.ZipReader(new zip.BlobReader(file))).getEntries(options);
+            },
+
+            formatDate(ts, unixt = true) {
+                let date = unixt ? new Date(ts * 1000) : new Date(ts);
+                return date.toLocaleDateString()
+            },
+
+            getFileNameUrl(filename) {
+                return this.imageCache.filter(e => e.filename === filename).map(e => e.blob);
+            },
+
+            showDetailsModal(entry) {
+                this.modalData = entry;
+                this.detailsModalShow = true;
+                setTimeout(() => {
+                    pixelfed.readmore();
+                }, 500);
+            },
+
+            filterPostMeta(media) {
+                let json = JSON.parse(media);
+                let res = json.filter(j => {
+                    let ids = j.media.map(m => m.uri).filter(m => {
+                        if(this.config.allow_video_posts == true) {
+                            return m.endsWith('.png') || m.endsWith('.jpg') || m.endsWith('.mp4');
+                        } else {
+                            return m.endsWith('.png') || m.endsWith('.jpg');
+                        }
+                    });
+                    return ids.length;
+                }).filter(j => {
+                    let ids = j.media.map(m => m.uri);
+                    return !this.existing.includes(ids[0]);
+                })
+                this.postMeta = res;
+                return res;
+            },
+
+            async checkZip() {
+                let file = this.$refs.zipInput.files[0];
+                let entries = await this.model(file);
+                if (entries && entries.length) {
+                    let files = await entries.filter(e => e.filename === 'content/posts_1.json');
+
+                    if(!files || !files.length) {
+                        this.contactModal(
+                            'Invalid import archive',
+                            "The .zip archive you uploaded is corrupted, or is invalid. We cannot process your import at this time.\n\nIf this issue persists, please contact an administrator.",
+                            'error'
+                        )
+                        this.invalidArchive = true;
+                        return;
+                    } else {
+                        this.readZip();
+                    }
+                }
+            },
+
+            async readZip() {
+                let file = this.$refs.zipInput.files[0];
+                let entries = await this.model(file);
+                if (entries && entries.length) {
+                    this.zipFiles = entries;
+                    let media = await entries.filter(e => e.filename === 'content/posts_1.json')[0].getData(new zip.TextWriter());
+                    this.filterPostMeta(media);
+
+                    let imgs = await Promise.all(entries.filter(entry => {
+                        return entry.filename.startsWith('media/posts/') && (entry.filename.endsWith('.png') || entry.filename.endsWith('.jpg') || entry.filename.endsWith('.mp4'));
+                    })
+                    .map(async entry => {
+                        if(
+                            entry.filename.startsWith('media/posts/') &&
+                            (
+                                entry.filename.endsWith('.png') ||
+                                entry.filename.endsWith('.jpg') ||
+                                entry.filename.endsWith('.mp4')
+                            )
+                        ) {
+                            let types = {
+                                'png': 'image/png',
+                                'jpg': 'image/jpeg',
+                                'jpeg': 'image/jpeg',
+                                'mp4': 'video/mp4'
+                            }
+                            let type = types[entry.filename.split('/').pop().split('.').pop()];
+                            let blob = await entry.getData(new zip.BlobWriter(type));
+                            let url = URL.createObjectURL(blob);
+                            return {
+                                filename: entry.filename,
+                                blob: url,
+                                file: blob
+                            }
+                        } else {
+                            return;
+                        }
+                    }));
+                    this.imageCache = imgs.flat(2);
+                }
+                setTimeout(() => {
+                    this.page = 2;
+                }, 500);
+            },
+
+            toggleLimitReached() {
+                this.contactModal(
+                    'Limit reached',
+                    "You can only import " + this.toggleLimit + " posts at a time.\nYou can import more posts after you finish importing these posts.",
+                    'error'
+                )
+            },
+
+            toggleSelectedPost(media) {
+                let filename;
+                let self = this;
+                if(media.media.length === 1) {
+                    filename = media.media[0].uri
+                    if(this.selectedMedia.indexOf(filename) == -1) {
+                        if(this.selectedPostsCounter >= this.toggleLimit) {
+                            this.toggleLimitReached();
+                            return;
+                        }
+                        this.selectedMedia.push(filename);
+                        this.selectedPostsCounter++;
+                    } else {
+                        let idx = this.selectedMedia.indexOf(filename);
+                        this.selectedMedia.splice(idx, 1);
+                        this.selectedPostsCounter--;
+                    }
+                } else {
+                    filename = media.media[0].uri
+                    if(this.selectedMedia.indexOf(filename) == -1) {
+                        if(this.selectedPostsCounter >= this.toggleLimit) {
+                            this.toggleLimitReached();
+                            return;
+                        }
+                        this.selectedPostsCounter++;
+                    } else {
+                        this.selectedPostsCounter--;
+                    }
+                    media.media.forEach(function(m) {
+                        filename = m.uri
+                        if(self.selectedMedia.indexOf(filename) == -1) {
+                            self.selectedMedia.push(filename);
+                        } else {
+                            let idx = self.selectedMedia.indexOf(filename);
+                            self.selectedMedia.splice(idx, 1);
+                        }
+                    })
+                }
+            },
+
+            sliceIntoChunks(arr, chunkSize) {
+                const res = [];
+                for (let i = 0; i < arr.length; i += chunkSize) {
+                    const chunk = arr.slice(i, i + chunkSize);
+                    res.push(chunk);
+                }
+                return res;
+            },
+
+            handleImport() {
+                swal('Importing...', "Please wait while we upload your imported posts.\n Keep this page open and do not navigate away.", 'success');
+                this.importButtonLoading = true;
+                let ic = this.imageCache.filter(e => {
+                    return this.selectedMedia.indexOf(e.filename) != -1;
+                })
+                let chunks = this.sliceIntoChunks(ic, 10);
+                chunks.forEach(c => {
+                    let formData = new FormData();
+                    c.map((e, idx) => {
+                        let file = new File([e.file], e.filename);
+                        formData.append('file['+ idx +']', file, e.filename.split('/').pop());
+                    })
+                    axios.post(
+                        '/api/local/import/ig/media',
+                        formData,
+                        {
+                            headers: {
+                                'Content-Type': `multipart/form-data`,
+                            },
+                        }
+                    )
+                    .catch(err => {
+                        this.contactModal(
+                            'Error',
+                            err.response.data.message,
+                            'error'
+                        )
+                    });
+                })
+                axios.post('/api/local/import/ig', {
+                    files: this.postMeta.filter(e => this.selectedMedia.includes(e.media[0].uri)).map(e => {
+                        if(e.hasOwnProperty('title')) {
+                            return {
+                                title: e.title,
+                                'creation_timestamp': e.creation_timestamp,
+                                uri: e.uri,
+                                media: e.media
+                            }
+                        } else {
+                            return {
+                                title: null,
+                                'creation_timestamp': null,
+                                uri: null,
+                                media: e.media
+                            }
+                        }
+                    })
+                }).then(res => {
+                    if(res) {
+                        setTimeout(() => {
+                            window.location.reload()
+                        }, 5000);
+                    }
+                }).catch(err => {
+                    this.contactModal(
+                        'Error',
+                        err.response.data.error,
+                        'error'
+                    )
+                })
+            },
+
+            handleReviewPosts() {
+                this.page = 'reviewImports';
+
+                axios.post('/api/local/import/ig/posts')
+                .then(res => {
+                    this.importedPosts = res.data;
+                })
+            },
+
+            loadMorePosts() {
+                event.currentTarget.blur();
+
+                axios.post('/api/local/import/ig/posts', {
+                    cursor: this.importedPosts.meta.next_cursor
+                })
+                .then(res => {
+                    let data = res.data;
+                    data.data = [...this.importedPosts.data, ...res.data.data];
+                    this.importedPosts = data;
+                })
+            },
+
+            contactModal(title = 'Error', text, icon, closeButton = 'Close') {
+                swal({
+                    title: title,
+                    text: text,
+                    icon: icon,
+                    dangerMode: true,
+                    buttons: {
+                        ok: closeButton,
+                        danger: {
+                            text: 'Contact Support',
+                            value: 'contact'
+                        }
+                    }
+                })
+                .then(res => {
+                    if(res === 'contact') {
+                        window.location.href = '/site/contact'
+                    }
+                });
+            }
+        }
+    }
+</script>
+
+<style lang="scss" scoped>
+    .pf-import {
+        .media-selector {
+            .selected {
+                border: 5px solid red;
+            }
+        }
+    }
+</style>
--- a/resources/assets/js/account-import.js
+++ b/resources/assets/js/account-import.js
@ -0,0 +1,4 @@
+Vue.component(
+    'account-import',
+    require('./../components/AccountImport.vue').default
+);
--- a/resources/views/settings/import/home.blade.php
+++ b/resources/views/settings/import/home.blade.php
@ -1,27 +1,10 @@
@extends('settings.template')

@section('section')
+  <account-import />
+@endsection
+
+@push('scripts')
+<script type="text/javascript" src="{{ mix('js/account-import.js') }}"></script>
+@endpush

-  <div class="title">
-    <h3 class="font-weight-bold">Import</h3>
-  </div>
-  <hr>
-  <section>
-    <p class="lead">Account Import allows you to import your data from a supported service. <a href="#">Learn more.</a></p>
-    <p class="alert alert-warning"><strong>Warning: </strong> Imported posts will not appear on timelines or be delivered to followers.</p>
-  </section>
-  <section class="mt-4">
-    <p class="small text-muted font-weight-bold text-uppercase mb-3">Supported Services</p>
-    <p class="">
-      <a class="btn btn-outline-primary font-weight-bold" href="{{route('settings.import.ig')}}">Import from Instagram</a>
-    </p>
-    <hr>
-    <p class="small text-muted font-weight-bold text-uppercase mb-3">Coming Soon</p>
-    <p class="">
-      <a class="btn btn-outline-secondary font-weight-bold disabled" href="#">Import from Pixelfed</a>
-    </p>
-    <p class="">
-      <a class="btn btn-outline-secondary font-weight-bold disabled" href="#">Import from Mastodon</a>
-    </p>
-  </section>
-@endsection
--- a/resources/views/site/help.blade.php
+++ b/resources/views/site/help.blade.php
@ -254,6 +254,22 @@
        </div>
      </a>
    </div> --}}
+    <div class="col-12 col-md-6 mb-3">
+      <a href="{{route('help.import')}}" class="text-decoration-none">
+        <div class="card">
+          <div class="card-body">
+            <p class="py-1 text-center">
+              <i class="far fa-file-import text-lighter fa-2x"></i>
+            </p>
+            <p class="text-center text-muted font-weight-bold h4 mb-0">Import</p>
+            <div class="text-center pt-3">
+              <p class="small text-dark font-weight-bold mb-0">How to Import from Instagram</p>
+              <p class="small text-dark font-weight-bold mb-0">Troubleshooting Imports</p>
+            </div>
+          </div>
+        </div>
+      </a>
+    </div>
  </div>
@endsection

--- a/resources/views/site/help/import.blade.php
+++ b/resources/views/site/help/import.blade.php
@ -0,0 +1,94 @@
+@extends('site.help.partial.template', ['breadcrumb'=>'Import'])
+
+@section('section')
+
+    <div class="title">
+        <h3 class="font-weight-bold">Import</h3>
+    </div>
+    <hr>
+    <p class="lead py-3">With the Import from Instagram feature, you can seamlessly transfer your photos, captions, and even hashtags from your Instagram account to Pixelfed, ensuring a smooth transition without losing your cherished memories or creative expressions.</p>
+
+    <hr class="mb-4" />
+
+    <p class="text-center font-weight-bold">How to get your export data from Instagram:</p>
+    <ol class="pb-4">
+        <li class="mb-2">
+            <span>Follow the Instagram instructions on <strong>Downloading a copy of your data on Instagram</strong> on <a href="https://help.instagram.com/181231772500920" class="font-weight-bold">this page</a>. <strong class="text-danger small font-weight-bold">Make sure you select the JSON format</strong></span>
+        </li>
+        <li class="mb-2">
+            <span>Wait for the email from Instagram with your download link</span>
+        </li>
+        <li class="mb-2">
+            <span>Download your .zip export from Instagram</span>
+        </li>
+        <li class="mb-2">
+            <span>Navigate to the <a href="/settings/import" class="font-weight-bold">Import</a> settings page</span>
+        </li>
+        <li class="">
+            <span>Follow the instructions and import your posts 🥳</span>
+        </li>
+    </ol>
+    <hr class="mb-4" />
+
+    <p class="text-center font-weight-bold">Import Limits</p>
+
+    <div class="list-group pb-4">
+        <div class="list-group-item d-flex justify-content-between align-items-center">
+            <div>
+                <p class="font-weight-bold mb-0">Max Posts</p>
+                <p class="small mb-0">The maximum imported posts allowed</p>
+            </div>
+            <div class="font-weight-bold">{{ config('import.instagram.limits.max_posts') == -1 ? 'Unlimited' : config('import.instagram.limits.max_posts') }}</div>
+        </div>
+        <div class="list-group-item d-flex justify-content-between align-items-center">
+            <div>
+                <p class="font-weight-bold mb-0">Max Attempts</p>
+                <p class="small mb-0">The maximum import attempts allowed<br />(counted as total imports grouped by day)</p>
+            </div>
+            <div class="font-weight-bold">{{ config('import.instagram.limits.max_attempts') == -1 ? 'Unlimited' : config('import.instagram.limits.max_attempts') }}</div>
+        </div>
+        <div class="list-group-item d-flex justify-content-between align-items-center">
+            <div>
+                <p class="font-weight-bold mb-0">Video Imports</p>
+                <p class="small mb-0">The server supports importing video posts</p>
+            </div>
+            <div class="font-weight-bold">{{ config('import.instagram.allow_video_posts') ? '✅' : '❌' }}</div>
+        </div>
+    </div>
+
+    <hr class="mb-4" />
+
+    <p class="text-center font-weight-bold mb-0">Import Permissions</p>
+    <p class="text-center small">Who is allowed to use the Import feature</p>
+
+    <div class="list-group">
+        <div class="list-group-item d-flex justify-content-between align-items-center">
+            <div>
+                <p class="font-weight-bold mb-0">Only Admins</p>
+                <p class="small mb-0">Only admin accounts can import</p>
+            </div>
+            <div class="font-weight-bold">{{ config('import.instagram.permissions.admins_only') ? '✅' : '❌' }}</div>
+        </div>
+        <div class="list-group-item d-flex justify-content-between align-items-center">
+            <div>
+                <p class="font-weight-bold mb-0">Only Admins + Following</p>
+                <p class="small mb-0">Only admin accounts, or accounts they follow, can import</p>
+            </div>
+            <div class="font-weight-bold">{{ config('import.instagram.permissions.admin_follows_only') ? '✅' : '❌' }}</div>
+        </div>
+        <div class="list-group-item d-flex justify-content-between align-items-center">
+            <div>
+                <p class="font-weight-bold mb-0">Minimum Account Age</p>
+                <p class="small mb-0">Only accounts with a minimum age in days can import</p>
+            </div>
+            <div class="font-weight-bold">{{ config('import.instagram.permissions.min_account_age')}}</div>
+        </div>
+        <div class="list-group-item d-flex justify-content-between align-items-center">
+            <div>
+                <p class="font-weight-bold mb-0">Minimum Follower Count</p>
+                <p class="small mb-0">Only accounts with a minimum follower count can import</p>
+            </div>
+            <div class="font-weight-bold">{{ config('import.instagram.permissions.min_follower_count')}}</div>
+        </div>
+    </div>
+@endsection
--- a/resources/views/site/help/partial/sidebar.blade.php
+++ b/resources/views/site/help/partial/sidebar.blade.php
@ -21,12 +21,18 @@
      {{-- <li class="nav-item {{request()->is('*/direct-messages')?'active':''}}">
        <a class="nav-link font-weight-light text-muted" href="{{route('help.dm')}}">{{__('helpcenter.directMessages')}}</a>
      </li> --}}
+      {{-- <li class="nav-item {{request()->is('*/tagging-people')?'active':''}}">
+        <a class="nav-link font-weight-light text-muted" href="{{route('help.tagging-people')}}">{{__('helpcenter.taggingPeople')}}</a>
+      </li> --}}
      <li class="nav-item {{request()->is('*/timelines')?'active':''}}">
        <a class="nav-link font-weight-light text-muted" href="{{route('help.timelines')}}">{{__('helpcenter.timelines')}}</a>
      </li>
      {{-- <li class="nav-item {{request()->is('*/embed')?'active':''}}">
        <a class="nav-link font-weight-light text-muted" href="{{route('help.embed')}}">{{__('helpcenter.embed')}}</a>
      </li> --}}
+      <li class="nav-item {{request()->is('*/import')?'active':''}}">
+        <a class="nav-link font-weight-light text-muted" href="{{route('help.import')}}">Instagram Import</a>
+      </li>
      <li class="nav-item">
        <hr>
      </li>
@ -37,23 +43,23 @@
      </li>
      {{-- <li class="nav-item {{request()->is('*/what-is-the-fediverse')?'active':''}}">
        <a class="nav-link font-weight-light text-muted" href="{{route('help.what-is-fediverse')}}">{{__('helpcenter.whatIsTheFediverse')}}</a>
-      </li> --}}
-      {{-- <li class="nav-item {{request()->is('*/controlling-visibility')?'active':''}}">
+      </li>
+      <li class="nav-item {{request()->is('*/controlling-visibility')?'active':''}}">
        <a class="nav-link font-weight-light text-muted" href="{{route('help.controlling-visibility')}}">
          {{__('helpcenter.controllingVisibility')}}
        </a>
-      </li> --}}
-      {{-- <li class="nav-item {{request()->is('*/blocking-accounts')?'active':''}}">
+      </li>
+      <li class="nav-item {{request()->is('*/blocking-accounts')?'active':''}}">
        <a class="nav-link font-weight-light text-muted" href="{{route('help.blocking-accounts')}}">
          {{__('helpcenter.blockingAccounts')}}
        </a>
-      </li> --}}
+      </li>--}}
      <li class="nav-item {{request()->is('*/safety-tips')?'active':''}}">
        <a class="nav-link font-weight-light text-muted" href="{{route('help.safety-tips')}}">
          {{__('helpcenter.safetyTips')}}
        </a>
      </li>
-      {{-- <li class="nav-item {{request()->is('*/report-something')?'active':''}}">
+      {{--<li class="nav-item {{request()->is('*/report-something')?'active':''}}">
        <a class="nav-link font-weight-light text-muted" href="{{route('help.report-something')}}">
          {{__('helpcenter.reportSomething')}}
        </a>
@ -64,4 +70,4 @@
        </a>
      </li> --}}
    </ul>
-  </div>
+  </div>
--- a/routes/web.php
+++ b/routes/web.php
@ -306,6 +306,13 @@ Route::domain(config('pixelfed.domain.app'))->middleware(['validemail', 'twofact
 			Route::get('profile/collections/{id}', 'CollectionController@getUserCollections');

 			Route::post('compose/tag/untagme', 'MediaTagController@untagProfile');
+
+			Route::post('import/ig', 'ImportPostController@store');
+			Route::get('import/ig/config', 'ImportPostController@getConfig');
+			Route::post('import/ig/media', 'ImportPostController@storeMedia');
+			Route::post('import/ig/existing', 'ImportPostController@getImportedFiles');
+			Route::post('import/ig/posts', 'ImportPostController@getImportedPosts');
+			Route::post('import/ig/processing', 'ImportPostController@getProcessingCount');
 		});

 		Route::group(['prefix' => 'web/stories'], function () {
@ -577,6 +584,7 @@ Route::domain(config('pixelfed.domain.app'))->middleware(['validemail', 'twofact
 			Route::view('tagging-people', 'site.help.tagging-people')->name('help.tagging-people');
 			Route::view('licenses', 'site.help.licenses')->name('help.licenses');
 			Route::view('instance-max-users-limit', 'site.help.instance-max-users')->name('help.instance-max-users-limit');
+			Route::view('import', 'site.help.import')->name('help.import');
 		});
 		Route::get('newsroom/{year}/{month}/{slug}', 'NewsroomController@show');
 		Route::get('newsroom/archive', 'NewsroomController@archive');
--- a/webpack.mix.js
+++ b/webpack.mix.js
@ -34,6 +34,7 @@ mix.js('resources/assets/js/app.js', 'public/js')
 .js('resources/assets/js/spa.js', 'public/js')
 .js('resources/assets/js/stories.js', 'public/js')
 .js('resources/assets/js/portfolio.js', 'public/js')
+.js('resources/assets/js/account-import.js', 'public/js')
 .js('resources/assets/js/admin_invite.js', 'public/js')
 .js('resources/assets/js/landing.js', 'public/js')
 .vue({ version: 2 });
				`@ -1 +0,0 @@`
				`/! @source http://purl.eligrey.com/github/canvas-toBlob.js/blob/master/canvas-toBlob.js /`
				`@ -1 +0,0 @@`
				"use strict";(self.webpackChunkpixelfed=self.webpackChunkpixelfed\|\|[]).push([[1983],{26861:(t,e,n)=>{n.r(e),n.d(e,{default:()=>s});const s={data:function(){return{isLoaded:!1,article:void 0,related:[]}},mounted:function(){this.init()},methods:{init:function(){this.fetchArticle()},fetchArticle:function(){var t=this;axios.get("/i/hc/get",{params:{id:this.$route.params.id}}).then((function(e){t.isLoaded=!0,t.article=e.data})).catch((function(e){t.$router.push("/i/web/404")}))}}}},33981:(t,e,n)=>{function s(t){return s="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},s(t)}n.r(e),n.d(e,{render:()=>i,staticRenderFns:()=>a});var i=function(){var t=this,e=t._self._c;return e("div",{staticClass:"knowledgebase-component"},[t.isLoaded?e("div",[e("div",{staticClass:"jumbotron"},[e("div",{staticClass:"container"},[e("div",{staticClass:"row justify-content-center"},[e("div",{staticClass:"col-12 col-md-8"},[e("p",[e("router-link",{staticClass:"text-muted",attrs:{to:"/i/web/help"}},[e("i",{staticClass:"far fa-long-arrow-left"}),t._v(" "),e("span",{staticClass:"ml-2"},[t._v("Help Center")])])],1),t._v(" "),e("p",{staticClass:"h1 font-weight-bold text-narrow"},[t._v(t._s(t.article.title))])])])])]),t._v(" "),e("div",{staticClass:"container mt-5"},[e("div",{staticClass:"row justify-content-center"},[e("div",{staticClass:"col-12 col-md-8"},t._l(t.article.body,(function(n,i){return e("div",["string"==typeof n?e("div",{staticClass:"lead mb-3",domProps:{innerHTML:t._s(n)}}):t._e(),t._v(" "),"object"===s(n)&&Array.isArray(n)?e("div",{staticClass:"mb-5"},t._l(n,(function(n,s){return e("div",{staticClass:"media align-items-center mb-3"},[e("div",{staticClass:"lead rounded-circle d-flex justify-content-center align-items-center font-weight-bold mr-3",staticStyle:{width:"50px",height:"50px",background:"#F3F4F6"}},[t._v("\n\t\t\t\t\t\t\t\t\t\t"+t._s(s+1)+"\n\t\t\t\t\t\t\t\t\t")]),t._v(" "),e("div",{staticClass:"media-body"},[e("p",{staticClass:"lead mb-0",domProps:{innerHTML:t._s(n)}})])])})),0):t._e()])})),0)])])]):e("div",{staticClass:"d-flex justify-content-center mt-5"},[e("b-spinner")],1)])},a=[]},4899:(t,e,n)=>{n.r(e),n.d(e,{default:()=>a});var s=n(1519),i=n.n(s)()((function(t){return t[1]}));i.push([t.id,".knowledgebase-component .text-narrow{font-weight:900!important;letter-spacing:-.034em}.knowledgebase-component strong{font-weight:700}",""]);const a=i},75451:(t,e,n)=>{n.r(e),n.d(e,{default:()=>r});var s=n(93379),i=n.n(s),a=n(4899),o={insert:"head",singleton:!1};i()(a.default,o);const r=a.default.locals\|\|{}},72179:(t,e,n)=>{n.r(e),n.d(e,{default:()=>o});var s=n(25823),i=n(36233),a={};for(const t in i)"default"!==t&&(a[t]=()=>i[t]);n.d(e,a);n(9234);const o=(0,n(51900).default)(i.default,s.render,s.staticRenderFns,!1,null,null,null).exports},36233:(t,e,n)=>{n.r(e),n.d(e,{default:()=>a});var s=n(26861),i={};for(const t in s)"default"!==t&&(i[t]=()=>s[t]);n.d(e,i);const a=s.default},25823:(t,e,n)=>{n.r(e);var s=n(33981),i={};for(const t in s)"default"!==t&&(i[t]=()=>s[t]);n.d(e,i)},9234:(t,e,n)=>{n.r(e);var s=n(75451),i={};for(const t in s)"default"!==t&&(i[t]=()=>s[t]);n.d(e,i)}}]);
				`@ -0,0 +1 @@`
				`/! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE /`