diff --git a/src/components/pages/production/recording/RecordingTable.tsx b/src/components/pages/production/recording/RecordingTable.tsx
index 65cead2a..e5bd30cb 100644
--- a/src/components/pages/production/recording/RecordingTable.tsx
+++ b/src/components/pages/production/recording/RecordingTable.tsx
@@ -6,6 +6,7 @@ import useSWR from 'swr';
 import { Icon } from '@iconify/react';
 import { SortingState, CellContext } from '@tanstack/react-table';
 import { cn, formatDate } from '@/lib/helper';
+import RequirePermission from '@/components/helper/RequirePermission';
 import { useModal } from '@/components/Modal';
 import Modal from '@/components/Modal';
 import Button from '@/components/Button';
@@ -59,60 +60,70 @@ const RowOptionsMenu = ({
 
   return (
     <RowOptionsMenuWrapper type={type}>
-      <Button
-        href={`/production/recording/detail/?recordingId=${props.row.original.id}`}
-        variant='ghost'
-        color='primary'
-        className='justify-start text-sm'
-      >
-        <Icon icon='mdi:eye-outline' width={16} height={16} />
-        Detail
-      </Button>
-      <Button
-        href={`/production/recording/detail/edit/?recordingId=${props.row.original.id}`}
-        variant='ghost'
-        color='warning'
-        className='justify-start text-sm'
-      >
-        <Icon icon='mdi:pencil-outline' width={16} height={16} />
-        Edit
-      </Button>
-      {!isApproved && !isRejected && (
+      <RequirePermission permissions='lti.production.recording.detail'>
         <Button
-          onClick={approveClickHandler}
+          href={`/production/recording/detail/?recordingId=${props.row.original.id}`}
           variant='ghost'
-          color='success'
+          color='primary'
           className='justify-start text-sm'
         >
-          <Icon icon='material-symbols:check' width={16} height={16} />
-          Approve
+          <Icon icon='mdi:eye-outline' width={16} height={16} />
+          Detail
         </Button>
+      </RequirePermission>
+      <RequirePermission permissions='lti.production.recording.update'>
+        <Button
+          href={`/production/recording/detail/edit/?recordingId=${props.row.original.id}`}
+          variant='ghost'
+          color='warning'
+          className='justify-start text-sm'
+        >
+          <Icon icon='mdi:pencil-outline' width={16} height={16} />
+          Edit
+        </Button>
+      </RequirePermission>
+      {!isApproved && !isRejected && (
+        <RequirePermission permissions='lti.production.recording.approve'>
+          <Button
+            onClick={approveClickHandler}
+            variant='ghost'
+            color='success'
+            className='justify-start text-sm'
+          >
+            <Icon icon='material-symbols:check' width={16} height={16} />
+            Approve
+          </Button>
+        </RequirePermission>
       )}
       {!isApproved && !isRejected && (
+        <RequirePermission permissions='lti.production.recording.approve'>
+          <Button
+            onClick={rejectClickHandler}
+            variant='ghost'
+            color='error'
+            className='justify-start text-sm'
+          >
+            <Icon icon='material-symbols:close' width={16} height={16} />
+            Reject
+          </Button>
+        </RequirePermission>
+      )}
+      <RequirePermission permissions='lti.production.recording.delete'>
         <Button
-          onClick={rejectClickHandler}
+          onClick={deleteClickHandler}
           variant='ghost'
           color='error'
-          className='justify-start text-sm'
+          className='justify-start text-sm text-error focus-visible:text-error-content hover:text-error-content'
         >
-          <Icon icon='material-symbols:close' width={16} height={16} />
-          Reject
+          <Icon
+            icon='mdi:delete-outline'
+            width={16}
+            height={16}
+            className='justify-start text-sm'
+          />
+          Delete
         </Button>
-      )}
-      <Button
-        onClick={deleteClickHandler}
-        variant='ghost'
-        color='error'
-        className='justify-start text-sm text-error focus-visible:text-error-content hover:text-error-content'
-      >
-        <Icon
-          icon='mdi:delete-outline'
-          width={16}
-          height={16}
-          className='justify-start text-sm'
-        />
-        Delete
-      </Button>
+      </RequirePermission>
     </RowOptionsMenuWrapper>
   );
 };
@@ -514,49 +525,63 @@ const RecordingTable = () => {
       <div className='flex flex-col gap-2 mb-4'>
         <div className='w-full flex flex-col xl:flex-row justify-between items-end xl:items-center gap-2'>
           <div className='w-full sm:w-fit flex flex-col sm:flex-row self-start gap-2'>
-            <Button
-              href='/production/recording/add'
-              variant='outline'
-              color='primary'
-              className='w-full sm:w-fit'
-            >
-              <Icon icon='ic:round-plus' width={24} height={24} />
-              Tambah
-            </Button>
+            <RequirePermission permissions='lti.production.recording.create'>
+              <Button
+                href='/production/recording/add'
+                variant='outline'
+                color='primary'
+                className='w-full sm:w-fit'
+              >
+                <Icon icon='ic:round-plus' width={24} height={24} />
+                Tambah
+              </Button>
+            </RequirePermission>
 
             {selectedRowIds.length > 0 && (
               <>
-                <Button
-                  variant='outline'
-                  color='success'
-                  onClick={() => {
-                    setApprovalNotes('');
-                    approveModal.openModal();
-                  }}
-                  disabled={
-                    selectedRowIds.length === 0 || eligibleRowIds.length === 0
-                  }
-                  className='w-full sm:w-fit'
-                >
-                  <Icon icon='material-symbols:check' width={24} height={24} />
-                  Approve
-                </Button>
+                <RequirePermission permissions='lti.production.recording.approve'>
+                  <Button
+                    variant='outline'
+                    color='success'
+                    onClick={() => {
+                      setApprovalNotes('');
+                      approveModal.openModal();
+                    }}
+                    disabled={
+                      selectedRowIds.length === 0 || eligibleRowIds.length === 0
+                    }
+                    className='w-full sm:w-fit'
+                  >
+                    <Icon
+                      icon='material-symbols:check'
+                      width={24}
+                      height={24}
+                    />
+                    Approve
+                  </Button>
+                </RequirePermission>
 
-                <Button
-                  variant='outline'
-                  color='error'
-                  onClick={() => {
-                    setApprovalNotes('');
-                    rejectModal.openModal();
-                  }}
-                  disabled={
-                    selectedRowIds.length === 0 || eligibleRowIds.length === 0
-                  }
-                  className='w-full sm:w-fit'
-                >
-                  <Icon icon='material-symbols:close' width={24} height={24} />
-                  Reject
-                </Button>
+                <RequirePermission permissions='lti.production.recording.approve'>
+                  <Button
+                    variant='outline'
+                    color='error'
+                    onClick={() => {
+                      setApprovalNotes('');
+                      rejectModal.openModal();
+                    }}
+                    disabled={
+                      selectedRowIds.length === 0 || eligibleRowIds.length === 0
+                    }
+                    className='w-full sm:w-fit'
+                  >
+                    <Icon
+                      icon='material-symbols:close'
+                      width={24}
+                      height={24}
+                    />
+                    Reject
+                  </Button>
+                </RequirePermission>
               </>
             )}
           </div>
diff --git a/src/components/pages/production/recording/form/RecordingForm.tsx b/src/components/pages/production/recording/form/RecordingForm.tsx
index 4dca38dc..c8fa3ca0 100644
--- a/src/components/pages/production/recording/form/RecordingForm.tsx
+++ b/src/components/pages/production/recording/form/RecordingForm.tsx
@@ -8,6 +8,7 @@ import useSWR from 'swr';
 
 import { Icon } from '@iconify/react';
 import Button from '@/components/Button';
+import RequirePermission from '@/components/helper/RequirePermission';
 import Card from '@/components/Card';
 import Badge from '@/components/Badge';
 import NumberInput from '@/components/input/NumberInput';
@@ -1492,41 +1493,45 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
               !isRecordingApproved(initialValues) &&
               !isRecordingRejected(initialValues) && (
                 <div className='flex flex-row gap-2'>
-                  <Button
-                    variant='outline'
-                    color='success'
-                    onClick={() => {
-                      setApprovalNotes('');
-                      approveModal.openModal();
-                    }}
-                    isLoading={isApproveLoading}
-                    className='w-full sm:w-fit'
-                  >
-                    <Icon
-                      icon='material-symbols:check'
-                      width={24}
-                      height={24}
-                    />
-                    Approve
-                  </Button>
+                  <RequirePermission permissions='lti.production.recording.approve'>
+                    <Button
+                      variant='outline'
+                      color='success'
+                      onClick={() => {
+                        setApprovalNotes('');
+                        approveModal.openModal();
+                      }}
+                      isLoading={isApproveLoading}
+                      className='w-full sm:w-fit'
+                    >
+                      <Icon
+                        icon='material-symbols:check'
+                        width={24}
+                        height={24}
+                      />
+                      Approve
+                    </Button>
+                  </RequirePermission>
 
-                  <Button
-                    variant='outline'
-                    color='error'
-                    onClick={() => {
-                      setApprovalNotes('');
-                      rejectModal.openModal();
-                    }}
-                    isLoading={isRejectLoading}
-                    className='w-full sm:w-fit'
-                  >
-                    <Icon
-                      icon='material-symbols:close'
-                      width={24}
-                      height={24}
-                    />
-                    Reject
-                  </Button>
+                  <RequirePermission permissions='lti.production.recording.approve'>
+                    <Button
+                      variant='outline'
+                      color='error'
+                      onClick={() => {
+                        setApprovalNotes('');
+                        rejectModal.openModal();
+                      }}
+                      isLoading={isRejectLoading}
+                      className='w-full sm:w-fit'
+                    >
+                      <Icon
+                        icon='material-symbols:close'
+                        width={24}
+                        height={24}
+                      />
+                      Reject
+                    </Button>
+                  </RequirePermission>
                 </div>
               )}
           </div>
@@ -2696,36 +2701,40 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
             {/* Left side - Detail & Edit actions */}
             <div className='flex flex-col sm:flex-row justify-start gap-2 w-full sm:w-auto'>
               {type === 'detail' && deleteRecordingClickHandler && (
-                <Button
-                  type='button'
-                  color='error'
-                  onClick={deleteRecordingClickHandler}
-                  className='px-4'
-                >
-                  <Icon
-                    icon='material-symbols:delete-outline-rounded'
-                    width={24}
-                    height={24}
-                    className='justify-start text-sm'
-                  />
-                  Delete
-                </Button>
+                <RequirePermission permissions='lti.production.recording.delete'>
+                  <Button
+                    type='button'
+                    color='error'
+                    onClick={deleteRecordingClickHandler}
+                    className='px-4'
+                  >
+                    <Icon
+                      icon='material-symbols:delete-outline-rounded'
+                      width={24}
+                      height={24}
+                      className='justify-start text-sm'
+                    />
+                    Delete
+                  </Button>
+                </RequirePermission>
               )}
               {type === 'detail' && initialValues && (
-                <Button
-                  type='button'
-                  color='warning'
-                  href={`/production/recording/detail/edit/?recordingId=${initialValues.id}`}
-                  className='px-4'
-                >
-                  <Icon
-                    icon='material-symbols:edit-outline'
-                    width={24}
-                    height={24}
-                    className='justify-start text-sm'
-                  />
-                  Edit
-                </Button>
+                <RequirePermission permissions='lti.production.recording.update'>
+                  <Button
+                    type='button'
+                    color='warning'
+                    href={`/production/recording/detail/edit/?recordingId=${initialValues.id}`}
+                    className='px-4'
+                  >
+                    <Icon
+                      icon='material-symbols:edit-outline'
+                      width={24}
+                      height={24}
+                      className='justify-start text-sm'
+                    />
+                    Edit
+                  </Button>
+                </RequirePermission>
               )}
             </div>
             {/* Right side actions */}