All files / Components/Cards/AppCard AppActionButtons.js

100% Statements 13/13
100% Branches 20/20
100% Functions 2/2
100% Lines 13/13

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92      1x 12x     12x 4x                   1x                     8x 3x                                         5x 1x                       4x 3x                         1x 1x                        
import React, { useContext } from 'react';
import { WebAppsContext } from '../../../Context/index';
 
const AppActionButtons = ({ app, setChangelog, ...props }) => {
    const { apps } = useContext(WebAppsContext);
 
    // Installed, has update
    if (app.installed && app.hasUpdate) {
        return (
            <>
                <button className="w-full dark:text-white bg-orange-300 dark:bg-orange-900 hover:bg-orange-400 dark:hover:bg-orange-800 font-bold py-2 px-4 inline-flex items-center rounded-none"
                    data-slug={app.slug} onClick={apps.update}>
                    <svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M9 19l3 3m0 0l3-3m-3 3V10" />
                    </svg>
                    Install Update
                </button>
                <button className="w-full dark:text-white bg-gray-300 dark:bg-gray-800 hover:bg-gray-400 dark:hover:bg-gray-700 font-bold py-2 px-4 inline-flex items-center rounded-none"
                    data-slug={app.slug} onClick={() => setChangelog(true)}>
                    <svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
                    </svg>
                    What's Changed?
                </button>
            </>
        );
    }
 
    // Installed, not active
    if ((app.installed && !app.active)) {
        return (
            <>
                <button className="w-full dark:text-white bg-blue-300 dark:bg-blue-900 hover:bg-blue-400 dark:hover:bg-blue-800 font-bold py-2 px-4 inline-flex items-center rounded-none"
                    data-slug={app.slug} onClick={apps.activate}>
                    <svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 12l2 2 4-4M7.835 4.697a3.42 3.42 0 001.946-.806 3.42 3.42 0 014.438 0 3.42 3.42 0 001.946.806 3.42 3.42 0 013.138 3.138 3.42 3.42 0 00.806 1.946 3.42 3.42 0 010 4.438 3.42 3.42 0 00-.806 1.946 3.42 3.42 0 01-3.138 3.138 3.42 3.42 0 00-1.946.806 3.42 3.42 0 01-4.438 0 3.42 3.42 0 00-1.946-.806 3.42 3.42 0 01-3.138-3.138 3.42 3.42 0 00-.806-1.946 3.42 3.42 0 010-4.438 3.42 3.42 0 00.806-1.946 3.42 3.42 0 013.138-3.138z" />
                    </svg>
                    Activate
                </button>
                <button className="w-full dark:text-white bg-gray-300 dark:bg-gray-800 hover:bg-gray-400 dark:hover:bg-gray-700 font-bold py-2 px-4 inline-flex items-center rounded-none"
                    data-slug={app.slug} onClick={apps.uninstall}>
                    <svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" />
                    </svg>
                    Uninstall
                </button>
            </>
        )
    }
 
    // Not downloaded, not installed
    if (!app.downloaded && !app.installed) {
        return (
            <button className="w-full dark:text-white bg-green-300 dark:bg-green-900 hover:bg-green-400 dark:hover:bg-green-800 font-bold py-2 px-4 inline-flex items-center rounded-none"
                data-slug={app.slug} onClick={apps.download}>
                <svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                    <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M9 19l3 3m0 0l3-3m-3 3V10" />
                </svg>
                Install
            </button>
        )
    }
 
    // Downloaded, but not installed
    if (app.downloaded && !app.installed) {
        return (
            <button className="w-full dark:text-white bg-green-300 dark:bg-green-900 hover:bg-green-400 dark:hover:bg-green-800 font-bold py-2 px-4 inline-flex items-center rounded-none"
                data-slug={app.slug} onClick={apps.install}>
                <svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                    <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M9 19l3 3m0 0l3-3m-3 3V10" />
                </svg>
                Install
            </button>
        )
    }
 
    // Installed, Active, No Updates
    /* istanbul ignore else */
    if (app.installed && app.active && !app.hasUpdate) {
        return (
            <button className="w-full bg-gray-300 dark:bg-gray-800 hover:bg-gray-400 dark:hover:bg-gray-700 font-bold py-2 px-4 inline-flex items-center rounded-none"
                data-slug={app.slug} onClick={apps.deactivate}>
                <svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                    <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M20.618 5.984A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016zM12 9v2m0 4h.01" />
                </svg>
                Deactivate
            </button>
        )
    }
}
 
export default AppActionButtons;