Laravel inertia app not loading assets for first time

Question

In my Laravel app I have 3 different logins Admin, Staff, User. After the login is successful each module has different assets to be loaded. I am changing the blade file for each different user using rootView function in handleInertia middleware like this

public function rootView(Request $request){
        if(request()->is('admin/*')){
            return 'app';
        }else if(request()->is('staff/*')){
            return 'app';
        }else {
            return 'FrontEnd.app';
        }
    }

app.blade.php

<link rel="stylesheet" href="{{ asset('assets/admin/css/app.css') }}">
<link rel="stylesheet" href="{{ asset('assets/admin/css/custom-style.css') }}">

frontend.app

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css"
        href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css" />
    <link rel="stylesheet" type="text/css"
        href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.min.css" />
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js">
    </script>

Right now after the login is done the first time the assets will not load. After refreshing the page the assets get loaded. I do not understand what is wrong in my code.